<!DOCTYPE HTML>
<html>
<body onload="runTest();">
<div>
<span>Tests that setting font of Canvas 2d context always uses up-to-date style and has font value: <span id="result"></span></span><br>
<canvas id="canvasTest"></canvas>
</div>
<script type="text/javascript">
if (window.testRunner)
testRunner.dumpAsText();
function drawCanvasText(id, text)
{
var canvasElement = document.getElementById(id);
var context = canvasElement.getContext('2d');
// Pre-draw pass to add the font to the font cache. This way, the test also
// verifies that the style change correctly invalidates the font resolution cache.
context.font = '1em Calibri';
context.fillText(text, 0, 100);
canvasElement.style.fontSize = '64px';
context.font = '1em Calibri';
context.fillText(text, 0, 100);
return context.font;
}
function runTest()
{
var fontSize = drawCanvasText('canvasTest', 'Some Text');
var resultElement = document.getElementById('result');
resultElement.textContent = fontSize;
}
</script>
</body>
</html>