blob: bbe8d2f64b71ef669b251a997554c8cfa538ab71 [file] [log] [blame]
<!DOCTYPE html>
<html>
<style>
@font-face {
font-family: "Ahem";
src: url("../../resources/Ahem.ttf");
}
</style>
<canvas width="200" height="100"></canvas>
<script>
if (window.testRunner)
testRunner.waitUntilDone();
addEventListener("load", async () => {
await document.fonts.load("80px Ahem");
const canvas = document.querySelector("canvas");
const context = canvas.getContext("2d");
for (let i = 0; i <= 1000; ++i) {
context.fillStyle = `rgb(${i % 256}, ${i % 256}, ${i % 256})`;
context.clearRect(0, 0, 200, 100);
context.fillRect(0, 0, 200, 100);
}
const gradient = context.createLinearGradient(0, 0, 0, 100);
gradient.addColorStop(0, "blue");
gradient.addColorStop(1, "blue");
context.fillStyle = gradient;
context.font = "80px Ahem";
context.fillText("foo bar", 0, 0);
if (window.testRunner)
testRunner.notifyDone();
});
</script>
</html>