| OLD | NEW |
|---|
| (Empty) |
| 1 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> | |
| 2 <html> | |
| 3 <head> | |
| 4 <script src="../../resources/js-test.js"></script> | |
| 5 </head> | |
| 6 <body> | |
| 7 <p id="description"></p> | |
| 8 <div id="console"></div> | |
| 9 <script> | |
| 10 description("This test checks that textareas have the right metrics. These numbe
rs match IE7 except for scrollHeight. For two reasons:<br>" + | |
| 11 "1. scrollHeight is different for elements without enough content to cause scrol
l because IE7 then reports the height of the text inside the " + | |
| 12 "element as the scrollHeight. IE8 reports has scrollHeight == offsetHeight. Geck
o/WebKit have scrollHeight == clientHeight.<br>" + | |
| 13 "2. For the elements with scroll in standards-mode, IE wraps the text differentl
y. It seems to leave 2px less space for the text. We don't " + | |
| 14 "currently mimic this quirk. It's not clear whether we should given that we agre
e with IE7's clientWidth numbers in all these cases."); | |
| 15 | |
| 16 function assertTextareaMetrics(doc, properties, expectedMetrics) { | |
| 17 var textarea = doc.createElement('textarea'); | |
| 18 // Give some consistent CSS for consistent rendering across platforms | |
| 19 // and to help in reasoning when trying to match IE metrics. | |
| 20 var style = 'overflow-y:auto; font-family:Ahem; line-height:20px; height:50p
x; width:50px;'; | |
| 21 var title = ''; | |
| 22 for (property in properties) { | |
| 23 var value = properties[property]; | |
| 24 title += ' ' + property + ': "' + value + '",'; | |
| 25 if (property == 'style') | |
| 26 style += value; | |
| 27 else | |
| 28 textarea[property] = value; | |
| 29 } | |
| 30 textarea.style.cssText = style; | |
| 31 doc.body.appendChild(textarea); | |
| 32 | |
| 33 // Create a more human-readable ID. | |
| 34 var id = title.replace(/[\'\",;\:]/g, ' ').replace(/ +/g, '-'); | |
| 35 id = id == '' ? 'no-styles' : id; | |
| 36 textarea.id = id; | |
| 37 | |
| 38 window[doc.compatMode + 'doc'] = doc; | |
| 39 | |
| 40 function assertMetricsForTextarea() { | |
| 41 if (!title) | |
| 42 title = ' none'; | |
| 43 | |
| 44 debug('Properties =' + title); | |
| 45 shouldBe(doc.compatMode + "doc.getElementById('" + id + "').clientWidth"
, String(expectedMetrics.clientWidth)); | |
| 46 shouldBe(doc.compatMode + "doc.getElementById('" + id + "').clientHeight
", String(expectedMetrics.clientHeight)); | |
| 47 shouldBe(doc.compatMode + "doc.getElementById('" + id + "').offsetWidth"
, String(expectedMetrics.offsetWidth)); | |
| 48 shouldBe(doc.compatMode + "doc.getElementById('" + id + "').offsetHeight
", String(expectedMetrics.offsetHeight)); | |
| 49 shouldBe(doc.compatMode + "doc.getElementById('" + id + "').scrollWidth"
, String(expectedMetrics.scrollWidth)); | |
| 50 shouldBe(doc.compatMode + "doc.getElementById('" + id + "').scrollHeight
", String(expectedMetrics.scrollHeight)); | |
| 51 debug(''); | |
| 52 } | |
| 53 if (document.all) | |
| 54 // Give a timeout so IE has time to figure out it's metrics. | |
| 55 setTimeout(assertMetricsForTextarea, 100); | |
| 56 else | |
| 57 assertMetricsForTextarea(); | |
| 58 } | |
| 59 | |
| 60 var smallHTML = 'A'; | |
| 61 var htmlThatCausesScroll = 'AAAAAAAAA'; | |
| 62 | |
| 63 function testTextareasForDocument(doc, compatMode, | |
| 64 textareaSizes, textareaWithScrollSizes, | |
| 65 textareaWith8pxPaddingSizes, textareaWith8pxPaddingAndScrollbarSizes) { | |
| 66 if (doc.compatMode != compatMode) | |
| 67 testFailed('This doc should be in ' + compatMode + ' mode.'); | |
| 68 | |
| 69 try { | |
| 70 var scrollbarStyle = doc.createElement('style'); | |
| 71 scrollbarStyle.innerText = 'textarea::-webkit-scrollbar{ width:17px }'; | |
| 72 doc.getElementsByTagName('head')[0].appendChild(scrollbarStyle); | |
| 73 } catch (e) { | |
| 74 // IE throws an exception here, but doesn't need the above clause anyway
s. | |
| 75 } | |
| 76 | |
| 77 debug('Testing ' + compatMode + ' document.') | |
| 78 assertTextareaMetrics(doc, {}, textareaSizes); | |
| 79 assertTextareaMetrics(doc, {disabled: true}, textareaSizes); | |
| 80 assertTextareaMetrics(doc, {innerHTML: smallHTML}, textareaSizes); | |
| 81 assertTextareaMetrics(doc, {innerHTML: htmlThatCausesScroll}, textareaWithSc
rollSizes); | |
| 82 assertTextareaMetrics(doc, {innerHTML: smallHTML, disabled: true}, textareaS
izes); | |
| 83 assertTextareaMetrics(doc, {innerHTML: htmlThatCausesScroll, disabled: true}
, textareaWithScrollSizes); | |
| 84 assertTextareaMetrics(doc, {innerHTML: smallHTML, style: 'padding:8px'}, tex
tareaWith8pxPaddingSizes); | |
| 85 assertTextareaMetrics(doc, {innerHTML: htmlThatCausesScroll, style: 'padding
:8px'}, textareaWith8pxPaddingAndScrollbarSizes); | |
| 86 assertTextareaMetrics(doc, {innerHTML: smallHTML, rows: 10}, textareaSizes); | |
| 87 assertTextareaMetrics(doc, {innerHTML: htmlThatCausesScroll, rows: 10}, text
areaWithScrollSizes); | |
| 88 } | |
| 89 | |
| 90 // For textareas with scrollbars have the expected clientWidth be the | |
| 91 // expected offsetWidth - scrollbarPlusBorderWidth. | |
| 92 // default border on textareas is 1px solid. So, the border width is 2. | |
| 93 // And the scrollbarWidth we set to be 17 to match windows so that | |
| 94 // these numbers will be platform independent and match IE. | |
| 95 var scrollbarPlusBorderWidth = 19; | |
| 96 | |
| 97 var textareaSizesQuirks = {clientWidth: 48, | |
| 98 clientHeight: 48, | |
| 99 offsetWidth: 50, | |
| 100 offsetHeight: 50, | |
| 101 scrollWidth: 48, | |
| 102 scrollHeight: 48}; | |
| 103 | |
| 104 var textareaWithScrollSizesQuirks = {clientWidth: 50 - scrollbarPlusBorderWidth, | |
| 105 clientHeight: 48, | |
| 106 offsetWidth: 50, | |
| 107 offsetHeight: 50, | |
| 108 scrollWidth: 50 - scrollbarPlusBorderWidth, | |
| 109 scrollHeight: 104}; | |
| 110 | |
| 111 var textareaWith8pxPaddingSizesQuirks = {clientWidth: 48, | |
| 112 clientHeight: 48, | |
| 113 offsetWidth: 50, | |
| 114 offsetHeight: 50, | |
| 115 scrollWidth: 48, | |
| 116 scrollHeight: 48}; | |
| 117 | |
| 118 var textareaWith8pxPaddingAndScrollbarSizesQuirks = {clientWidth: 50 - scrollbar
PlusBorderWidth, | |
| 119 clientHeight: 48, | |
| 120 offsetWidth: 50, | |
| 121 offsetHeight: 50, | |
| 122 scrollWidth: 50 - scrollbar
PlusBorderWidth, | |
| 123 scrollHeight: 196}; | |
| 124 | |
| 125 testTextareasForDocument(document, 'BackCompat', | |
| 126 textareaSizesQuirks, textareaWithScrollSizesQuirks, | |
| 127 textareaWith8pxPaddingSizesQuirks, textareaWith8pxPaddi
ngAndScrollbarSizesQuirks); | |
| 128 | |
| 129 var standardsIframe = document.createElement('iframe'); | |
| 130 standardsIframe.style.width = '100%'; | |
| 131 document.body.appendChild(standardsIframe); | |
| 132 standardsIframe.contentWindow.document.write('<!DocType html><html><head></head>
<body></body></html>'); | |
| 133 standardsIframe.contentWindow.document.close(); | |
| 134 | |
| 135 var textareaSizesStandards = {clientWidth: 54, | |
| 136 clientHeight: 54, | |
| 137 offsetWidth: 56, | |
| 138 offsetHeight: 56, | |
| 139 scrollWidth: 54, | |
| 140 scrollHeight: 54}; | |
| 141 | |
| 142 var textareaWithScrollSizesStandards = {clientWidth: 56 - scrollbarPlusBorderWid
th, | |
| 143 clientHeight: 54, | |
| 144 offsetWidth: 56, | |
| 145 offsetHeight: 56, | |
| 146 scrollWidth: 56 - scrollbarPlusBorderWid
th, | |
| 147 scrollHeight: 64}; | |
| 148 | |
| 149 var textareaWith8pxPaddingSizesStandards = {clientWidth: 66, | |
| 150 clientHeight: 66, | |
| 151 offsetWidth: 68, | |
| 152 offsetHeight: 68, | |
| 153 scrollWidth: 66, | |
| 154 scrollHeight: 66}; | |
| 155 | |
| 156 var textareaWith8pxPaddingAndScrollbarSizesStandards = {clientWidth: 68 - scroll
barPlusBorderWidth, | |
| 157 clientHeight: 66, | |
| 158 offsetWidth: 68, | |
| 159 offsetHeight: 68, | |
| 160 scrollWidth: 68 - scroll
barPlusBorderWidth, | |
| 161 scrollHeight: 76}; | |
| 162 | |
| 163 testTextareasForDocument(standardsIframe.contentWindow.document, 'CSS1Compat', | |
| 164 textareaSizesStandards, textareaWithScrollSizesStandard
s, | |
| 165 textareaWith8pxPaddingSizesStandards, textareaWith8pxPa
ddingAndScrollbarSizesStandards); | |
| 166 </script> | |
| 167 </body> | |
| 168 </html> | |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 1522803002:
Move textarea-related tests to fast/forms/textarea/, part 1. (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@color-uaf