fix: Watermark should not crash if content is empty (ant-design#44501)

ammar-knowledge · Aug 29, 2023 · 0f87c9d · 0f87c9d
1 parent 7a66d46
commit 0f87c9d
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 1 deletion.
diff --git a/components/watermark/__tests__/index.test.tsx b/components/watermark/__tests__/index.test.tsx
@@ -16,10 +16,18 @@ describe('Watermark', () => {
     });
   });
 
+  beforeEach(() => {
+    jest.useFakeTimers();
+  });
+
   afterAll(() => {
     mockSrcSet.mockRestore();
   });
 
+  afterEach(() => {
+    jest.useRealTimers();
+  });
+
   it('The watermark should render successfully', () => {
     const { container } = render(<Watermark className="watermark" content="Ant Design" />);
     expect(container.querySelector('.watermark div')).toBeTruthy();
@@ -94,4 +102,15 @@ describe('Watermark', () => {
     await waitFor(() => expect(target).toBeTruthy());
     expect(container).toMatchSnapshot();
   });
+
+  it('should not crash if content is empty string', async () => {
+    const spy = jest.spyOn(CanvasRenderingContext2D.prototype, 'drawImage');
+    render(<Watermark content="" className="watermark" />);
+    await waitFakeTimer();
+    expect(spy).not.toHaveBeenCalledWith(expect.anything(), 0, 0);
+    expect(spy).not.toHaveBeenCalledWith(expect.anything(), -0, 0);
+    expect(spy).not.toHaveBeenCalledWith(expect.anything(), -0, -0);
+    expect(spy).not.toHaveBeenCalledWith(expect.anything(), 0, -0);
+    spy.mockRestore();
+  });
 });
diff --git a/components/watermark/useClips.ts b/components/watermark/useClips.ts
@@ -69,7 +69,9 @@ export default function useClips() {
     // Copy from `ctx` and rotate
     rCtx.translate(realMaxSize / 2, realMaxSize / 2);
     rCtx.rotate(angle);
-    rCtx.drawImage(canvas, -contentWidth / 2, -contentHeight / 2);
+    if (contentWidth > 0 && contentHeight > 0) {
+      rCtx.drawImage(canvas, -contentWidth / 2, -contentHeight / 2);
+    }
 
     // Get boundary of rotated text
     function getRotatePos(x: number, y: number) {