2009-12-06 Kent Tamura <tkent@chromium.org>
authoreric@webkit.org <eric@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 7 Dec 2009 02:45:54 +0000 (02:45 +0000)
committereric@webkit.org <eric@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 7 Dec 2009 02:45:54 +0000 (02:45 +0000)
        Reviewed by Darin Adler.

        Improve portability and readability of table-percent-height* tests.
        https://bugs.webkit.org/show_bug.cgi?id=31858

        The purpose of these tests is to confirm that an element with
        height:N% inside a table cell has non-zero height. We don't need
        to check concrete pixel sizes of form controls.

        This updates the tests so that they check heights are non-zero and
        75% heights are same as corresponding 100% heights or actually 75%.

        * fast/replaced/table-percent-height-expected.txt:
        * fast/replaced/table-percent-height-text-controls-expected.txt:
        * fast/replaced/table-percent-height-text-controls.html:
        * fast/replaced/table-percent-height.html:

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@51744 268f45cc-cd09-0410-ab3c-d52691b4dbfc

LayoutTests/ChangeLog
LayoutTests/fast/replaced/table-percent-height-expected.txt
LayoutTests/fast/replaced/table-percent-height-text-controls-expected.txt
LayoutTests/fast/replaced/table-percent-height-text-controls.html
LayoutTests/fast/replaced/table-percent-height.html

index 3c518d5f936d958fecc0c4963c02779ee7ede8c7..05f3e95013c9e185d7872817792cd467e9885d33 100644 (file)
@@ -1,3 +1,22 @@
+2009-12-06  Kent Tamura  <tkent@chromium.org>
+
+        Reviewed by Darin Adler.
+
+        Improve portability and readability of table-percent-height* tests.
+        https://bugs.webkit.org/show_bug.cgi?id=31858
+
+        The purpose of these tests is to confirm that an element with
+        height:N% inside a table cell has non-zero height. We don't need
+        to check concrete pixel sizes of form controls.
+
+        This updates the tests so that they check heights are non-zero and
+        75% heights are same as corresponding 100% heights or actually 75%.
+
+        * fast/replaced/table-percent-height-expected.txt:
+        * fast/replaced/table-percent-height-text-controls-expected.txt:
+        * fast/replaced/table-percent-height-text-controls.html:
+        * fast/replaced/table-percent-height.html:
+
 2009-12-06  Fumitoshi Ukai  <ukai@chromium.org>
 
         Reviewed by Alexey Proskuryakov.
index 04ac3257431cffe99dfb969b1d4b540359590f1f..593012e7f687202c6f2d3b9b2ab55f351f7333c5 100644 (file)
@@ -27,58 +27,50 @@ This test checks that replaced elements with percentage heights within table cel
 On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
 
 
