chore: dedupe jest and bump babel/jest related deps (#167)

microsoft · Apr 12, 2024 · 170e83e · 170e83e
1 parent 7cf0593
commit 170e83e
Show file tree

Hide file tree

Showing 3 changed files with 882 additions and 1,424 deletions.
diff --git a/package.json b/package.json
@@ -21,9 +21,9 @@
     "node": "^18.0.0 || ^20.0.0"
   },
   "devDependencies": {
-    "@babel/preset-env": "^7.21.5",
-    "@babel/preset-react": "^7.18.6",
-    "@babel/preset-typescript": "^7.21.5",
+    "@babel/preset-env": "7.24.4",
+    "@babel/preset-react": "7.24.1",
+    "@babel/preset-typescript": "7.24.1",
     "@dnd-kit/core": "^6.1.0",
     "@dnd-kit/modifiers": "^7.0.0",
     "@dnd-kit/utilities": "^3.2.2",
@@ -51,15 +51,15 @@
     "@storybook/core-server": "7.6.10",
     "@storybook/jest": "^0.2.3",
     "@storybook/react-webpack5": "7.6.10",
-    "@storybook/test-runner": "^0.13.0",
+    "@storybook/test-runner": "0.14.0",
     "@storybook/testing-library": "^0.2.2",
     "@swc-node/register": "1.6.8",
     "@swc/cli": "~0.1.62",
     "@swc/core": "1.3.107",
     "@swc/helpers": "0.5.3",
-    "@swc/jest": "0.2.20",
+    "@swc/jest": "0.2.36",
     "@testing-library/react": "^14.0.0",
-    "@types/jest": "^29.4.0",
+    "@types/jest": "29.5.12",
     "@types/node": "18.19.10",
     "@types/react": "18.2.74",
     "@types/react-dom": "18.2.24",
@@ -73,8 +73,8 @@
     "eslint-config-prettier": "9.1.0",
     "eslint-plugin-import": "^2.27.5",
     "eslint-plugin-playwright": "^0.15.3",
-    "jest": "^29.4.1",
-    "jest-environment-jsdom": "^29.4.1",
+    "jest": "29.7.0",
+    "jest-environment-jsdom": "29.7.0",
     "jsonc-eslint-parser": "^2.1.0",
     "nx": "17.3.2",
     "parsel-js": "^1.1.2",

diff --git a/...eact-draggable-dialog/src/components/DraggableDialogHandle/DraggableDialogHandle.test.tsx b/...eact-draggable-dialog/src/components/DraggableDialogHandle/DraggableDialogHandle.test.tsx
@@ -2,33 +2,38 @@ import * as React from 'react';
 import { render } from '@testing-library/react';
 import { DraggableDialogHandle } from './DraggableDialogHandle';
 
-import * as contexts from '../../contexts/DraggableDialogContext';
-import * as dnd from '@dnd-kit/core';
+import { useDraggableDialogContext } from '../../contexts/DraggableDialogContext';
+import { useDraggable } from '@dnd-kit/core';
 
-jest.mock('../../contexts/DraggableDialogContext', () => ({
-  __esModule: true,
-  ...jest.requireActual('../../contexts/DraggableDialogContext'),
-}));
+jest.mock('../../contexts/DraggableDialogContext');
+jest.mock('@dnd-kit/core');
 
-jest.mock('@dnd-kit/core', () => ({
-  __esModule: true,
-  ...jest.requireActual('@dnd-kit/core'),
-}));
+type UseDraggableFn = (
+  args: Parameters<typeof useDraggable>[number]
+) => Partial<ReturnType<typeof useDraggable>>;
+type UseDraggableDialogContextFn = () => Partial<
+  ReturnType<typeof useDraggableDialogContext>
+>;
+
+const useDraggableDialogContextSpy = jest.mocked<UseDraggableDialogContextFn>(
+  useDraggableDialogContext
+);
+const useDraggableSpy = jest.mocked<UseDraggableFn>(useDraggable);
 
 describe('DraggableDialogHandle', () => {
   let consoleErrorSpy: jest.SpyInstance;
-  let useDraggableDialogContextSpy: jest.SpyInstance;
-  let useDraggableSpy: jest.SpyInstance;
 
   beforeEach(() => {
     consoleErrorSpy = jest
       .spyOn(console, 'error')
       .mockImplementation((error: string) => error);
-    useDraggableDialogContextSpy = jest.spyOn(
-      contexts,
-      'useDraggableDialogContext'
-    );
-    useDraggableSpy = jest.spyOn(dnd, 'useDraggable');
+
+    useDraggableSpy.mockReturnValue({
+      setActivatorNodeRef: jest.fn(),
+    });
+    useDraggableDialogContextSpy.mockReturnValue({
+      id: 'draggable-dialog-id',
+    });
   });
 
   afterEach(() => {
@@ -77,8 +82,11 @@ describe('DraggableDialogHandle', () => {
   it('should add draggable props to the child', () => {
     const mockAttributes = {
       'aria-describedby': 'dialog-id',
-      'aria-disabled': 'false',
+      'aria-disabled': false,
       role: 'button',
+      tabIndex: 0,
+      'aria-pressed': false,
+      'aria-roledescription': 'draggable',
     };
     useDraggableSpy.mockReturnValue({
       setActivatorNodeRef: jest.fn(),
@@ -95,7 +103,7 @@ describe('DraggableDialogHandle', () => {
     Object.keys(mockAttributes).forEach((key) => {
       const prop = key as keyof typeof mockAttributes;
 
-      expect(handle.getAttribute(prop)).toBe(mockAttributes[prop]);
+      expect(handle.getAttribute(prop)).toBe(String(mockAttributes[prop]));
     });
   });