fix(tests): resolve unrecognized jest-dom types in TypeScript

Author: TheauW

packages/diracx-web-components/stories/DataTable.stories.tsx

@@ -7,6 +7,8 @@ import {
 import { ThemeProvider } from "../src/contexts/ThemeProvider";
 import { DataTable, DataTableProps } from "../src/components/shared/DataTable";
 
+import { CategoryType } from "../src";
+
 interface SimpleItem extends Record<string, unknown> {
   id: number;
   name: string;
@@ -18,15 +20,15 @@ const columnHelper = createColumnHelper<SimpleItem>();
 const columnDefs = [
   columnHelper.accessor("id", {
     header: "ID",
-    meta: { type: "number" },
+    meta: { type: CategoryType.NUMBER },
   }),
   columnHelper.accessor("name", {
     header: "Name",
-    meta: { type: "string" },
+    meta: { type: CategoryType.STRING },
   }),
   columnHelper.accessor("email", {
     header: "Email",
-    meta: { type: "string" },
+    meta: { type: CategoryType.STRING },
   }),
 ];
 

packages/diracx-web-components/stories/SearchBar.stories.tsx

@@ -108,7 +108,7 @@ const createSuggestions = async (
   };
 };
 
-const meta: Meta<SearchBarProps> = {
+const meta: Meta<SearchBarProps<string>> = {
   title: "shared/SearchBar",
   component: SearchBar,
   parameters: {
@@ -127,7 +127,7 @@ const meta: Meta<SearchBarProps> = {
 };
 
 export default meta;
-type Story = StoryObj<SearchBarProps>;
+type Story = StoryObj<SearchBarProps<string>>;
 
 export const Default: Story = {
   args: {

packages/diracx-web-components/stories/mocks/metadata.mock.tsx

@@ -1,7 +1,5 @@
 import { Metadata } from "../../src/hooks/metadata";
 
-export { Metadata } from "../../src/hooks/metadata";
-
 // Create a store for mock data
 let mockMetadataResponse: {
   metadata: Metadata | null;

packages/diracx-web-components/test/ChartView.test.tsx

@@ -1,7 +1,6 @@
 import { render, screen } from "@testing-library/react";
 import { composeStories } from "@storybook/react";
 import * as stories from "../stories/ChartView.stories";
-import "@testing-library/jest-dom";
 
 // Compose the stories to get actual Storybook behavior (decorators, args, etc)
 const { Default } = composeStories(stories);

packages/diracx-web-components/test/Dashboard.test.tsx

@@ -3,7 +3,6 @@ import { composeStories } from "@storybook/react";
 import { useOidc, useOidcAccessToken } from "@axa-fr/react-oidc";
 import { useMediaQuery } from "@mui/material";
 import * as stories from "../stories/Dashboard.stories";
-import "@testing-library/jest-dom";
 
 // Compose your Storybook stories (this will include all decorators/args)
 const { Default } = composeStories(stories);

packages/diracx-web-components/test/DataTable.test.tsx

@@ -1,7 +1,5 @@
 import { render, screen, fireEvent, cleanup } from "@testing-library/react";
-import "@testing-library/jest-dom";
 import { composeStories } from "@storybook/react";
-import { afterEach, describe, it, expect } from "@jest/globals";
 import * as stories from "../stories/DataTable.stories";
 
 // Compose the stories to get actual Storybook behavior (decorators, args, etc)

packages/diracx-web-components/test/ErrorBox.test.tsx

@@ -1,7 +1,6 @@
 import { render, screen, fireEvent } from "@testing-library/react";
 import { composeStories } from "@storybook/react";
 import * as stories from "../stories/ErrorBox.stories";
-import "@testing-library/jest-dom";
 
 // Compose the stories to get actual Storybook behavior (decorators, args, etc)
 const { Default } = composeStories(stories);

packages/diracx-web-components/test/JobMonitor.test.tsx

@@ -8,7 +8,6 @@ import {
 import { composeStories } from "@storybook/react";
 import { VirtuosoMockContext } from "react-virtuoso";
 import * as stories from "../stories/JobMonitor.stories";
-import "@testing-library/jest-dom";
 
 // Compose Storybook stories (includes all decorators/args)
 const { Default, Loading, Empty, WithError } = composeStories(stories);

packages/diracx-web-components/test/LoginForm.test.tsx

@@ -2,7 +2,6 @@ import { render, screen, fireEvent } from "@testing-library/react";
 import { composeStories } from "@storybook/react";
 import * as stories from "../stories/LoginForm.stories";
 import { useOidc } from "../stories/mocks/react-oidc.mock";
-import "@testing-library/jest-dom";
 
 const { SingleVO, MultiVO, Error, Loading } = composeStories(stories);
 

packages/diracx-web-components/test/SearchBar.test.tsx

@@ -2,7 +2,6 @@ import { render, screen, waitFor } from "@testing-library/react";
 import { composeStories } from "@storybook/react";
 import userEvent from "@testing-library/user-event";
 import * as stories from "../stories/SearchBar.stories";
-import "@testing-library/jest-dom";
 
 // Compose the stories to get actual Storybook behavior (decorators, args, etc)
 const { Default, WithPrefilledTokens } = composeStories(stories);