-PASS getComputedStyleForElement(document.getElementById('canvas-75'), 'width') is '300px'
-PASS getComputedStyleForElement(document.getElementById('canvas-75'), 'height') is '112px'
-PASS getComputedStyleForElement(document.getElementById('canvas-100'), 'width') is '300px'
-PASS getComputedStyleForElement(document.getElementById('canvas-100'), 'height') is '150px'
-PASS getComputedStyleForElement(document.getElementById('embed-75'), 'width') is '300px'
-PASS getComputedStyleForElement(document.getElementById('embed-75'), 'height') is '112px'
-PASS getComputedStyleForElement(document.getElementById('embed-100'), 'width') is '300px'
-PASS getComputedStyleForElement(document.getElementById('embed-100'), 'height') is '150px'
-PASS getComputedStyleForElement(document.getElementById('img-75'), 'width') is '75px'
-PASS getComputedStyleForElement(document.getElementById('img-75'), 'height') is '75px'
-PASS getComputedStyleForElement(document.getElementById('img-100'), 'width') is '100px'
-PASS getComputedStyleForElement(document.getElementById('img-100'), 'height') is '100px'
-PASS getComputedStyleForElement(document.getElementById('object-75'), 'width') is '300px'
-PASS getComputedStyleForElement(document.getElementById('object-75'), 'height') is '112px'
-PASS getComputedStyleForElement(document.getElementById('object-100'), 'width') is '300px'
-PASS getComputedStyleForElement(document.getElementById('object-100'), 'height') is '150px'
-PASS getComputedStyleForElement(document.getElementById('button-75'), 'width') is '51px'
-PASS getComputedStyleForElement(document.getElementById('button-75'), 'height') is '15px'
-PASS getComputedStyleForElement(document.getElementById('button-100'), 'width') is '51px'
-PASS getComputedStyleForElement(document.getElementById('button-100'), 'height') is '15px'
-PASS getComputedStyleForElement(document.getElementById('input-button-75'), 'width') is '16px'
-PASS getComputedStyleForElement(document.getElementById('input-button-75'), 'height') is '18px'
-PASS getComputedStyleForElement(document.getElementById('input-button-100'), 'width') is '16px'
-PASS getComputedStyleForElement(document.getElementById('input-button-100'), 'height') is '18px'
-PASS getComputedStyleForElement(document.getElementById('input-checkbox-75'), 'width') is '12px'
-PASS getComputedStyleForElement(document.getElementById('input-checkbox-75'), 'height') is '4px'
-PASS getComputedStyleForElement(document.getElementById('input-checkbox-100'), 'width') is '12px'
-PASS getComputedStyleForElement(document.getElementById('input-checkbox-100'), 'height') is '6px'
-PASS getComputedStyleForElement(document.getElementById('input-file-75'), 'width') is '237px'
-PASS getComputedStyleForElement(document.getElementById('input-file-75'), 'height') is '13px'
-PASS getComputedStyleForElement(document.getElementById('input-file-100'), 'width') is '237px'
-PASS getComputedStyleForElement(document.getElementById('input-file-100'), 'height') is '18px'
-PASS getComputedStyleForElement(document.getElementById('input-image-75'), 'width') is '75px'
-PASS getComputedStyleForElement(document.getElementById('input-image-75'), 'height') is '75px'
-PASS getComputedStyleForElement(document.getElementById('input-image-100'), 'width') is '100px'
-PASS getComputedStyleForElement(document.getElementById('input-image-100'), 'height') is '100px'
-PASS getComputedStyleForElement(document.getElementById('input-radio-75'), 'width') is '12px'
-PASS getComputedStyleForElement(document.getElementById('input-radio-75'), 'height') is '4px'
-PASS getComputedStyleForElement(document.getElementById('input-radio-100'), 'width') is '12px'
-PASS getComputedStyleForElement(document.getElementById('input-radio-100'), 'height') is '6px'
-PASS getComputedStyleForElement(document.getElementById('input-reset-75'), 'width') is '45px'
-PASS getComputedStyleForElement(document.getElementById('input-reset-75'), 'height') is '18px'
-PASS getComputedStyleForElement(document.getElementById('input-reset-100'), 'width') is '45px'
-PASS getComputedStyleForElement(document.getElementById('input-reset-100'), 'height') is '18px'
-PASS getComputedStyleForElement(document.getElementById('input-submit-75'), 'width') is '54px'
-PASS getComputedStyleForElement(document.getElementById('input-submit-75'), 'height') is '18px'
-PASS getComputedStyleForElement(document.getElementById('input-submit-100'), 'width') is '54px'
-PASS getComputedStyleForElement(document.getElementById('input-submit-100'), 'height') is '18px'
-PASS getComputedStyleForElement(document.getElementById('select-75'), 'width') is '68px'
-PASS getComputedStyleForElement(document.getElementById('select-75'), 'height') is '18px'
-PASS getComputedStyleForElement(document.getElementById('select-100'), 'width') is '68px'
-PASS getComputedStyleForElement(document.getElementById('select-100'), 'height') is '18px'
+PASS getWidth('canvas-75') is '300px'
+PASS getHeight('canvas-75') is '112px'
+PASS getWidth('canvas-100') is '300px'
+PASS getHeight('canvas-100') is '150px'
+PASS getWidth('embed-75') is '300px'
+PASS getHeight('embed-75') is '112px'
+PASS getWidth('embed-100') is '300px'
+PASS getHeight('embed-100') is '150px'
+PASS getWidth('img-75') is '75px'
+PASS getHeight('img-75') is '75px'
+PASS getWidth('img-100') is '100px'
+PASS getHeight('img-100') is '100px'
+PASS getWidth('object-75') is '300px'
+PASS getHeight('object-75') is '112px'
+PASS getWidth('object-100') is '300px'
+PASS getHeight('object-100') is '150px'
+PASS getWidth('button-75') is getWidth('button-100')
+PASS getHeight('button-75') != '0px' is true
+PASS getHeight('button-75') is getHeight('button-100')
+PASS getWidth('input-button-75') is getWidth('input-button-100')
+PASS getHeight('input-button-75') != '0px' is true
+PASS getHeight('input-button-75') is getHeight('input-button-100')
+PASS getWidth('input-checkbox-75') is getWidth('input-checkbox-100')
+PASS getHeight('input-checkbox-75') != '0px' is true
+PASS getHeight('input-checkbox-75') [4px] is 75% of getHeight('input-checkbox-100') [6px].
+PASS getWidth('input-file-75') is getWidth('input-file-100')
+PASS getHeight('input-file-75') != '0px' is true
+PASS getHeight('input-file-75') [13px] is 75% of getHeight('input-file-100') [18px].
+PASS getWidth('input-image-75') is '75px'
+PASS getHeight('input-image-75') is '75px'
+PASS getWidth('input-image-100') is '100px'
+PASS getHeight('input-image-100') is '100px'
+PASS getWidth('input-radio-75') is getWidth('input-radio-100')
+PASS getHeight('input-radio-75') != '0px' is true
+PASS getHeight('input-radio-75') [4px] is 75% of getHeight('input-radio-100') [6px].
+PASS getWidth('input-reset-75') is getWidth('input-reset-100')
+PASS getHeight('input-reset-75') != '0px' is true
+PASS getHeight('input-reset-75') is getHeight('input-reset-100')
+PASS getWidth('input-submit-75') is getWidth('input-submit-100')
+PASS getHeight('input-submit-75') != '0px' is true
+PASS getHeight('input-submit-75') is getHeight('input-submit-100')
+PASS getWidth('select-75') is getWidth('select-100')
+PASS getHeight('select-75') != '0px' is true
+PASS getHeight('select-75') is getHeight('select-100')
 PASS successfullyParsed is true
 
 TEST COMPLETE
