@shopify/react-native-skia 2.2.21 → 2.3.4

package/src/mock/__tests__/mock.spec.ts

@@ -1,47 +0,0 @@
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-global.CanvasKit = {} as any;
-import { Mock } from "../index";
-
-/**
- * Added mocks to react-native stuff as needed so we can import the skia library
- * without issues just to test that our mocks match up accordingly
- */
-jest.mock("../../skia/NativeSetup", () => ({}));
-jest.mock("../../Platform/Platform", () => ({}));
-jest.mock("react-native", () => ({
-  View: jest.fn(),
-}));
-jest.mock("../../specs/SkiaPictureViewNativeComponent", () => {});
-jest.mock("../../external/reanimated/index", () => {});
-
-describe("Mocks", () => {
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  const mocked = Mock({} as any);
-  const Skia = require("../../index");
-
-  afterAll(() => {
-    jest.clearAllMocks();
-  });
-
-  describe("Mocked module contains all exports", () => {
-    test.each(
-      Object.keys(Skia).map((k) => ({
-        key: k,
-      }))
-    )("$key should be in mock", ({ key }) => {
-      const mockExports = Object.keys(mocked);
-      expect(mockExports.includes(key)).toEqual(true);
-      expect(typeof mocked[key]).toEqual(typeof Skia[key]);
-    });
-  });
-
-  test("Skia mock contains all props", () => {
-    // ts-expect-error
-    const SkiaExports = Object.keys(Skia["Skia" as keyof typeof Skia]);
-    const mockSkia = Object.keys(mocked.Skia);
-
-    for (const skiaExport of SkiaExports) {
-      expect(mockSkia.find((exp) => exp === skiaExport)).toEqual(skiaExport);
-    }
-  });
-});

package/src/renderer/__tests__/Data.spec.tsx

@@ -1,66 +0,0 @@
-import React from "react";
-
-import { processResult } from "../../__tests__/setup";
-import { Fill } from "../components";
-import * as SkiaRenderer from "../index";
-
-import type { EmptyProps } from "./setup";
-import { importSkia, mountCanvas, wait } from "./setup";
-
-const CheckData = ({}: EmptyProps) => {
-  const { useFont } = importSkia();
-  const font = useFont(null);
-  if (font === null) {
-    return <Fill color="green" />;
-  }
-  return <Fill color="red" />;
-};
-
-const CheckFont = ({}: EmptyProps) => {
-  const { useFont } = importSkia();
-  const font = useFont("skia/__tests__/assets/Roboto-Medium.ttf");
-  if (!font) {
-    return <Fill color="red" />;
-  }
-  return <Fill color="green" />;
-};
-
-const CheckImage = ({}: EmptyProps) => {
-  const { useImage } = importSkia();
-  const image = useImage("skia/__tests__/assets/zurich.jpg");
-  if (!image) {
-    return <Fill color="red" />;
-  }
-  return <Fill color="green" />;
-};
-
-describe("Data Loading", () => {
-  it("Loads renderer without Skia", async () => {
-    expect(SkiaRenderer).toBeDefined();
-  });
-  it("Should accept null as an argument", async () => {
-    const { surface, draw } = await mountCanvas(<CheckData />);
-    await draw();
-    processResult(surface, "snapshots/font/green.png");
-    await draw();
-    processResult(surface, "snapshots/font/green.png");
-  });
-
-  it("Should load a font file", async () => {
-    const { surface, draw } = await mountCanvas(<CheckFont />);
-    await draw();
-    processResult(surface, "snapshots/font/red.png");
-    await wait(1500);
-    await draw();
-    processResult(surface, "snapshots/font/green.png");
-  });
-
-  it("Should load an image", async () => {
-    const { surface, draw } = await mountCanvas(<CheckImage />);
-    await draw();
-    processResult(surface, "snapshots/font/red.png");
-    await wait(1500);
-    await draw();
-    processResult(surface, "snapshots/font/green.png");
-  });
-});

package/src/renderer/__tests__/Drawings.spec.tsx

@@ -1,96 +0,0 @@
-import React, { useEffect, useState } from "react";
-
-import { docPath, processResult } from "../../__tests__/setup";
-import { Blur, Circle, DiffRect, Fill, Group, Paint } from "../components";
-
-import {
-  drawOnNode,
-  width,
-  height,
-  importSkia,
-  PIXEL_RATIO,
-  mountCanvas,
-  wait,
-} from "./setup";
-
-const CheckEmptyCanvas = () => {
-  const { Skia } = importSkia();
-  const [color, setColor] = useState("green");
-  useEffect(() => {
-    setTimeout(() => {
-      setColor("transparent");
-    }, 16);
-  }, [Skia]);
-
-  return (
-    <Group>
-      <Fill color={color} />
-    </Group>
-  );
-};
-
-describe("Test introductionary examples from our documentation", () => {
-  it("Should blend colors using multiplication", async () => {
-    const r = width * 0.33;
-    const surface = await drawOnNode(
-      <Group blendMode="multiply">
-        <Circle cx={r} cy={r} r={r} color="cyan" />
-        <Circle cx={width - r} cy={r} r={r} color="magenta" />
-        <Circle cx={width / 2} cy={height - r} r={r} color="yellow" />
-      </Group>
-    );
-    processResult(surface, "snapshots/drawings/blend-mode-multiply.png");
-  });
-
-  it("Should use a blur image filter", async () => {
-    const r = width * 0.33;
-    const surface = await drawOnNode(
-      <Group blendMode="multiply">
-        <Blur blur={30} />
-        <Circle cx={r} cy={r} r={r} color="cyan" />
-        <Circle cx={width - r} cy={r} r={r} color="magenta" />
-        <Circle cx={width / 2} cy={height - r} r={r} color="yellow" />
-      </Group>
-    );
-    processResult(surface, "snapshots/drawings/blur-node.png");
-  });
-
-  it("Should use multiple paint definitions for one drawing command", async () => {
-    const r = width / 4;
-    const strokeWidth = 50;
-    const surface = await drawOnNode(
-      <>
-        <Circle cx={width / 2} cy={width / 2} r={r} color="red">
-          <Paint color="lightblue" />
-          <Paint color="#adbce6" style="stroke" strokeWidth={strokeWidth} />
-          <Paint color="#ade6d8" style="stroke" strokeWidth={strokeWidth / 2} />
-        </Circle>
-      </>
-    );
-    processResult(surface, "snapshots/drawings/multiple-paints.png");
-  });
-
-  it("Should draw DRect", async () => {
-    const { rrect, rect } = importSkia();
-    const padding = 25 * PIXEL_RATIO;
-    const outer = rrect(rect(0, 0, width, width), padding, padding);
-    const inner = rrect(
-      rect(padding * 2, padding * 2, width - padding * 4, width - padding * 4),
-      padding * 2,
-      padding * 2
-    );
-    const surface = await drawOnNode(
-      <DiffRect inner={inner} outer={outer} color="lightblue" />
-    );
-    processResult(surface, docPath("shapes/drect.png"));
-  });
-
-  it("should clear the canvas even if it's empty", async () => {
-    const { surface, draw } = await mountCanvas(<CheckEmptyCanvas />);
-    await draw();
-    processResult(surface, "snapshots/green.png");
-    await wait(1000);
-    await draw();
-    processResult(surface, "snapshots/transparent.png");
-  });
-});