From e56f1883d03d931d4c89468d6928f5175b6cb481 Mon Sep 17 00:00:00 2001 From: PelayoFelgueroso Date: Fri, 25 Sep 2026 14:15:01 +0200 Subject: [PATCH 1/5] Update table tests to react19 --- packages/lib/src/table/Table.test.tsx | 17 ++++++++--------- 1 file changed, 8 insertions(+), 9 deletions(-) diff --git a/packages/lib/src/table/Table.test.tsx b/packages/lib/src/table/Table.test.tsx index 3c0f4fc56f..be1f1d1628 100644 --- a/packages/lib/src/table/Table.test.tsx +++ b/packages/lib/src/table/Table.test.tsx @@ -1,4 +1,4 @@ -import { act, render } from "@testing-library/react"; +import { render } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; import DxcTable from "./Table"; @@ -50,7 +50,7 @@ describe("Table component tests", () => { expect(getByText("cell-6")).toBeTruthy(); }); - test("Table ActionsCell", () => { + test("Table ActionsCell", async () => { const onSelectOption = jest.fn(); const onClick = jest.fn(); const actions = [ @@ -105,18 +105,17 @@ describe("Table component tests", () => { ); const dropdown = getAllByRole("button")[1]; - act(() => { - if (dropdown) { - userEvent.click(dropdown); - } - }); + if (!dropdown) { + throw new Error("Expected the actions dropdown to be rendered"); + } + await Promise.resolve(userEvent.click(dropdown)); expect(getByRole("menu")).toBeTruthy(); const option = getByText("Aliexpress"); - userEvent.click(option); + await Promise.resolve(userEvent.click(option)); expect(onSelectOption).toHaveBeenCalledWith("3"); const action = getAllByRole("button")[0]; if (action) { - userEvent.click(action); + await Promise.resolve(userEvent.click(action)); } expect(onClick).toHaveBeenCalled(); }); From d7352a424572a613b8ec0f17c469a8e2ac48de57 Mon Sep 17 00:00:00 2001 From: PelayoFelgueroso Date: Fri, 25 Sep 2026 14:38:55 +0200 Subject: [PATCH 2/5] update datagrid tests and storybook to react19 --- packages/lib/src/data-grid/DataGrid.tsx | 2 +- packages/lib/src/data-grid/utils.tsx | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/lib/src/data-grid/DataGrid.tsx b/packages/lib/src/data-grid/DataGrid.tsx index 7a4b966eca..12dbb94a99 100644 --- a/packages/lib/src/data-grid/DataGrid.tsx +++ b/packages/lib/src/data-grid/DataGrid.tsx @@ -1,5 +1,5 @@ import { useEffect, useMemo, useState } from "react"; -import { DataGrid, SortColumn } from "react-data-grid"; +import DataGrid, { SortColumn } from "react-data-grid"; import styled from "@emotion/styled"; import DataGridPropsType, { HierarchyGridRow, GridRow, ExpandableGridRow } from "./types"; import "react-data-grid/lib/styles.css"; diff --git a/packages/lib/src/data-grid/utils.tsx b/packages/lib/src/data-grid/utils.tsx index be9e1958b8..69864da3b5 100644 --- a/packages/lib/src/data-grid/utils.tsx +++ b/packages/lib/src/data-grid/utils.tsx @@ -1,5 +1,5 @@ import { ReactNode, SetStateAction } from "react"; -import { Column, RenderSortStatusProps, SortColumn, renderTextEditor } from "react-data-grid"; +import { Column, RenderSortStatusProps, SortColumn, textEditor } from "react-data-grid"; import DxcActionIcon from "../action-icon/ActionIcon"; import DxcCheckbox from "../checkbox/Checkbox"; import DxcIcon from "../icon/Icon"; @@ -23,7 +23,7 @@ export const convertToRDGColumns = ( draggable: gridColumn.draggable, editable: gridColumn.textEditable, headerCellClass: gridColumn.alignment ? `header-align-${gridColumn.alignment}` : `header-align-left`, - renderEditCell: gridColumn.textEditable ? renderTextEditor : undefined, + renderEditCell: gridColumn.textEditable ? textEditor : undefined, renderCell: ({ row }) => (
{row[gridColumn.key]} From 38898a5124a7771cebb350a85e33378f2b60d534 Mon Sep 17 00:00:00 2001 From: PelayoFelgueroso Date: Mon, 28 Sep 2026 11:27:01 +0200 Subject: [PATCH 3/5] Fix last Table test and ResultsetTable tests --- .../resultset-table/ResultsetTable.test.tsx | 27 +++++++------------ packages/lib/src/table/Table.test.tsx | 9 +++---- 2 files changed, 14 insertions(+), 22 deletions(-) diff --git a/packages/lib/src/resultset-table/ResultsetTable.test.tsx b/packages/lib/src/resultset-table/ResultsetTable.test.tsx index 17884ea46d..b9e02aaca0 100644 --- a/packages/lib/src/resultset-table/ResultsetTable.test.tsx +++ b/packages/lib/src/resultset-table/ResultsetTable.test.tsx @@ -1,5 +1,4 @@ -import { act, fireEvent, render } from "@testing-library/react"; -import userEvent from "@testing-library/user-event"; +import { fireEvent, render } from "@testing-library/react"; import DxcCheckbox from "../checkbox/Checkbox"; import DxcResultsetTable from "./ResultsetTable"; @@ -375,12 +374,12 @@ describe("Resultset table component tests", () => { expect(getByText("Louis")).toBeTruthy(); expect(getByText("Lana")).toBeTruthy(); expect(getAllByRole("row").length - 1).toEqual(3); - const goToPageSelect = getAllByRole("button")[3]; + const goToPageSelect = getAllByRole("combobox")[0]; if (goToPageSelect) { - userEvent.click(goToPageSelect); + fireEvent.click(goToPageSelect); } const goToPageOption = getByText("2"); - userEvent.click(goToPageOption); + fireEvent.click(goToPageOption); expect(getByText("4 to 6 of 10")).toBeTruthy(); expect(getByText("Rick")).toBeTruthy(); expect(getByText("Mark")).toBeTruthy(); @@ -551,23 +550,17 @@ describe("Resultset table component tests", () => { }, ], ]; - const { getAllByRole, getByRole, getByText } = render( + const { getByRole, getByText, getByTitle } = render( ); - const dropdown = getAllByRole("button")[2]; - act(() => { - if (dropdown) { - userEvent.click(dropdown); - } - }); + const dropdown = getByTitle("icon1"); + fireEvent.click(dropdown); expect(getByRole("menu")).toBeTruthy(); const option = getByText("Aliexpress"); - userEvent.click(option); + fireEvent.click(option); expect(onSelectOption).toHaveBeenCalledWith("3"); - const action = getAllByRole("button")[1]; - if (action) { - userEvent.click(action); - } + const action = getByRole("button", { name: "icon2" }); + fireEvent.click(action); expect(onClick).toHaveBeenCalled(); }); diff --git a/packages/lib/src/table/Table.test.tsx b/packages/lib/src/table/Table.test.tsx index be1f1d1628..b5b46bcb51 100644 --- a/packages/lib/src/table/Table.test.tsx +++ b/packages/lib/src/table/Table.test.tsx @@ -1,5 +1,4 @@ -import { render } from "@testing-library/react"; -import userEvent from "@testing-library/user-event"; +import { fireEvent, render } from "@testing-library/react"; import DxcTable from "./Table"; global.ResizeObserver = jest.fn().mockImplementation(() => ({ @@ -108,14 +107,14 @@ describe("Table component tests", () => { if (!dropdown) { throw new Error("Expected the actions dropdown to be rendered"); } - await Promise.resolve(userEvent.click(dropdown)); + await Promise.resolve(fireEvent.click(dropdown)); expect(getByRole("menu")).toBeTruthy(); const option = getByText("Aliexpress"); - await Promise.resolve(userEvent.click(option)); + await Promise.resolve(fireEvent.click(option)); expect(onSelectOption).toHaveBeenCalledWith("3"); const action = getAllByRole("button")[0]; if (action) { - await Promise.resolve(userEvent.click(action)); + await Promise.resolve(fireEvent.click(action)); } expect(onClick).toHaveBeenCalled(); }); From e17ad61d0eb120a2ac44a6e416445b471bc9c65f Mon Sep 17 00:00:00 2001 From: PelayoFelgueroso Date: Mon, 28 Sep 2026 16:56:01 +0200 Subject: [PATCH 4/5] fix data grid tests --- packages/lib/src/data-grid/DataGrid.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/lib/src/data-grid/DataGrid.tsx b/packages/lib/src/data-grid/DataGrid.tsx index 12dbb94a99..7a4b966eca 100644 --- a/packages/lib/src/data-grid/DataGrid.tsx +++ b/packages/lib/src/data-grid/DataGrid.tsx @@ -1,5 +1,5 @@ import { useEffect, useMemo, useState } from "react"; -import DataGrid, { SortColumn } from "react-data-grid"; +import { DataGrid, SortColumn } from "react-data-grid"; import styled from "@emotion/styled"; import DataGridPropsType, { HierarchyGridRow, GridRow, ExpandableGridRow } from "./types"; import "react-data-grid/lib/styles.css"; From 2239adfe4a63d596b8ea96e7c783d17bca999fa2 Mon Sep 17 00:00:00 2001 From: PelayoFelgueroso Date: Tue, 29 Sep 2026 08:47:48 +0200 Subject: [PATCH 5/5] fix data-grid utils --- packages/lib/src/data-grid/utils.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/lib/src/data-grid/utils.tsx b/packages/lib/src/data-grid/utils.tsx index 69864da3b5..be9e1958b8 100644 --- a/packages/lib/src/data-grid/utils.tsx +++ b/packages/lib/src/data-grid/utils.tsx @@ -1,5 +1,5 @@ import { ReactNode, SetStateAction } from "react"; -import { Column, RenderSortStatusProps, SortColumn, textEditor } from "react-data-grid"; +import { Column, RenderSortStatusProps, SortColumn, renderTextEditor } from "react-data-grid"; import DxcActionIcon from "../action-icon/ActionIcon"; import DxcCheckbox from "../checkbox/Checkbox"; import DxcIcon from "../icon/Icon"; @@ -23,7 +23,7 @@ export const convertToRDGColumns = ( draggable: gridColumn.draggable, editable: gridColumn.textEditable, headerCellClass: gridColumn.alignment ? `header-align-${gridColumn.alignment}` : `header-align-left`, - renderEditCell: gridColumn.textEditable ? textEditor : undefined, + renderEditCell: gridColumn.textEditable ? renderTextEditor : undefined, renderCell: ({ row }) => (
{row[gridColumn.key]}