<!
DOCTYPE HTML>
<
title>
Canvas test: toDataURL parameters (Bug 564388)</
title>
<
script src=
"/tests/SimpleTest/SimpleTest.js"></
script>
<
link rel=
"stylesheet" href=
"/tests/SimpleTest/test.css">
<
body>
<p>
This test covers the JPEG and webp quality parameter. If (when) the HTML5 spec changes the
allowed parameters for ToDataURL, new tests should go here.
</p>
<
canvas id=
"c" width=
"100" height=
"100"><p class=
"fallback">FAIL (fallback content)</p></
canvas>
<
script>
let
canvas = document.getElementById(
'c');
let ctx =
canvas.getContext(
"2d");
ctx.strokeStyle =
'#FF0000';
ctx.fillStyle =
'#00FF00';
ctx.fillRect(0, 0, 100, 100);
ctx.beginPath();
ctx.moveTo(10, 10);
ctx.lineTo(90, 90);
ctx.stroke();
let pngData =
canvas.toDataURL(
'image/png');
let pngQuality =
canvas.toDataURL(
'image/png', 0.1);
is(pngQuality, pngData,
"Quality is not supported for PNG images");
function checkType(imagetype) {
let imageTypeString =
'image/' + imagetype;
let imageTypeUpperString =
'IMAGE/' + imagetype.toUpperCase();
let data =
canvas.toDataURL(imageTypeString);
if (data.match(new RegExp(
'^data:image\/' + imagetype +
'[;,]'))) {
// Test the JPEG/wepb quality parameter
let fullQuality =
canvas.toDataURL(imageTypeString, 1.0);
let lowQuality =
canvas.toDataURL(imageTypeString, 0.1);
isnot(lowQuality, fullQuality,
"A low quality (0.1) should differ from high quality (1.0) " + imageTypeString);
let medQuality =
canvas.toDataURL(imageTypeString, 0.5);
isnot(medQuality, fullQuality,
"A medium quality (0.5) should differ from high (1.0) " + imageTypeString);
isnot(medQuality, lowQuality,
"A medium quality (0.5) should differ from low (0.5) " + imageTypeString);
let tooHigh =
canvas.toDataURL(imageTypeString, 2.0);
is(tooHigh, data,
"Quality above 1.0 is treated as unspecified " + imageTypeString);
let tooLow =
canvas.toDataURL(imageTypeString, -1.0);
is(tooLow, data,
"Quality below 0.0 is treated as unspecified " + imageTypeString);
let lowQualityExtra =
canvas.toDataURL(imageTypeString, 0.1,
'foo',
'bar', null);
is(lowQualityExtra, lowQuality,
"Quality applies even if extra arguments are present " + imageTypeString);
let lowQualityUppercase =
canvas.toDataURL(imageTypeUpperString, 0.1);
is(lowQualityUppercase, lowQuality,
"Quality applies to " + imageTypeString +
" regardless of case");
let lowQualityString =
canvas.toDataURL(imageTypeString,
'0.1');
isnot(lowQualityString, lowQuality,
"Quality must be a number (should not be a string) " + imageTypeString);
} else {
ok(false,
"should get a data url " + imageTypeString);
}
}
checkType(
'jpeg');
checkType(
'webp');
</
script>
