|  | <!DOCTYPE html> | 
|  | <html> | 
|  | <head> | 
|  | <link href="resources/flexbox.css" rel="stylesheet"> | 
|  | <style> | 
|  | </style> | 
|  | <script src="../../resources/testharness.js"></script> | 
|  | <script src="../../resources/testharnessreport.js"></script> | 
|  | <script src="../../resources/check-layout-th.js"></script> | 
|  | </head> | 
|  | <body> | 
|  | <div id=log></div> | 
|  | <p>Test to make sure that we properly relayout when an image loads. You | 
|  | should see a green 100x100 image.</p> | 
|  | <div id="test" class="flexbox"> | 
|  |   | 
|  | <div class="flexbox"> | 
|  | <img data-expected-width=100 data-expected-height=100 id="image" onload="imageLoaded()"> | 
|  | </div> | 
|  | </div> | 
|  | <script> | 
|  |  | 
|  | function changeImage() | 
|  | { | 
|  | document.getElementById("image").src = "../images/resources/green-100.png"; | 
|  | } | 
|  | setTimeout(changeImage, 0); | 
|  |  | 
|  | function imageLoaded() | 
|  | { | 
|  | checkLayout('#test') | 
|  | } | 
|  | </script> | 
|  | </body> | 
|  | </html> |