Skip to content

Commit 5ecba93

Browse files
wcandillonwcandillon
authored
fix(🌎): Consolidate Enum access on RN Web (#3063)
1 parent 1fcdf51 commit 5ecba93

16 files changed

+117
-62
lines changed

‎packages/skia/src/skia/__tests__/Enums.spec.ts

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -111,4 +111,38 @@ describe("Enums", () => {
111111
);
112112
checkEnum(ClipOp, CanvasKit.ClipOp);
113113
});
114+
it("Should match color types with CanvasKit", () => {
115+
const { CanvasKit } = setupSkia();
116+
//expect(CanvasKit.ColorType.Unknown.value).toBe(ColorType.Unknown);
117+
expect(CanvasKit.ColorType.Alpha_8.value).toBe(ColorTypeCanvasKit.Alpha_8);
118+
expect(CanvasKit.ColorType.RGB_565.value).toBe(ColorTypeCanvasKit.RGB_565);
119+
//expect(CanvasKit.ColorType.ARGB_4444.value).toBe(ColorType.ARGB_4444);
120+
expect(CanvasKit.ColorType.RGBA_8888.value).toBe(
121+
ColorTypeCanvasKit.RGBA_8888
122+
);
123+
//expect(CanvasKit.ColorType.RGB_888x.value).toBe(ColorType.RGB_888x);
124+
expect(CanvasKit.ColorType.BGRA_8888.value).toBe(
125+
ColorTypeCanvasKit.BGRA_8888
126+
);
127+
expect(CanvasKit.ColorType.RGBA_1010102.value).toBe(
128+
ColorTypeCanvasKit.RGBA_1010102
129+
);
130+
//expect(CanvasKit.ColorType.BGRA_1010102.value).toBe(ColorType.BGRA_1010102);
131+
expect(CanvasKit.ColorType.RGB_101010x.value).toBe(
132+
ColorTypeCanvasKit.RGB_101010x
133+
);
134+
//expect(CanvasKit.ColorType.BGR_101010x.value).toBe(ColorType.BGR_101010x);
135+
//expect(CanvasKit.ColorType.BGR_101010x_XR.value).toBe(ColorType.BGR_101010x_XR);
136+
//expect(CanvasKit.ColorType.BGRA_10101010_XR.value).toBe(ColorType.BGRA_10101010_XR);
137+
//expect(CanvasKit.ColorType.RGBA_10x6.value).toBe(ColorType.RGBA_10x6);
138+
expect(CanvasKit.ColorType.Gray_8.value).toBe(ColorTypeCanvasKit.Gray_8);
139+
//expect(CanvasKit.ColorType.RGBA_F16Norm.value).toBe(ColorType.RGBA_F16Norm);
140+
expect(CanvasKit.ColorType.RGBA_F16.value).toBe(
141+
ColorTypeCanvasKit.RGBA_F16
142+
);
143+
//expect(CanvasKit.ColorType.RGB_F16F16F16x.value).toBe(ColorType.RGB_F16F16F16x);
144+
expect(CanvasKit.ColorType.RGBA_F32.value).toBe(
145+
ColorTypeCanvasKit.RGBA_F32
146+
);
147+
});
114148
});

‎packages/skia/src/skia/web/Host.ts

Lines changed: 24 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import type { CanvasKit, EmbindEnumEntity, EmbindEnum } from "canvaskit-wasm";
1+
import type { CanvasKit, EmbindEnumEntity } from "canvaskit-wasm";
22

33
import type { SkJSIInstance } from "../types";
44

@@ -42,11 +42,28 @@ export abstract class HostObject<T, N extends string> extends BaseHostObject<
4242
}
4343
}
4444

45-
export const getEnum = (e: EmbindEnum, v: number): EmbindEnumEntity =>
46-
Object.values(e).find(({ value }) => value === v);
45+
export const getEnum = (
46+
CanvasKit: CanvasKit,
47+
name: keyof CanvasKit,
48+
v: number
49+
): EmbindEnumEntity => {
50+
const e = CanvasKit[name];
51+
if (typeof e !== "function") {
52+
throw new Error(`${name} is not an number`);
53+
}
54+
const result = Object.values(e).find(({ value }) => value === v);
55+
if (!result) {
56+
throw new Error(
57+
`Enum ${name} does not have value ${v} on React Native Web`
58+
);
59+
}
60+
return result;
61+
};
4762

