| <html> | |
| <head> | |
| <title>Bug 29240: iframes keep getting scrollbars with scrolling=no</title> | |
| <style> | |
| iframe { | |
| width: 220px; | |
| height: 200px; | |
| } | |
| </style> | |
| <script> | |
| function inject(frameId, scrolltype) { | |
| var content = | |
| '<html><head><style type="text/css">' + scrolltype + ' { overflow:scroll; }</style></head>' + | |
| '<body><div style="width:380px; height:400px; background-color:green"></div></body></html>'; | |
| var doc = document.getElementById(frameId).contentDocument; | |
| doc.open(); | |
| doc.write(content); | |
| doc.close(); | |
| } | |
| function testDimensions(frameId) { | |
| var frame = document.getElementById(frameId); | |
| var body = frame.contentDocument.body; | |
| return (frame.clientWidth == body.clientWidth) && (frame.clientHeight == body.clientHeight); | |
| } | |
| function reportMismatch(frameId) { | |
| var frame = document.getElementById(frameId); | |
| var body = frame.contentDocument.body; | |
| return frameId + ": expected (" + frame.clientWidth + "," + frame.clientHeight + "), " + | |
| "actual (" + body.clientWidth + "," + body.clientHeight + ")"; | |
| } | |
| function test() { | |
| var htmlScrollSuccess = testDimensions("frame1"); | |
| var bodyScrollSuccess = testDimensions("frame2"); | |
| var output = document.getElementById('output'); | |
| output.innerHTML = htmlScrollSuccess && bodyScrollSuccess ? | |
| "PASSED" : | |
| "FAILED: " + reportMismatch("frame1") + "; " + reportMismatch("frame2"); | |
| if (window.testRunner) | |
| testRunner.dumpAsText(); | |
| } | |
| </script> | |
| </head> | |
| <body onload="test()"> | |
| <p>This page tests that there are no scrollbars with iframe elements which have scrolling=no, | |
| contain a page large enough to need to be scrolled and have overflow:scroll set on the html | |
| or body elements. If the page doesn't have a scrollbar, then the iframe's body's clientWidth | |
| should be equal to the iframe's clientWidth.</p> | |
| <iframe id="frame1" scrolling="no" onload="inject('frame1', 'html')"></iframe> | |
| <iframe id="frame2" scrolling="no" onload="inject('frame2', 'body')"></iframe> | |
| <div id='output'></div> | |
| </body> | |
| </html> |