-
Notifications
You must be signed in to change notification settings - Fork 72
/
create_elements.ts
82 lines (75 loc) · 2.39 KB
/
create_elements.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
import { Fixture } from '../../common/framework/fixture.js';
import { unreachable } from '../../common/util/util.js';
// TESTING_TODO: This should expand to more canvas types (which will enhance a bunch of tests):
// - canvas element not in dom
// - canvas element in dom
// - offscreen canvas from transferControlToOffscreen from canvas not in dom
// - offscreen canvas from transferControlToOffscreen from canvas in dom
// - offscreen canvas from new OffscreenCanvas
export const kAllCanvasTypes = ['onscreen', 'offscreen'] as const;
export type CanvasType = (typeof kAllCanvasTypes)[number];
type CanvasForCanvasType<T extends CanvasType> = {
onscreen: HTMLCanvasElement;
offscreen: OffscreenCanvas;
}[T];
/** Valid contextId for HTMLCanvasElement/OffscreenCanvas,
* spec: https://html.spec.whatwg.org/multipage/canvas.html#dom-canvas-getcontext
*/
export const kValidCanvasContextIds = [
'2d',
'bitmaprenderer',
'webgl',
'webgl2',
'webgpu',
] as const;
export type CanvasContext = (typeof kValidCanvasContextIds)[number];
/** Create HTMLCanvas/OffscreenCanvas. */
export function createCanvas<T extends CanvasType>(
test: Fixture,
canvasType: T,
width: number,
height: number
): CanvasForCanvasType<T> {
if (canvasType === 'onscreen') {
if (typeof document !== 'undefined') {
return createOnscreenCanvas(test, width, height) as CanvasForCanvasType<T>;
} else {
test.skip('Cannot create HTMLCanvasElement');
}
} else if (canvasType === 'offscreen') {
if (typeof OffscreenCanvas !== 'undefined') {
return createOffscreenCanvas(test, width, height) as CanvasForCanvasType<T>;
} else {
test.skip('Cannot create an OffscreenCanvas');
}
} else {
unreachable();
}
}
/** Create HTMLCanvasElement. */
export function createOnscreenCanvas(
test: Fixture,
width: number,
height: number
): HTMLCanvasElement {
let canvas: HTMLCanvasElement;
if (typeof document !== 'undefined') {
canvas = document.createElement('canvas');
canvas.width = width;
canvas.height = height;
} else {
test.skip('Cannot create HTMLCanvasElement');
}
return canvas;
}
/** Create OffscreenCanvas. */
export function createOffscreenCanvas(
test: Fixture,
width: number,
height: number
): OffscreenCanvas {
if (typeof OffscreenCanvas === 'undefined') {
test.skip('OffscreenCanvas is not supported');
}
return new OffscreenCanvas(width, height);
}