Bug 1778910 - Add offscreen-canvas versions of WPT reftests for fontVariantCaps. r=gfx-reviewers,lsalzman

Test the same features as the canvas-element reftests, for both a main-thread
OffscreenCanvas and in a worker.

Depends on D182567

Differential Revision: https://phabricator.services.mozilla.com/D182577
This commit is contained in:
Jonathan Kew 2023-07-04 12:16:57 +00:00
Родитель 90a4380b28
Коммит 848e8a6db7
9 изменённых файлов: 359 добавлений и 0 удалений

Просмотреть файл

@ -0,0 +1,51 @@
<!DOCTYPE html>
<html class="reftest-wait">
<meta charset="utf-8">
<title>HTML OffscreenCanvas Test: the 'fontVariantCaps' property</title>
<link rel="author" title="Jonathan Kew" href="mailto:jkew@mozilla.com">
<link rel="help" href="https://html.spec.whatwg.org/multipage/canvas.html#dom-context-2d-fontvariantcaps">
<link rel="match" href="reference/fontVariantCaps-1-ref.html">
<meta name="assert" content="text rendering respects the fontVariantCaps property">
<canvas id="canvas1"></canvas>
<br>
<canvas id="canvas2"></canvas>
<script>
const testContent = `
ctx.font = "32px serif";
ctx.fontVariantCaps = "small-caps";
ctx.fillText("Hello World", 20, 100);
`;
// Draw to the first canvas using a main-thread OffscreenCanvas:
const offscreen1 = new OffscreenCanvas(300, 150);
const ctx = offscreen1.getContext("2d");
eval(testContent);
document.getElementById("canvas1")
.getContext("bitmaprenderer")
.transferFromImageBitmap(offscreen1.transferToImageBitmap());
// Draw to the second using a worker:
const canvas2 = document.getElementById("canvas2");
const offscreen2 = canvas2.transferControlToOffscreen();
const workerScript = `
onmessage = (evt) => {
const canvas = evt.data.canvas;
const ctx = canvas.getContext("2d");
${testContent}
self.postMessage("done");
};
`;
const blob = new Blob([workerScript], {type: 'application/javascript'});
const worker = new Worker(URL.createObjectURL(blob));
worker.addEventListener('message', function(e) {
if (e.data == "done") {
document.documentElement.classList.remove("reftest-wait");
}
}, false);
worker.postMessage({ canvas: offscreen2 }, [offscreen2]);
</script>

Просмотреть файл

@ -0,0 +1,50 @@
<!DOCTYPE html>
<html class="reftest-wait">
<meta charset="utf-8">
<title>HTML OffscreenCanvas Test: the 'fontVariantCaps' property</title>
<link rel="author" title="Jonathan Kew" href="mailto:jkew@mozilla.com">
<link rel="help" href="https://html.spec.whatwg.org/multipage/canvas.html#dom-context-2d-fontvariantcaps">
<link rel="mismatch" href="reference/fontVariantCaps-2-ref.html">
<meta name="assert" content="text rendering respects the fontVariantCaps property">
<canvas id="canvas1"></canvas>
<br>
<canvas id="canvas2"></canvas>
<script>
const testContent = `
ctx.font = "small-caps 32px serif";
ctx.fillText("Hello World", 20, 100);
`;
// Draw to the first canvas using a main-thread OffscreenCanvas:
const offscreen1 = new OffscreenCanvas(300, 150);
const ctx = offscreen1.getContext("2d");
eval(testContent);
document.getElementById("canvas1")
.getContext("bitmaprenderer")
.transferFromImageBitmap(offscreen1.transferToImageBitmap());
// Draw to the second using a worker:
const canvas2 = document.getElementById("canvas2");
const offscreen2 = canvas2.transferControlToOffscreen();
const workerScript = `
onmessage = (evt) => {
const canvas = evt.data.canvas;
const ctx = canvas.getContext("2d");
${testContent}
self.postMessage("done");
};
`;
const blob = new Blob([workerScript], {type: 'application/javascript'});
const worker = new Worker(URL.createObjectURL(blob));
worker.addEventListener('message', function(e) {
if (e.data == "done") {
document.documentElement.classList.remove("reftest-wait");
}
}, false);
worker.postMessage({ canvas: offscreen2 }, [offscreen2]);
</script>

Просмотреть файл

