Merge branch 'main' into fix/1475-fix-memory-issue-ios

Shopify · Apr 14, 2023 · 1c9dba9 · 1c9dba9
2 parents 802a4a0 + c75872e
commit 1c9dba9
Show file tree

Hide file tree

Showing 3 changed files with 57 additions and 0 deletions.
diff --git a/docs/static/img/image-filters/dropshadow-only.png b/docs/static/img/image-filters/dropshadow-only.png
diff --git a/docs/static/img/image-filters/innershadow-only.png b/docs/static/img/image-filters/innershadow-only.png
diff --git a/package/src/renderer/__tests__/e2e/ImageFilters.spec.tsx b/package/src/renderer/__tests__/e2e/ImageFilters.spec.tsx
@@ -102,6 +102,34 @@ describe("Test Image Filters", () => {
       threshold: 0.05,
     });
   });
+  it("Should draw a dropshadow only", async () => {
+    const { width } = surface;
+    const padding = width / 8;
+    const img = await surface.draw(
+      <>
+        <Fill color="lightblue" />
+        <RoundedRect
+          x={padding}
+          y={padding}
+          width={width - 2 * padding}
+          height={width - 2 * padding}
+          r={padding}
+          color="lightblue"
+        >
+          <Shadow
+            dx={-36 / 3}
+            dy={-36 / 3}
+            blur={75 / 3}
+            color="red"
+            shadowOnly
+          />
+        </RoundedRect>
+      </>
+    );
+    checkImage(img, docPath("image-filters/dropshadow-only.png"), {
+      threshold: 0.05,
+    });
+  });
   // This test should fail because it is not scaled properly but
   // it passes because of the low tolerance in the canvas result
   it("Should draw a innershadow", async () => {
@@ -133,6 +161,35 @@ describe("Test Image Filters", () => {
       threshold: 0.05,
     });
   });
+  it("Should draw a innershadow with only the shadow", async () => {
+    const { width } = surface;
+    const padding = width / 8;
+    const img = await surface.draw(
+      <>
+        <Fill color="lightblue" />
+        <RoundedRect
+          x={padding}
+          y={padding}
+          width={width - 2 * padding}
+          height={width - 2 * padding}
+          r={padding}
+          color="lightblue"
+        >
+          <Shadow
+            dx={-36 / 3}
+            dy={-36 / 3}
+            blur={75 / 3}
+            color="red"
+            inner
+            shadowOnly
+          />
+        </RoundedRect>
+      </>
+    );
+    checkImage(img, docPath("image-filters/innershadow-only.png"), {
+      threshold: 0.05,
+    });
+  });
   it("should show outer and inner shadows on text", async () => {
     const path =
       // eslint-disable-next-line max-len