4863
export const optEnum = (
49-
e: EmbindEnum,
50-
value: number | undefined
51-
): EmbindEnumEntity | undefined =>
52-
value === undefined ? undefined : getEnum(e, value);
64+
CanvasKit: CanvasKit,
65+
name: keyof CanvasKit,
66+
v: number | undefined
67+
): EmbindEnumEntity | undefined => {
68+
return v === undefined ? undefined : getEnum(CanvasKit, name, v);
69+
};

‎packages/skia/src/skia/web/JsiSkCanvas.ts

Lines changed: 17 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -124,8 +124,8 @@ export class JsiSkCanvas
124124
JsiSkImage.fromValue(img),
125125
left,
126126
top,
127-
getEnum(this.CanvasKit.FilterMode, fm),
128-
getEnum(this.CanvasKit.MipmapMode, mm),
127+
getEnum(this.CanvasKit, "FilterMode", fm),
128+
getEnum(this.CanvasKit, "MipmapMode", mm),
129129
paint ? JsiSkPaint.fromValue(paint) : paint
130130
);
131131
}
@@ -141,7 +141,7 @@ export class JsiSkCanvas
141141
JsiSkImage.fromValue(img),
142142
Array.from(JsiSkRect.fromValue(this.CanvasKit, center)),
143143
JsiSkRect.fromValue(this.CanvasKit, dest),
144-
getEnum(this.CanvasKit.FilterMode, filter),
144+
getEnum(this.CanvasKit, "FilterMode", filter),
145145
paint ? JsiSkPaint.fromValue(paint) : paint
146146
);
147147
}
@@ -176,8 +176,8 @@ export class JsiSkCanvas
176176
JsiSkImage.fromValue(img),
177177
JsiSkRect.fromValue(this.CanvasKit, src),
178178
JsiSkRect.fromValue(this.CanvasKit, dest),
179-
getEnum(this.CanvasKit.FilterMode, fm),
180-
getEnum(this.CanvasKit.MipmapMode, mm),
179+
getEnum(this.CanvasKit, "FilterMode", fm),
180+
getEnum(this.CanvasKit, "MipmapMode", mm),
181181
paint ? JsiSkPaint.fromValue(paint) : paint
182182
);
183183
}
@@ -197,7 +197,7 @@ export class JsiSkCanvas
197197
drawVertices(verts: SkVertices, mode: BlendMode, paint: SkPaint) {
198198
this.ref.drawVertices(
199199
JsiSkVertices.fromValue(verts),
200-
getEnum(this.CanvasKit.BlendMode, mode),
200+
getEnum(this.CanvasKit, "BlendMode", mode),
201201
JsiSkPaint.fromValue(paint)
202202
);
203203
}
@@ -213,7 +213,7 @@ export class JsiSkCanvas
213213
cubics.map(({ x, y }) => [x, y]).flat(),
214214
colors,
215215
texs ? texs.flatMap((p) => Array.from(JsiSkPoint.fromValue(p))) : texs,
216-
mode ? getEnum(this.CanvasKit.BlendMode, mode) : null,
216+
mode ? getEnum(this.CanvasKit, "BlendMode", mode) : null,
217217
paint ? JsiSkPaint.fromValue(paint) : undefined
218218
);
219219
}
@@ -224,7 +224,7 @@ export class JsiSkCanvas
224224