@ -0,0 +1,51 @@
<!DOCTYPE html>
<html class="reftest-wait">
<meta charset="utf-8">
<title>HTML OffscreenCanvas Test: the 'fontVariantCaps' property</title>
<link rel="author" title="Jonathan Kew" href="mailto:jkew@mozilla.com">
<link rel="help" href="https://html.spec.whatwg.org/multipage/canvas.html#dom-context-2d-fontvariantcaps">
<link rel="match" href="reference/fontVariantCaps-3-ref.html">
<meta name="assert" content="text rendering respects the fontVariantCaps property">
<canvas id="canvas1"></canvas>
<br>
<canvas id="canvas2"></canvas>
<script>
const testContent = `
ctx.font = "32px serif";
ctx.fontVariantCaps = "all-small-caps";
ctx.fillText("Hello World", 20, 100);
`;
// Draw to the first canvas using a main-thread OffscreenCanvas:
const offscreen1 = new OffscreenCanvas(300, 150);
const ctx = offscreen1.getContext("2d");
eval(testContent);
document.getElementById("canvas1")
.getContext("bitmaprenderer")
.transferFromImageBitmap(offscreen1.transferToImageBitmap());
// Draw to the second using a worker:
const canvas2 = document.getElementById("canvas2");
const offscreen2 = canvas2.transferControlToOffscreen();
const workerScript = `
onmessage = (evt) => {
const canvas = evt.data.canvas;
const ctx = canvas.getContext("2d");
${testContent}
self.postMessage("done");
};
`;
const blob = new Blob([workerScript], {type: 'application/javascript'});
const worker = new Worker(URL.createObjectURL(blob));
worker.addEventListener('message', function(e) {
if (e.data == "done") {
document.documentElement.classList.remove("reftest-wait");
}
}, false);
worker.postMessage({ canvas: offscreen2 }, [offscreen2]);
</script>

Просмотреть файл

@ -0,0 +1,53 @@
<!DOCTYPE html>
<html class="reftest-wait">
<meta charset="utf-8">
<title>HTML OffscreenCanvas Test: the 'fontVariantCaps' property</title>
<link rel="author" title="Jonathan Kew" href="mailto:jkew@mozilla.com">
<link rel="help" href="https://html.spec.whatwg.org/multipage/canvas.html#dom-context-2d-fontvariantcaps">
<link rel="match" href="reference/fontVariantCaps-3-ref.html">
<meta name="assert" content="text rendering respects the fontVariantCaps property">
<canvas id="canvas1"></canvas>
<br>
<canvas id="canvas2"></canvas>
<script>
const testContent = `
ctx.font = "small-caps 32px serif";
// fontVariantCaps overrides the small-caps setting from the font attribute
// (spec unclear, cf. https://github.com/whatwg/html/issues/8103)
ctx.fontVariantCaps = "all-small-caps";
ctx.fillText("Hello World", 20, 100);
`;
// Draw to the first canvas using a main-thread OffscreenCanvas:
const offscreen1 = new OffscreenCanvas(300, 150);
const ctx = offscreen1.getContext("2d");
eval(testContent);
document.getElementById("canvas1")
.getContext("bitmaprenderer")
.transferFromImageBitmap(offscreen1.transferToImageBitmap());
// Draw to the second using a worker:
const canvas2 = document.getElementById("canvas2");
const offscreen2 = canvas2.transferControlToOffscreen();
const workerScript = `
onmessage = (evt) => {
const canvas = evt.data.canvas;
const ctx = canvas.getContext("2d");
${testContent}
self.postMessage("done");
};
`;
const blob = new Blob([workerScript], {type: 'application/javascript'});
const worker = new Worker(URL.createObjectURL(blob));
worker.addEventListener('message', function(e) {
if (e.data == "done") {
document.documentElement.classList.remove("reftest-wait");
}
}, false);
worker.postMessage({ canvas: offscreen2 }, [offscreen2]);
</script>

Просмотреть файл

