| <head> |
| <style> |
| @font-face { |
| font-family: 'webfont'; |
| src: url(http://localhost:8000/css/resources/webfont-request.php?mode=getFont&filename=webfontRequestCount.txt) format('truetype'); |
| } |
| </style> |
| <script> |
| if (window.testRunner) { |
| testRunner.dumpAsText(); |
| testRunner.waitUntilDone(); |
| } |
| |
| var filename = 'filename=webfontRequestCount.txt'; |
| var xhr; |
| |
| function startTest() { |
| // Resets request count before starting the test. |
| xhr = new XMLHttpRequest; |
| xhr.onerror = function() { |
| document.getElementById('result').innerText = 'FAIL: Network error.'; |
| if (window.testRunner) |
| testRunner.notifyDone(); |
| }; |
| xhr.onreadystatechange = function() { |
| if (xhr.readyState == xhr.DONE) |
| forceStyleSelectorRecreation(); |
| }; |
| xhr.open('GET', '/resources/reset-temp-file.php?' + filename, true); |
| xhr.send(); |
| } |
| |
| function forceStyleSelectorRecreation() { |
| document.head.appendChild(document.createElement("style")); |
| // Pauses for a moment to see whether font re-fetching occurs. |
| setTimeout(getRequestCount, 100); |
| } |
| |
| function getRequestCount() { |
| xhr.onreadystatechange = function() { |
| if (xhr.readyState == xhr.DONE) |
| checkRequestCount(); |
| }; |
| xhr.open('GET', 'http://localhost:8000/css/resources/webfont-request.php?mode=getRequestCount&' + filename, true); |
| xhr.send(); |
| } |
| |
| function checkRequestCount() { |
| var numRequest = xhr.responseText; |
| var result = document.getElementById('result'); |
| result.innerHTML = 'Number of requests after recalculation: ' + numRequest + '<br />'; |
| if (numRequest == '0') |
| result.innerHTML += 'SUCCESS'; |
| else |
| result.innerHTML += 'FAIL'; |
| if (window.testRunner) |
| testRunner.notifyDone(); |
| }; |
| </script> |
| </head> |
| <body onload="startTest()"> |
| <p>This test ensures that webfonts are not re-fetched after style recalculation.</p> |
| <div style="font-family: webfont;">Text</div> |
| <div id="result"></div> |
| <script> |
| document.body.offsetTop; |
| </script> |
| </body> |
