From e7bc69fe53694560892b13a2c4f0dd2fc2c83b85 Mon Sep 17 00:00:00 2001
From: mdshamoon <mohdshamoon841@gmail.com>
Date: Thu, 1 Feb 2024 12:51:05 +0530
Subject: [PATCH 1/2] fixed resizer bug

---
 src/components/UI/Form/WhatsAppEditor/WhatsAppEditor.tsx | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/components/UI/Form/WhatsAppEditor/WhatsAppEditor.tsx b/src/components/UI/Form/WhatsAppEditor/WhatsAppEditor.tsx
index 890bffffd..9b1ea22c4 100644
--- a/src/components/UI/Form/WhatsAppEditor/WhatsAppEditor.tsx
+++ b/src/components/UI/Form/WhatsAppEditor/WhatsAppEditor.tsx
@@ -82,8 +82,10 @@ export const WhatsAppEditor = ({
     return getDefaultKeyBinding(e);
   };
 
-  const onResize = useCallback((height: any) => {
-    handleHeightChange(height - 40);
+  const onResize = useCallback((width: number | undefined, height: number | undefined) => {
+    if (height) {
+      handleHeightChange(height - 40);
+    }
   }, []);
 
   const { ref } = useResizeDetector({

From b9731e99bb5777f00cefcfd53be78ee8231af7db Mon Sep 17 00:00:00 2001
From: mdshamoon <mohdshamoon841@gmail.com>
Date: Fri, 2 Feb 2024 00:48:45 +0530
Subject: [PATCH 2/2] fixed test

---
 .../WhatsAppEditor/WhatsAppEditor.test.tsx     | 18 +++++++++++++-----
 1 file changed, 13 insertions(+), 5 deletions(-)

diff --git a/src/components/UI/Form/WhatsAppEditor/WhatsAppEditor.test.tsx b/src/components/UI/Form/WhatsAppEditor/WhatsAppEditor.test.tsx
index 47b3fc4c8..806783fc3 100644
--- a/src/components/UI/Form/WhatsAppEditor/WhatsAppEditor.test.tsx
+++ b/src/components/UI/Form/WhatsAppEditor/WhatsAppEditor.test.tsx
@@ -1,4 +1,4 @@
-import { render, fireEvent } from '@testing-library/react';
+import { render, fireEvent, waitFor } from '@testing-library/react';
 import draftJs, { EditorState, ContentState } from 'draft-js';
 import { vi } from 'vitest';
 
@@ -6,6 +6,13 @@ import WhatsAppEditor from './WhatsAppEditor';
 
 const mockHandleKeyCommand = vi.fn();
 
+const mockObserve = vi.fn();
+global.ResizeObserver = vi.fn().mockImplementation(() => ({
+  observe: mockObserve,
+  unobserve: vi.fn(),
+  disconnect: vi.fn(),
+}));
+
 vi.spyOn(draftJs, 'Editor').mockImplementation((props: any, _context: any) => {
   const input: any = (
     <input
@@ -51,10 +58,11 @@ describe('<WhatsAppEditor/>', () => {
     expect(mockHandleKeyCommand).toHaveBeenCalled();
   });
 
-  test('testing change size callback', () => {
-    const { getByTestId } = render(<WhatsAppEditor {...defaultProps(editorContent)} />);
-    fireEvent.click(getByTestId('resizer'));
-    expect(handleHeightChange).toHaveBeenCalled();
+  test('resize observer event is called', async () => {
+    render(<WhatsAppEditor {...defaultProps(editorContent)} />);
+    await waitFor(() => {
+      expect(mockObserve).toHaveBeenCalled();
+    });
   });
 
   // since we are mocking emoji mart picker we need to implement the following functionalities