225225
drawPoints(mode: PointMode, points: SkPoint[], paint: SkPaint) {
226226
this.ref.drawPoints(
227-
getEnum(this.CanvasKit.PointMode, mode),
227+
getEnum(this.CanvasKit, "PointMode", mode),
228228
points.map(({ x, y }) => [x, y]).flat(),
229229
JsiSkPaint.fromValue(paint)
230230
);
@@ -357,7 +357,7 @@ export class JsiSkCanvas
357357
drawColor(color: SkColor, blendMode?: BlendMode) {
358358
this.ref.drawColor(
359359
color,
360-
blendMode ? getEnum(this.CanvasKit.BlendMode, blendMode) : undefined
360+
blendMode ? getEnum(this.CanvasKit, "BlendMode", blendMode) : undefined
361361
);
362362
}
363363

@@ -368,23 +368,23 @@ export class JsiSkCanvas
368368
clipPath(path: SkPath, op: ClipOp, doAntiAlias: boolean) {
369369
this.ref.clipPath(
370370
JsiSkPath.fromValue(path),
371-
getEnum(this.CanvasKit.PathOp, op),
371+
getEnum(this.CanvasKit, "PathOp", op),
372372
doAntiAlias
373373
);
374374
}
375375

376376
clipRect(rect: SkRect, op: ClipOp, doAntiAlias: boolean) {
377377
this.ref.clipRect(
378378
JsiSkRect.fromValue(this.CanvasKit, rect),
379-
getEnum(this.CanvasKit.PathOp, op),
379+
getEnum(this.CanvasKit, "PathOp", op),
380380
doAntiAlias
381381
);
382382
}
383383

384384
clipRRect(rrect: InputRRect, op: ClipOp, doAntiAlias: boolean) {
385385
this.ref.clipRRect(
386386
JsiSkRRect.fromValue(this.CanvasKit, rrect),
387-
getEnum(this.CanvasKit.PathOp, op),
387+
getEnum(this.CanvasKit, "PathOp", op),
388388
doAntiAlias
389389
);
390390
}
@@ -426,9 +426,9 @@ export class JsiSkCanvas
426426
ckSampling = sampling;
427427
} else if (sampling) {
428428
ckSampling = {
429-
filter: getEnum(this.CanvasKit.FilterMode, sampling.filter),
429+
filter: getEnum(this.CanvasKit, "FilterMode", sampling.filter),
430430
mipmap: sampling.mipmap
431-
? getEnum(this.CanvasKit.MipmapMode, sampling.mipmap)
431+
? getEnum(this.CanvasKit, "MipmapMode", sampling.mipmap)
432432
: this.CanvasKit.MipmapMode.None,
433433
};
434434
}
@@ -438,7 +438,7 @@ export class JsiSkCanvas
438438
dst,
439439
JsiSkPaint.fromValue(paint),
440440
blendMode
441-
? getEnum(this.CanvasKit.BlendMode, blendMode)
441+
? getEnum(this.CanvasKit, "BlendMode", blendMode)
442442
: this.CanvasKit.BlendMode.DstOver,
443443
cls,
444444
ckSampling
@@ -450,8 +450,8 @@ export class JsiSkCanvas
450450
width: imageInfo.width,
451451
height: imageInfo.height,
452452
colorSpace: this.CanvasKit.ColorSpace.SRGB,
453-
alphaType: getEnum(this.CanvasKit.AlphaType, imageInfo.alphaType),
454-
colorType: getEnum(this.CanvasKit.ColorType, imageInfo.colorType),
453+
alphaType: getEnum(this.CanvasKit, "AlphaType", imageInfo.alphaType),
454+
colorType: getEnum(this.CanvasKit, "ColorType", imageInfo.colorType),
455455
};
456456
return this.ref.readPixels(srcX, srcY, pxInfo);
457457
}

‎packages/skia/src/skia/web/JsiSkColorFilterFactory.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ export class JsiSkColorFilterFactory
3131
this.CanvasKit,
3232
this.CanvasKit.ColorFilter.MakeBlend(
3333
color,
34-
getEnum(this.CanvasKit.BlendMode, mode)
34+
getEnum(this.CanvasKit, "BlendMode", mode)
3535
)
3636
);
3737
}

‎packages/skia/src/skia/web/JsiSkFont.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -100,15 +100,15 @@ export class JsiSkFont extends HostObject<Font, "Font"> implements SkFont {
100100
}
101101

