✅ Add tests for Waves

src/molecules/Waves/WaveStatic.tsx

@@ -11,7 +11,6 @@ export const WaveStatic: FC = () => {
   useEffect(() => {
     const resizeHandler = (event: Event) => {
       const target = event.target as Window;
-      console.log(target);
       setViewBox(`0 0 ${target.innerWidth} ${target.innerHeight - 64}`);
     };
 

src/molecules/Waves/Waves.test.tsx

@@ -1,19 +1,30 @@
+import { act } from 'react';
+
+import { faker } from '@faker-js/faker';
 import { render } from '@testing-library/react';
 
-import { Waves, WavesProps } from './Waves';
+import { Waves } from './Waves';
+
+test('renders expected amount of svgs', () => {
+  const { container } = render(<Waves />);
+  expect(container).toBeInTheDocument();
+
+  expect(container.children[0].children[0].childNodes.length).toBe(2);
+});
 
-const renderVisualWaves = (props: Partial<WavesProps> = {}) => {
-  const defaultProps: WavesProps = {
-    waveIntervalDist: 3,
-    waveDelay: 0.75,
-    numWaves: 10,
-    heightFromBottom: 600,
-  };
+test('resize actually resizes', async () => {
+  const { container } = render(<Waves />);
+  const randomWidth = faker.number.int({ min: 100, max: 1920 });
+  const randomHeight = faker.number.int({ min: 100, max: 1080 });
 
-  return render(<Waves {...defaultProps} {...props} />);
-};
+  await act(async () => {
+    window['innerWidth'] = randomWidth;
+    window['innerHeight'] = randomHeight;
+    window.dispatchEvent(new Event('resize'));
+  });
 
-test('renders correctly with default props', () => {
-  const { container } = renderVisualWaves();
-  expect(container).toBeInTheDocument();
+  expect(container.children[0].children[0]).toHaveAttribute(
+    'viewBox',
+    `0 0 ${randomWidth} ${randomHeight - 64}`
+  );
 });