@ -0,0 +1,53 @@
<!DOCTYPE html>
<html class="reftest-wait">
<meta charset="utf-8">
<title>HTML OffscreenCanvas Test: the 'fontVariantCaps' property</title>
<link rel="author" title="Jonathan Kew" href="mailto:jkew@mozilla.com">
<link rel="help" href="https://html.spec.whatwg.org/multipage/canvas.html#dom-context-2d-fontvariantcaps">
<link rel="match" href="reference/fontVariantCaps-1-ref.html">
<meta name="assert" content="text rendering respects the fontVariantCaps property">
<canvas id="canvas1"></canvas>
<br>
<canvas id="canvas2"></canvas>
<script>
const testContent = `
ctx.font = "small-caps 32px serif";
// fontVariantCaps 'normal' does not override the setting from the font attribute.
// (spec unclear, cf. https://github.com/whatwg/html/issues/8103)
ctx.fontVariantCaps = "normal";
ctx.fillText("Hello World", 20, 100);
`;
// Draw to the first canvas using a main-thread OffscreenCanvas:
const offscreen1 = new OffscreenCanvas(300, 150);
const ctx = offscreen1.getContext("2d");
eval(testContent);
document.getElementById("canvas1")
.getContext("bitmaprenderer")
.transferFromImageBitmap(offscreen1.transferToImageBitmap());
// Draw to the second using a worker:
const canvas2 = document.getElementById("canvas2");
const offscreen2 = canvas2.transferControlToOffscreen();
const workerScript = `
onmessage = (evt) => {
const canvas = evt.data.canvas;
const ctx = canvas.getContext("2d");
${testContent}
self.postMessage("done");
};
`;
const blob = new Blob([workerScript], {type: 'application/javascript'});
const worker = new Worker(URL.createObjectURL(blob));
worker.addEventListener('message', function(e) {
if (e.data == "done") {
document.documentElement.classList.remove("reftest-wait");
}
}, false);
worker.postMessage({ canvas: offscreen2 }, [offscreen2]);
</script>

Просмотреть файл

@ -0,0 +1,53 @@
<!DOCTYPE html>
<html class="reftest-wait">
<meta charset="utf-8">
<title>HTML OffscreenCanvas Test: the 'fontVariantCaps' property</title>
<link rel="author" title="Jonathan Kew" href="mailto:jkew@mozilla.com">
<link rel="help" href="https://html.spec.whatwg.org/multipage/canvas.html#dom-context-2d-fontvariantcaps">
<link rel="match" href="reference/fontVariantCaps-2-ref.html">
<meta name="assert" content="text rendering respects the fontVariantCaps property">
<canvas id="canvas1"></canvas>
<br>
<canvas id="canvas2"></canvas>
<script>
const testContent = `
// fontVariantCaps is reset when the font attribute is set.
// (spec unclear, cf. https://github.com/whatwg/html/issues/8103)
ctx.fontVariantCaps = "all-small-caps";
ctx.font = "32px serif";
ctx.fillText("Hello World", 20, 100);
`;
// Draw to the first canvas using a main-thread OffscreenCanvas:
const offscreen1 = new OffscreenCanvas(300, 150);
const ctx = offscreen1.getContext("2d");
eval(testContent);
document.getElementById("canvas1")
.getContext("bitmaprenderer")
.transferFromImageBitmap(offscreen1.transferToImageBitmap());
// Draw to the second using a worker:
const canvas2 = document.getElementById("canvas2");
const offscreen2 = canvas2.transferControlToOffscreen();
const workerScript = `
onmessage = (evt) => {
const canvas = evt.data.canvas;
const ctx = canvas.getContext("2d");
${testContent}
self.postMessage("done");
};
`;
const blob = new Blob([workerScript], {type: 'application/javascript'});
const worker = new Worker(URL.createObjectURL(blob));
worker.addEventListener('message', function(e) {
if (e.data == "done") {
document.documentElement.classList.remove("reftest-wait");
}
}, false);
worker.postMessage({ canvas: offscreen2 }, [offscreen2]);
</script>

Просмотреть файл

@ -0,0 +1,16 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>HTML OffscreenCanvas reference</title>
<link rel="author" title="Jonathan Kew" href="mailto:jkew@mozilla.com">
<canvas id="c1"></canvas>
<br>
<canvas id="c2"></canvas>
<script>
for (let c = 1; c <= 2; ++c) {
let ctx = document.getElementById("c" + c).getContext("2d");
ctx.font = "small-caps 32px serif";
ctx.fillText("Hello World", 20, 100);
}
</script>

Просмотреть файл

@ -0,0 +1,16 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>HTML OffscreenCanvas reference</title>
<link rel="author" title="Jonathan Kew" href="mailto:jkew@mozilla.com">
<canvas id="c1"></canvas>
<br>
<canvas id="c2"></canvas>
<script>
for (let c = 1; c <= 2; ++c) {
let ctx = document.getElementById("c" + c).getContext("2d");
ctx.font = "32px serif";
ctx.fillText("Hello World", 20, 100);
}
</script>

Просмотреть файл

@ -0,0 +1,16 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>HTML OffscreenCanvas reference</title>
<link rel="author" title="Jonathan Kew" href="mailto:jkew@mozilla.com">
<canvas id="c1"></canvas>
<br>
<canvas id="c2"></canvas>
<script>
for (let c = 1; c <= 2; ++c) {
let ctx = document.getElementById("c" + c).getContext("2d");
ctx.font = "small-caps 32px serif";
ctx.fillText("hello world", 20, 100);
}
</script>