102102
setEdging(edging: FontEdging) {
103-
this.ref.setEdging(getEnum(this.CanvasKit.FontEdging, edging));
103+
this.ref.setEdging(getEnum(this.CanvasKit, "FontEdging", edging));
104104
}
105105

106106
setEmbeddedBitmaps(embeddedBitmaps: boolean) {
107107
this.ref.setEmbeddedBitmaps(embeddedBitmaps);
108108
}
109109

110110
setHinting(hinting: FontHinting) {
111-
this.ref.setHinting(getEnum(this.CanvasKit.FontHinting, hinting));
111+
this.ref.setHinting(getEnum(this.CanvasKit, "FontHinting", hinting));
112112
}
113113

114114
setLinearMetrics(linearMetrics: boolean) {

‎packages/skia/src/skia/web/JsiSkImage.ts

Lines changed: 14 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -77,10 +77,10 @@ export class JsiSkImage extends HostObject<Image, "Image"> implements SkImage {
7777
return new JsiSkShader(
7878
this.CanvasKit,
7979
this.ref.makeShaderOptions(
80-
getEnum(this.CanvasKit.TileMode, tx),
81-
getEnum(this.CanvasKit.TileMode, ty),
82-
getEnum(this.CanvasKit.FilterMode, fm),
83-
getEnum(this.CanvasKit.MipmapMode, mm),
80+
getEnum(this.CanvasKit, "TileMode", tx),
81+
getEnum(this.CanvasKit, "TileMode", ty),
82+
getEnum(this.CanvasKit, "FilterMode", fm),
83+
getEnum(this.CanvasKit, "MipmapMode", mm),
8484
localMatrix ? JsiSkMatrix.fromValue(localMatrix) : undefined
8585
)
8686
);
@@ -96,8 +96,8 @@ export class JsiSkImage extends HostObject<Image, "Image"> implements SkImage {
9696
return new JsiSkShader(
9797
this.CanvasKit,
9898
this.ref.makeShaderCubic(
99-
getEnum(this.CanvasKit.TileMode, tx),
100-
getEnum(this.CanvasKit.TileMode, ty),
99+
getEnum(this.CanvasKit, "TileMode", tx),
100+
getEnum(this.CanvasKit, "TileMode", ty),
101101
B,
102102
C,
103103
localMatrix ? JsiSkMatrix.fromValue(localMatrix) : undefined
@@ -109,11 +109,13 @@ export class JsiSkImage extends HostObject<Image, "Image"> implements SkImage {
109109
let result: Uint8Array | null;
110110
if (fmt && quality) {
111111
result = this.ref.encodeToBytes(
112-
getEnum(this.CanvasKit.ImageFormat, fmt),
112+
getEnum(this.CanvasKit, "ImageFormat", fmt),
113113
quality
114114
);
115115
} else if (fmt) {
116-
result = this.ref.encodeToBytes(getEnum(this.CanvasKit.ImageFormat, fmt));
116+
result = this.ref.encodeToBytes(
117+
getEnum(this.CanvasKit, "ImageFormat", fmt)
118+
);
117119
} else {
118120
result = this.ref.encodeToBytes();
119121
}
@@ -137,11 +139,13 @@ export class JsiSkImage extends HostObject<Image, "Image"> implements SkImage {
137139
width: imageInfo?.width ?? info.width,
138140
height: imageInfo?.height ?? info.height,
139141
alphaType: getEnum(
140-
this.CanvasKit.AlphaType,
142+
this.CanvasKit,
143+
"AlphaType",
141144
(imageInfo ?? info).alphaType
142145
),
143146
colorType: getEnum(
144-
this.CanvasKit.ColorType,
147+
this.CanvasKit,
148+
"ColorType",
145149
(imageInfo ?? info).colorType
146150
),
147151
};

‎packages/skia/src/skia/web/JsiSkImageFactory.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -83,9 +83,9 @@ export class JsiSkImageFactory extends Host implements ImageFactory {
8383
// see toSkImageInfo() from canvaskit
8484
const image = this.CanvasKit.MakeImage(
8585
{
86-
alphaType: getEnum(this.CanvasKit.AlphaType, info.alphaType),
86+
alphaType: getEnum(this.CanvasKit, "AlphaType", info.alphaType),
8787
colorSpace: this.CanvasKit.ColorSpace.SRGB,
88-
colorType: getEnum(this.CanvasKit.ColorType, info.colorType),
88+
colorType: getEnum(this.CanvasKit, "ColorType", info.colorType),
8989
height: info.height,
9090
width: info.width,
9191
},

‎packages/skia/src/skia/web/JsiSkImageFilterFactory.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -42,8 +42,8 @@ export class JsiSkImageFilterFactory
4242
const inputFilter =
4343
input === null ? null : JsiSkImageFilter.fromValue<ImageFilter>(input);
4444
const filter = this.CanvasKit.ImageFilter.MakeDisplacementMap(
45-
getEnum(this.CanvasKit.ColorChannel, channelX),
46-
getEnum(this.CanvasKit.ColorChannel, channelY),
45+
getEnum(this.CanvasKit, "ColorChannel", channelX),
46+
getEnum(this.CanvasKit, "ColorChannel", channelY),
4747
scale,
4848
JsiSkImageFilter.fromValue(in1),
4949
inputFilter
@@ -69,7 +69,7 @@ export class JsiSkImageFilterFactory
6969
this.CanvasKit.ImageFilter.MakeBlur(
7070
sigmaX,
7171
sigmaY,
72-
getEnum(this.CanvasKit.TileMode, mode),
72+
getEnum(this.CanvasKit, "TileMode", mode),
7373
input === null ? null : JsiSkImageFilter.fromValue(input)
7474
)
7575
);
@@ -189,7 +189,7 @@ export class JsiSkImageFilterFactory
189189
throwNotImplementedOnRNWeb<SkImageFilter>();
190190
}
191191
const filter = this.CanvasKit.ImageFilter.MakeBlend(
192-
getEnum(this.CanvasKit.BlendMode, mode),
192+
getEnum(this.CanvasKit, "BlendMode", mode),
193193
JsiSkImageFilter.fromValue(background),
194194
inputFilter
195195
);

‎packages/skia/src/skia/web/JsiSkMaskFilterFactory.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ export class JsiSkMaskFilterFactory extends Host implements MaskFilterFactory {
1515
return new JsiSkMaskFilter(
1616
this.CanvasKit,
1717
this.CanvasKit.MaskFilter.MakeBlur(
18-
getEnum(this.CanvasKit.BlurStyle, style),
18+
getEnum(this.CanvasKit, "BlurStyle", style),
1919
sigma,
2020
respectCTM
2121
)

‎packages/skia/src/skia/web/JsiSkPaint.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,7 @@ export class JsiSkPaint extends HostObject<Paint, "Paint"> implements SkPaint {
7979
}
8080

8181
setBlendMode(blendMode: BlendMode) {
82-
this.ref.setBlendMode(getEnum(this.CanvasKit.BlendMode, blendMode));
82+
this.ref.setBlendMode(getEnum(this.CanvasKit, "BlendMode", blendMode));
8383
}
8484

8585
setColor(color: SkColor) {
@@ -107,11 +107,11 @@ export class JsiSkPaint extends HostObject<Paint, "Paint"> implements SkPaint {
107107
}
108108

109109
setStrokeCap(cap: StrokeCap) {
110-
this.ref.setStrokeCap(getEnum(this.CanvasKit.StrokeCap, cap));
110+
this.ref.setStrokeCap(getEnum(this.CanvasKit, "StrokeCap", cap));
111111
}
112112

113113
setStrokeJoin(join: StrokeJoin) {
114-
this.ref.setStrokeJoin(getEnum(this.CanvasKit.StrokeJoin, join));
114+
this.ref.setStrokeJoin(getEnum(this.CanvasKit, "StrokeJoin", join));
115115
}
116116

117117
setStrokeMiter(limit: number) {

0 commit comments

Comments
 (0)