61 lines
2.2 KiB
HTML
61 lines
2.2 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<script src="../../resources/js-test-pre.js"></script>
|
|
<script>
|
|
if (window.internals) {
|
|
internals.clearMemoryCache();
|
|
internals.invalidateFontCache();
|
|
}
|
|
</script>
|
|
<style>
|
|
@font-face {
|
|
font-family: WebFont;
|
|
src: url("../../resources/Ahem.ttf") format("truetype"), local("American Typewriter");
|
|
}
|
|
@font-face {
|
|
font-family: WebFont2;
|
|
src: local("American Typewriter");
|
|
}
|
|
@font-face {
|
|
font-family: WebFont2;
|
|
src: url("../../resources/Ahem.ttf") format("truetype");
|
|
}
|
|
@font-face {
|
|
font-family: WebFont3;
|
|
src: url("../../resources/Ahem.ttf") format("truetype");
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div style="width: 5000px; -webkit-text-size-adjust: none;">
|
|
<p><span id="americanTypewriter" style="font-family: 'American Typewriter';">This is rendered with American Typewriter.</span></p>
|
|
<p><span id="test1" style="font-family: 'WebFont';">This is rendered with American Typewriter.</span></p>
|
|
<p><span id="test2" style="font-family: 'WebFont2';">This is rendered with American Typewriter.</span></p>
|
|
<p><span id="test3" style="font-family: 'WebFont3', 'American Typewriter';">This is rendered with American Typewriter.</span></p>
|
|
<p><span id="test4" style="font-family: 'American Typewriter';">This is rendered with American Typewriter.</span></p>
|
|
</div>
|
|
<script>
|
|
description("This test makes sure that fallback fonts are used during the time when fonts are loading.");
|
|
var americanTypewriterWidth = document.getElementById("americanTypewriter").getBoundingClientRect().width;
|
|
var test1 = document.getElementById("test1").getBoundingClientRect().width;
|
|
var test2 = document.getElementById("test2").getBoundingClientRect().width;
|
|
var test3 = document.getElementById("test3").getBoundingClientRect().width;
|
|
</script>
|
|
<style>
|
|
@font-face {
|
|
font-family: "American Typewriter";
|
|
src: url("../../resources/Ahem.ttf") format("truetype");
|
|
}
|
|
</style>
|
|
<script>
|
|
var test4 = document.getElementById("test4").getBoundingClientRect().width;
|
|
shouldNotBe("test1", "americanTypewriterWidth");
|
|
shouldBe("test2", "americanTypewriterWidth");
|
|
shouldBe("test3", "americanTypewriterWidth");
|
|
shouldBe("test4", "americanTypewriterWidth");
|
|
</script>
|
|
<script src="../../resources/js-test-post.js"></script>
|
|
</body>
|
|
</html>
|