| <!DOCTYPE html> |
| <style> |
| iframe { |
| height: 0; |
| width: 0; |
| } |
| </style> |
| <script src="../../resources/js-test.js"></script> |
| <body onload="update()"> |
| <iframe></iframe> |
| </body> |
| <script> |
| var iframe = document.querySelector("iframe"); |
| var doc = iframe.contentDocument; |
| var p = doc.createElement('p'); |
| p.id = 'y1'; |
| |
| function update() { |
| doc.body.appendChild(p); |
| |
| var style = doc.createElement('style'); |
| style.textContent = '@media all and (min-height: 10px) and (min-width: 10px) { #y1 { text-transform: uppercase; } }'; |
| doc.head.appendChild(style); |
| |
| // here the viewport is 0x0 |
| shouldBe('iframe.contentDocument.defaultView.getComputedStyle(p).textTransform', '"none"'); |
| iframe.setAttribute("style", "height: 100px; width: 100px"); |
| // now the viewport is more than 10px X 10px |
| shouldBe('iframe.contentDocument.defaultView.getComputedStyle(p).textTransform', '"uppercase"'); |
| } |
| </script> |