index c83090aaeabfe5c83b7fae989f9851c8c1bde01c..170df51e0181a1feb4ccdea73fb6f42084c5826c 100644 (file)
@@ -11,22 +11,18 @@ This test checks that text controls with percentage heights within table cells h
 On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
 
 
-PASS MAC input-password-75 width = 128px. Expects: MAC 128px, WIN 152px
-PASS MAC/WIN input-password-75 height = 8px. Expects: MAC 8px, WIN 8px
-PASS MAC input-password-100 width = 128px. Expects: MAC 128px, WIN 152px
-PASS MAC/WIN input-password-100 height = 13px. Expects: MAC 13px, WIN 13px
-PASS MAC input-text-75 width = 128px. Expects: MAC 128px, WIN 152px
-PASS MAC/WIN input-text-75 height = 8px. Expects: MAC 8px, WIN 8px
-PASS MAC input-text-100 width = 128px. Expects: MAC 128px, WIN 152px
-PASS MAC/WIN input-text-100 height = 13px. Expects: MAC 13px, WIN 13px
-PASS MAC isindex-75 width = 122px. Expects: MAC 122px, WIN 146px
-PASS MAC/WIN isindex-75 height = 13px. Expects: MAC 13px, WIN 13px
-PASS MAC isindex-100 width = 122px. Expects: MAC 122px, WIN 146px
-PASS MAC/WIN isindex-100 height = 13px. Expects: MAC 13px, WIN 13px
-PASS MAC textarea-75 width = 129px. Expects: MAC 129px, WIN 161px
-FAIL. Doesn't match any platform's results. textarea-75 height = 18px. Expects: MAC 19px, WIN 19px
-PASS MAC textarea-100 width = 129px. Expects: MAC 129px, WIN 161px
-FAIL. Doesn't match any platform's results. textarea-100 height = 26px. Expects: MAC 28px, WIN 28px
+PASS getWidth('input-password-75') is getWidth('input-password-100')
+PASS getFullHeight('input-password-75') != '0px' is true
+PASS getFullHeight('input-password-75') [14px] is 75% of getFullHeight('input-password-100') [19px].
+PASS getWidth('input-text-75') is getWidth('input-text-100')
+PASS getFullHeight('input-text-75') != '0px' is true
+PASS getFullHeight('input-text-75') [14px] is 75% of getFullHeight('input-text-100') [19px].
+PASS getWidth('isindex-75') is getWidth('isindex-100')
+PASS getFullHeight('isindex-75') != '0px' is true
+PASS getFullHeight('isindex-75') is getFullHeight('isindex-100')
+PASS getWidth('textarea-75') is getWidth('textarea-100')
+PASS getFullHeight('textarea-75') != '0px' is true
+PASS getFullHeight('textarea-75') [24px] is 75% of getFullHeight('textarea-100') [32px].
 PASS successfullyParsed is true
 
 TEST COMPLETE
