diff --git a/package/src/renderer/__tests__/e2e/Colors.spec.tsx b/package/src/renderer/__tests__/e2e/Colors.spec.tsx index c6cbfb9d05..23815824ca 100644 --- a/package/src/renderer/__tests__/e2e/Colors.spec.tsx +++ b/package/src/renderer/__tests__/e2e/Colors.spec.tsx @@ -23,7 +23,7 @@ describe("Colors", () => { }; const c1 = Skia.Color("cyan"); - const c2 = Skia.Color([0, 1, 1, 1]); + const c2 = Skia.Color([0, 255, 255, 255]); const c3 = Skia.Color(0xff00ffff); const c4 = Skia.Color(Float32Array.of(0, 1, 1, 1)); @@ -35,4 +35,37 @@ describe("Colors", () => { }); expect(result).toBe(true); }); + it("should render the same color regardless of constructor input types", async () => { + // given (different inputs representing the same color + const colors = [ + "red", + Float32Array.of(1, 0, 0, 1), + 0xff0000ff, + [255, 0, 0, 255], + ]; + + // when (for each input we draw a colored canvas and encode it to bytes) + const buffers = await Promise.all( + colors.map((color) => + surface + .drawOffscreen( + (Skia, canvas, ctx) => { + canvas.drawColor(Skia.Color(ctx.color)); + }, + { color } + ) + .then((image) => image.encodeToBytes()) + ) + ); + + // then (expect the encoded bytes are equal) + for (let i = 1; i < buffers.length; i++) { + const prev = buffers[i - 1]; + const curr = buffers[i]; + expect(prev.length).toBe(curr.length); + for (let j = 0; j < prev.length; j++) { + expect(prev[j]).toBe(curr[j]); + } + } + }); });