src/third_party/WebKit/LayoutTests/fast/forms/input-width-height-attributes.html

   1 <!DOCTYPE HTML>
   2 <html>
   3 <head>
   4 <script src="../../resources/js-test.js"></script>
   5 </head>
   6 <body>
   7 <script>
   8 description('width and height attributes of HTMLInputElement.');
   9 </script>
  10
  11 <p id="description"></p>
  12
  13 <div id="div1">
  14     <input type="image" id="image1" src="resources/green.jpg" width="160" height="80px">
  15 </div>
  16 <br>
  17
  18 <div id="div2">
  19     <input type="image" id="image2" src="resources/green.jpg">
  20 </div>
  21 <br>
  22
  23 <div id="div3">
  24     <input type="image" id="image3" src="resources/green.jpg">
  25 </div>
  26 <br>
  27
  28 <div id="div4">
  29     <input type="image" id="image4" src="resources/green.jpg">
  30 </div>
  31 <br>
  32
  33 <div id="div5">
  34     <input type="text" id="text1">
  35 </div>
  36 <br>
  37
  38 <div id="div6">
  39     <input type="file" id="file1">
  40 </div>
  41 <br>
  42
  43 <div id="div7">
  44     <input type="date" id="date1">
  45 </div>
  46 <br>
  47
  48 <div id="div8">
  49     <input type="button" id="button1">
  50 </div>
  51 <br>
  52
  53 <script>
  54 var div = document.getElementById("div1");
  55 var image1 = document.getElementById("image1");
  56 debug('Test case #1 : Image, HTML inline setting as \"160\", \"80\"');
  57 shouldBeTrue("('width' in image1)");
  58 shouldBeTrue("('height' in image1)");
  59 shouldBe('image1.width,image1.height', '160,80');
  60
  61 div = document.getElementById("div2");
  62 var image2 = document.getElementById("image2");
  63 debug('Test case #2 : Image, Setting by JavaScript API as \"260\", \"130\"');
  64 shouldBeTrue("('width' in image1)");
  65 shouldBeTrue("('height' in image1)");
  66 image2.width = 260;
  67 image2.height = 130;
  68 shouldBe('image2.width,image2.height', '260,130');
  69
  70 div = document.getElementById("div3");
  71 var image3 = document.getElementById("image3");
  72 debug('Test case #3 : Image, Setting by JavaScript API as \"120px\", \"60px\"');
  73 shouldBeTrue("('width' in image1)");
  74 shouldBeTrue("('height' in image1)");
  75 image3.width = "120px";
  76 image3.height = "60px";
  77 shouldBe('image3.width,image3.height', '0,0');
  78
  79 div = document.getElementById("div4");
  80 var image4 = document.getElementById("image4");
  81 debug('Test case #4 : Image, Setting by JavaScript API as \"120.99\", \"60.55\"');
  82 shouldBeTrue("('width' in image1)");
  83 shouldBeTrue("('height' in image1)");
  84 image4.width = 120.99;
  85 image4.height = 60.99;
  86 shouldBe('image4.width,image4.height', '120,60');
  87
  88 div = document.getElementById("div5");
  89 var text1 = document.getElementById("text1");
  90 debug('Test case #5 : Text, Setting by JavaScript API as \"100\", \"50\"');
  91 shouldBeTrue("('width' in text1)");
  92 shouldBeTrue("('height' in text1)");
  93 text1.width = 100;
  94 text1.height = 50;
  95 shouldBe('text1.width,text1.height', '0,0');
  96
  97 text1.type = 'image';
  98 text1.src = "resources/green.jpg";
  99 shouldBe('text1.width,text1.height', '100,50');
 100 text1.width = 60;
 101 text1.height = 40;
 102 shouldBe('text1.width,text1.height', '60,40');
 103
 104 div = document.getElementById("div6");
 105 var file1 = document.getElementById("file1");
 106 debug('Test case #6 : File, Setting by JavaScript API as \"100\", \"50\"');
 107 shouldBeTrue("('width' in file1)");
 108 shouldBeTrue("('height' in file1)");
 109 file1.width = 100;
 110 file1.height = 50;
 111 shouldBe('file1.width,file1.height', '0,0');
 112
 113 file1.type = 'image';
 114 file1.src = "resources/green.jpg";
 115 shouldBe('file1.width,file1.height', '100,50');
 116 file1.width = 60;
 117 file1.height = 40;
 118 shouldBe('file1.width,file1.height', '60,40');
 119
 120 div = document.getElementById("div7");
 121 var date1 = document.getElementById("date1");
 122 debug('Test case #7 : Date, Setting by JavaScript API as \"100\", \"50\"');
 123 shouldBeTrue("('width' in date1)");
 124 shouldBeTrue("('height' in date1)");
 125 date1.width = 100;
 126 date1.height = 50;
 127 shouldBe('date1.width,date1.height', '0,0');
 128
 129 date1.type = 'image';
 130 date1.src = "resources/green.jpg";
 131 shouldBe('date1.width,date1.height', '100,50');
 132 date1.width = 60;
 133 date1.height = 40;
 134 shouldBe('date1.width,date1.height', '60,40');
 135
 136 div = document.getElementById("div8");
 137 var button1 = document.getElementById("button1");
 138 debug('Test case #8 : Button, Setting by JavaScript API as \"100\", \"50\"');
 139 shouldBeTrue("('width' in button1)");
 140 shouldBeTrue("('height' in button1)");
 141 button1.width = 100;
 142 button1.height = 50;
 143 shouldBe('button1.width,button1.height', '0,0');
 144
 145 button1.type = 'image';
 146 button1.src = "resources/green.jpg";
 147 shouldBe('button1.width,button1.height', '100,50');
 148 button1.width = 60;
 149 button1.height = 40;
 150 shouldBe('button1.width,button1.height', '60,40');
 151
 152 var successfullyParsed = true;
 153 </script>
 154 </body>
 155 </html>