OLD | NEW |
---|---|
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html> | 2 <html> |
3 <head> | 3 <head> |
4 <style> | 4 <style> |
5 select, span { font: menu; } | 5 select, span { font: menu; } |
6 </style> | 6 </style> |
7 <script src="../../../resources/js-test.js"></script> | 7 <script src="../../../resources/js-test.js"></script> |
8 </head> | 8 </head> |
9 <body> | 9 <body> |
10 <p> | 10 <p> |
(...skipping 19 matching lines...) Expand all Loading... | |
30 | 30 |
31 function widthForText(str) | 31 function widthForText(str) |
32 { | 32 { |
33 var textElement = document.createElement('span'); | 33 var textElement = document.createElement('span'); |
34 textElement.appendChild(document.createTextNode(str)); | 34 textElement.appendChild(document.createTextNode(str)); |
35 document.body.appendChild(textElement); | 35 document.body.appendChild(textElement); |
36 var textWidth = textElement.getBoundingClientRect().width; | 36 var textWidth = textElement.getBoundingClientRect().width; |
37 document.body.removeChild(textElement); | 37 document.body.removeChild(textElement); |
38 return textWidth; | 38 return textWidth; |
39 } | 39 } |
40 | 40 |
41 var optionPaddingStart = 3; | |
42 var optionPaddingEnd = 2; | |
keishi
2014/06/22 11:59:55
emptyWidth does not contain padding anymore, only
| |
43 | |
41 function testListbox(id) | 44 function testListbox(id) |
42 { | 45 { |
43 var element = document.getElementById(id); | 46 var element = document.getElementById(id); |
44 var emptyWidth = widthForEmptySelect(element.size); | 47 var emptyWidth = widthForEmptySelect(element.size); |
45 var textWidth = widthForText(element.firstElementChild.textConte nt); | 48 var textWidth = widthForText(element.firstElementChild.textConte nt); |
46 var dropdownWidth = element.getBoundingClientRect().width; | 49 var dropdownWidth = element.getBoundingClientRect().width; |
47 | 50 var expectedWidth = emptyWidth + textWidth + optionPaddingStart + optionPaddingEnd; |
48 if (Math.abs(dropdownWidth - (emptyWidth + textWidth)) <= 1) | 51 if (Math.abs(dropdownWidth - expectedWidth) <= 1) |
49 testPassed('Width of ' + id + ' matches width of text plus w idth of empty ' + id + '.'); | 52 testPassed('Width of ' + id + ' matches width of text plus w idth of empty ' + id + '.'); |
50 else | 53 else |
51 testFailed('Width ' + id + ' was ' + dropdownWidth + 'px wid e, expected ' + (emptyWidth + textWidth) + 'px (' + emptyWidth + 'px for empty ' + id + ' and ' + textWidth + 'px for text).'); | 54 testFailed('Width ' + id + ' was ' + dropdownWidth + 'px wid e, expected ' + expectedWidth + 'px (' + emptyWidth + 'px for empty ' + id + ' a nd ' + textWidth + 'px for text).'); |
52 } | 55 } |
53 | 56 |
54 testListbox('list'); | 57 testListbox('list'); |
55 </script> | 58 </script> |
56 </body> | 59 </body> |
57 </html> | 60 </html> |
OLD | NEW |