| <!DOCTYPE html> |
| <html> |
| <head> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| </head> |
| <body> |
| <img id="oval0" src="resources/oval.png" style="zoom: 1%"> |
| <img id="oval1" src="resources/oval.png" style="zoom: 2%"> |
| <img id="oval2" src="resources/oval.png" style="zoom: 3%"> |
| <img id="oval3" src="resources/oval.png" style="zoom: 4%"> |
| <img id="oval4" src="resources/oval.png" style="zoom: 5%"> |
| <img id="oval5" src="resources/oval.png" style="zoom: 30%"> |
| <img id="oval6" src="resources/oval.png" style="zoom: 33%"> |
| <img id="oval7" src="resources/oval.png" style="zoom: 50%"> |
| <img id="oval8" src="resources/oval.png" style="zoom: 70%"> |
| <img id="oval9" src="resources/oval.png" style="zoom: 100%"> |
| <img id="oval10" src="resources/oval.png" style="zoom: 111%"> |
| <img id="oval11" src="resources/oval.png" style="zoom: 150%"> |
| <img id="oval12" src="resources/oval.png" style="zoom: 333%"> |
| <img id="oval13" src="resources/oval.png" style="zoom: 400%"> |
| <img id="oval14" src="resources/oval.png" style="zoom: 1234%"> |
| <script> |
| const EXPECTED_WIDTH = 37; |
| const EXPECTED_HEIGHT = 33; |
| for (i = 0; i < 15; ++i) { |
| const oval = document.getElementById('oval' + i); |
| const testDesc = `Zoom ${oval.style.zoom} should not affect width/height of images.`; |
| const testBody = () => { |
| assert_equals(oval.width, EXPECTED_WIDTH, oval.getAttribute('style')); |
| assert_equals(oval.height, EXPECTED_HEIGHT, oval.getAttribute('style')); |
| }; |
| if (oval.complete) { |
| test(testBody, testDesc); |
| } else { |
| async_test(t => { |
| oval.onload = t.step_func_done(testBody); |
| }, testDesc); |
| } |
| } |
| </script> |
| </body> |
| </html> |