index d807ae1f536fadbc23d068dfce3469fe4c59f49c..7713a32d8390cc65fa58ffd8685ba470e61b0c79 100644 (file)
@@ -10,7 +10,7 @@ if (window.layoutTestController) {
     layoutTestController.dumpAsText();
 }
 
-function getComputedStyleForElement (element, cssPropertyName)
+function getComputedStyleForElement(element, cssPropertyName)
 {
     if (!element)
         return null;
@@ -24,21 +24,43 @@ function getComputedStyleForElement (element, cssPropertyName)
     return null;
 }
 
-function printMetrics(id, cssPropertyName, expectedMacValue, expectedWinValue) {
-  var value = getComputedStyleForElement(document.getElementById(id), cssPropertyName);
-
-  var matchingPlatform;
-  if (expectedMacValue == expectedWinValue && value == expectedMacValue)
-      matchingPlatform = 'PASS MAC/WIN';
-  else if (value == expectedMacValue)
-      matchingPlatform = 'PASS MAC';
-  else if (value == expectedWinValue)
-      matchingPlatform = 'PASS WIN';
-  else
-      matchingPlatform = 'FAIL. Doesn\'t match any platform\'s results.';
-
-  debug(matchingPlatform + ' ' + id + ' ' + cssPropertyName + ' = ' + value + '. ' +
-       'Expects: MAC ' + expectedMacValue + ', WIN ' + expectedWinValue);
+function getWidth(id)
+{
+    return getComputedStyleForElement(document.getElementById(id), 'width');
+}
+
+function getFullHeight(id)
+{
+    var element = document.getElementById(id);
+    var h = parseFloat(getComputedStyleForElement(element, 'border-top-width'));
+    h += parseFloat(getComputedStyleForElement(element, 'padding-top'));
+    h += parseFloat(getComputedStyleForElement(element, 'height'));
+    h += parseFloat(getComputedStyleForElement(element, 'padding-bottom'));
+    h += parseFloat(getComputedStyleForElement(element, 'border-bottom-width'));
+    return h + 'px';
+}
+
+function parsePixelValue(str)
+{
+    if (typeof str != "string" || str.length < 3 || str.substr(str.length - 2) != "px") {
+        testFailed(str + " is unparsable.");
+        return -1;
+    }
+    return parseFloat(str);
+}
+
+function is75PercentOf(expression75, expression100)
+{
+    var str75 = eval(expression75);
+    var str100 = eval(expression100);
+    var num75 = parsePixelValue(str75);
+    var num100 = parsePixelValue(str100);
+    if (num75 < 0 || num100 < 0)
+        return;
+    if (num75 == Math.floor(num100 * 75 / 100))
+        testPassed(expression75 + " [" + str75 + "] is 75% of " + expression100 + " [" + str100 + "].");
+    else
+        testFailed(expression75 + " [" + str75 + "] is not 75% of " + expression100 + " [" + str100 + "].");
 }
 
 function test()
@@ -46,25 +68,24 @@ function test()
     description("This test checks that text controls with percentage heights within table cells have the correct height." +
         "Text controls are in a different test than other replaced elements because their metrics are platform-specific.");
 
-    printMetrics('input-password-75', 'width', '128px', '152px');
-    printMetrics('input-password-75', 'height', '8px', '8px');
-    printMetrics('input-password-100', 'width', '128px', '152px');
-    printMetrics('input-password-100', 'height', '13px', '13px');
-
-    printMetrics('input-text-75', 'width', '128px', '152px');
-    printMetrics('input-text-75', 'height', '8px', '8px');
-    printMetrics('input-text-100', 'width', '128px', '152px');
-    printMetrics('input-text-100', 'height', '13px', '13px');
-
-    printMetrics('isindex-75', 'width', '122px', '146px');
-    printMetrics('isindex-75', 'height', '13px', '13px');
-    printMetrics('isindex-100', 'width', '122px', '146px');
-    printMetrics('isindex-100', 'height', '13px', '13px');
-
-    printMetrics('textarea-75', 'width', '129px', '161px');
-    printMetrics('textarea-75', 'height', '19px', '19px');
-    printMetrics('textarea-100', 'width', '129px', '161px');
-    printMetrics('textarea-100', 'height', '28px', '28px');
+    shouldBe("getWidth('input-password-75')", "getWidth('input-password-100')");
+    shouldBeTrue("getFullHeight('input-password-75') != '0px'");
+    // Note: This behavior doesn't match to IE 8, Firefox 3.5 and Opera 10.
+    is75PercentOf("getFullHeight('input-password-75')", "getFullHeight('input-password-100')");
+
+    shouldBe("getWidth('input-text-75')", "getWidth('input-text-100')");
+    shouldBeTrue("getFullHeight('input-text-75') != '0px'");
+    // Note: This behavior doesn't match to IE 8, Firefox 3.5 and Opera 10.
+    is75PercentOf("getFullHeight('input-text-75')", "getFullHeight('input-text-100')");
+
+    shouldBe("getWidth('isindex-75')", "getWidth('isindex-100')");
+    shouldBeTrue("getFullHeight('isindex-75') != '0px'");
+    shouldBe("getFullHeight('isindex-75')", "getFullHeight('isindex-100')");
+
+    shouldBe("getWidth('textarea-75')", "getWidth('textarea-100')");
+    shouldBeTrue("getFullHeight('textarea-75') != '0px'");
+    // Note: This behavior doesn't match to IE 8, Firefox 3.5 and Opera 10.
+    is75PercentOf("getFullHeight('textarea-75')", "getFullHeight('textarea-100')");
 
     isSuccessfullyParsed();
 
index e879e5c8473ef4b86469c816a433530cde885cd8..f8166bf55a2a1de6d966c69ad4d9cd7e31cb91ce 100644 (file)
@@ -10,7 +10,7 @@ if (window.layoutTestController) {
     layoutTestController.dumpAsText();
 }
 
-function getComputedStyleForElement (element, cssPropertyName)
+function getComputedStyleForElement(element, cssPropertyName)
 {
     if (!element) {
         return null;
@@ -24,74 +24,103 @@ function getComputedStyleForElement (element, cssPropertyName)
     return null;
 }
 
+function getWidth(id)
+{
+    return getComputedStyleForElement(document.getElementById(id), 'width');
+}
+
+function getHeight(id)
+{
+    return getComputedStyleForElement(document.getElementById(id), 'height');
+}
+
+function parsePixelValue(str)
+{
+    if (typeof str != "string" || str.length < 3 || str.substr(str.length - 2) != "px") {
+        testFailed(str + " is unparsable.");
+        return -1;
+    }
+    return parseFloat(str);
+}
+
+function is75PercentOf(expression75, expression100)
+{
+    var str75 = eval(expression75);
+    var str100 = eval(expression100);
+    var num75 = parsePixelValue(str75);
+    var num100 = parsePixelValue(str100);
+    if (num75 < 0 || num100 < 0)
+        return;
+    if (num75 == Math.floor(num100 * 75 / 100))
+        testPassed(expression75 + " [" + str75 + "] is 75% of " + expression100 + " [" + str100 + "].");
+    else
+        testFailed(expression75 + " [" + str75 + "] is not 75% of " + expression100 + " [" + str100 + "].");
+}
+
 function test()
 {
     description("This test checks that replaced elements with percentage heights within table cells have the correct height.");
 
-    shouldBe("getComputedStyleForElement(document.getElementById('canvas-75'), 'width')", "'300px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('canvas-75'), 'height')", "'112px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('canvas-100'), 'width')", "'300px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('canvas-100'), 'height')", "'150px'");
-
-    shouldBe("getComputedStyleForElement(document.getElementById('embed-75'), 'width')", "'300px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('embed-75'), 'height')", "'112px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('embed-100'), 'width')", "'300px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('embed-100'), 'height')", "'150px'");
-
-    shouldBe("getComputedStyleForElement(document.getElementById('img-75'), 'width')", "'75px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('img-75'), 'height')", "'75px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('img-100'), 'width')", "'100px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('img-100'), 'height')", "'100px'");
-
-    shouldBe("getComputedStyleForElement(document.getElementById('object-75'), 'width')", "'300px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('object-75'), 'height')", "'112px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('object-100'), 'width')", "'300px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('object-100'), 'height')", "'150px'");
-
-    shouldBe("getComputedStyleForElement(document.getElementById('button-75'), 'width')", "'51px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('button-75'), 'height')", "'15px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('button-100'), 'width')", "'51px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('button-100'), 'height')", "'15px'");
-
-    shouldBe("getComputedStyleForElement(document.getElementById('input-button-75'), 'width')", "'16px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('input-button-75'), 'height')", "'18px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('input-button-100'), 'width')", "'16px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('input-button-100'), 'height')", "'18px'");
-
-    shouldBe("getComputedStyleForElement(document.getElementById('input-checkbox-75'), 'width')", "'12px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('input-checkbox-75'), 'height')", "'4px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('input-checkbox-100'), 'width')", "'12px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('input-checkbox-100'), 'height')", "'6px'");
-
-    shouldBe("getComputedStyleForElement(document.getElementById('input-file-75'), 'width')", "'237px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('input-file-75'), 'height')", "'13px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('input-file-100'), 'width')", "'237px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('input-file-100'), 'height')", "'18px'");
-
-    shouldBe("getComputedStyleForElement(document.getElementById('input-image-75'), 'width')", "'75px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('input-image-75'), 'height')", "'75px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('input-image-100'), 'width')", "'100px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('input-image-100'), 'height')", "'100px'");
-
-    shouldBe("getComputedStyleForElement(document.getElementById('input-radio-75'), 'width')", "'12px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('input-radio-75'), 'height')", "'4px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('input-radio-100'), 'width')", "'12px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('input-radio-100'), 'height')", "'6px'");
-
-    shouldBe("getComputedStyleForElement(document.getElementById('input-reset-75'), 'width')", "'45px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('input-reset-75'), 'height')", "'18px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('input-reset-100'), 'width')", "'45px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('input-reset-100'), 'height')", "'18px'");
-
-    shouldBe("getComputedStyleForElement(document.getElementById('input-submit-75'), 'width')", "'54px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('input-submit-75'), 'height')", "'18px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('input-submit-100'), 'width')", "'54px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('input-submit-100'), 'height')", "'18px'");
-
-    shouldBe("getComputedStyleForElement(document.getElementById('select-75'), 'width')", "'68px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('select-75'), 'height')", "'18px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('select-100'), 'width')", "'68px'");
-    shouldBe("getComputedStyleForElement(document.getElementById('select-100'), 'height')", "'18px'");
+    shouldBe("getWidth('canvas-75')", "'300px'");
+    shouldBe("getHeight('canvas-75')", "'112px'");
+    shouldBe("getWidth('canvas-100')", "'300px'");
+    shouldBe("getHeight('canvas-100')", "'150px'");
+
+    shouldBe("getWidth('embed-75')", "'300px'");
+    shouldBe("getHeight('embed-75')", "'112px'");
+    shouldBe("getWidth('embed-100')", "'300px'");
+    shouldBe("getHeight('embed-100')", "'150px'");
+
+    shouldBe("getWidth('img-75')", "'75px'");
+    shouldBe("getHeight('img-75')", "'75px'");
+    shouldBe("getWidth('img-100')", "'100px'");
+    shouldBe("getHeight('img-100')", "'100px'");
+
+    shouldBe("getWidth('object-75')", "'300px'");
+    shouldBe("getHeight('object-75')", "'112px'");
+    shouldBe("getWidth('object-100')", "'300px'");
+    shouldBe("getHeight('object-100')", "'150px'");
+
+    shouldBe("getWidth('button-75')", "getWidth('button-100')");
+    shouldBeTrue("getHeight('button-75') != '0px'");
+    shouldBe("getHeight('button-75')", "getHeight('button-100')");
+
+    shouldBe("getWidth('input-button-75')", "getWidth('input-button-100')");
+    shouldBeTrue("getHeight('input-button-75') != '0px'");
+    shouldBe("getHeight('input-button-75')", "getHeight('input-button-100')");
+
+    shouldBe("getWidth('input-checkbox-75')", "getWidth('input-checkbox-100')");
+    shouldBeTrue("getHeight('input-checkbox-75') != '0px'");
+    // Note: This behavior doesn't match to Firefox 3.5 and Opera 10.
+    is75PercentOf("getHeight('input-checkbox-75')", "getHeight('input-checkbox-100')");
+
+    shouldBe("getWidth('input-file-75')", "getWidth('input-file-100')");
+    shouldBeTrue("getHeight('input-file-75') != '0px'");
+    // Note: This behavior doesn't match to Firefox 3.5 and Opera 10.
+    is75PercentOf("getHeight('input-file-75')", "getHeight('input-file-100')");
+
+    // Note: This behavior doesn't match to Firefox 3.5 and Opera 10.
+    shouldBe("getWidth('input-image-75')", "'75px'");
+    shouldBe("getHeight('input-image-75')", "'75px'");
+    shouldBe("getWidth('input-image-100')", "'100px'");
+    shouldBe("getHeight('input-image-100')", "'100px'");
+
+    shouldBe("getWidth('input-radio-75')", "getWidth('input-radio-100')");
+    shouldBeTrue("getHeight('input-radio-75') != '0px'");
+    // Note: This behavior doesn't match to Firefox 3.5 and Opera 10.
+    is75PercentOf("getHeight('input-radio-75')", "getHeight('input-radio-100')");
+
+    shouldBe("getWidth('input-reset-75')", "getWidth('input-reset-100')");
+    shouldBeTrue("getHeight('input-reset-75') != '0px'");
+    shouldBe("getHeight('input-reset-75')", "getHeight('input-reset-100')");
+
+    shouldBe("getWidth('input-submit-75')", "getWidth('input-submit-100')");
+    shouldBeTrue("getHeight('input-submit-75') != '0px'");
+    shouldBe("getHeight('input-submit-75')", "getHeight('input-submit-100')");
+
+    shouldBe("getWidth('select-75')", "getWidth('select-100')");
+    shouldBeTrue("getHeight('select-75') != '0px'");
+    shouldBe("getHeight('select-75')", "getHeight('select-100')");
 
     isSuccessfullyParsed();