slow-loading.html | Explore in Territory

<html>
<head>
<style>
@font-face {
  font-family:ahem-3sec;
  src: url(slow-ahem-loading.cgi?delay=3000);
}
@font-face {
  font-family:ahem-8sec;
  src: url(slow-ahem-loading.cgi?delay=8000);
}
@font-face {
  font-family:ahem-5sec;
  src: url(slow-ahem-loading.cgi?delay=5000);
}
.testspan {
  font-size:64px;
  border: 1px solid;
}
#span1 {
  font-family: ahem-3sec, Arial;
}
#span2 {
  font-family: ahem-8sec, Arial;
}
#span3 {
  font-family: ahem-5sec, Arial;
}
</style>
</head>
<body>

Ahem after 4 seconds:
<br/>
<span class="testspan" id="span1" style="display: none;">
abcdefg
</span>
<br/>

Arial after 4 seconds:
<br/>
<span class="testspan" id="span2" style="display: none;">
abcdefg
</span>
<br/>

Arial after hidden for 3 seconds and revealed for 1 second:
<br/>
<span class="testspan" id="span3" style="display: none;">
abcdefg
</span>
<br/>

<script>

if (window.testRunner)
    testRunner.waitUntilDone();

function displayElementAfter(id, msec) {
    setTimeout(function() {
        document.getElementById(id).style.removeProperty("display");
    }, msec);
}

window.onload = function() {
    displayElementAfter("span1", 0);
    displayElementAfter("span2", 0);
    displayElementAfter("span3", 3000);
    setTimeout(function() { if (window.testRunner) testRunner.notifyDone(); }, 4000);
};

</script>
</body>
</html>
chromium/third_party/blink/web_tests/http/tests/webfont/slow-loading.html
