diff --git a/.eslintrc.js b/.eslintrc.js
index 97bb37878..cf67b0050 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -14,7 +14,7 @@ module.exports = {
sourceType: "module",
},
rules: {
- "prettier/prettier": "error",
+ "prettier/prettier": ["error", { trailingComma: "es5" }],
"react/forbid-component-props": [
"error",
{
@@ -73,7 +73,7 @@ module.exports = {
rules: {
"testing-library/no-node-access": "warn",
"testing-library/no-container": "warn",
- "testing-library/no-render-in-setup": "warn",
+ "testing-library/no-render-in-lifecycle": "warn",
},
},
],
diff --git a/.github/workflows/test.yaml b/.github/workflows/test.yaml
index d899698d4..2c53433ff 100644
--- a/.github/workflows/test.yaml
+++ b/.github/workflows/test.yaml
@@ -16,7 +16,7 @@ jobs:
- name: Use Node.js
uses: actions/setup-node@v3
with:
- node-version: 16
+ node-version: "lts/*"
- name: Install dependencies
run: yarn install
diff --git a/.stylelintrc.json b/.stylelintrc.json
index 3151408ca..1f85f3be4 100644
--- a/.stylelintrc.json
+++ b/.stylelintrc.json
@@ -21,7 +21,7 @@
"scss/at-rule-no-unknown": true,
"scss/at-extend-no-missing-placeholder": true,
- "scss/at-import-no-partial-leading-underscore": true,
+ "scss/load-no-partial-leading-underscore": true,
"scss/at-import-partial-extension": "never",
"order/properties-alphabetical-order": true,
diff --git a/package.json b/package.json
index 2208debe0..cdfe4306b 100644
--- a/package.json
+++ b/package.json
@@ -26,7 +26,7 @@
"@babel/eslint-parser": "7.23.3",
"@babel/preset-typescript": "7.23.3",
"@percy/cli": "1.27.6",
- "@percy/storybook": "4.3.7",
+ "@percy/storybook": "5.0.1",
"@storybook/addon-a11y": "7.6.7",
"@storybook/addon-essentials": "7.6.7",
"@storybook/addon-interactions": "7.6.7",
@@ -36,63 +36,64 @@
"@storybook/blocks": "7.6.7",
"@storybook/react": "7.6.7",
"@storybook/react-webpack5": "7.6.7",
- "@testing-library/cypress": "9.0.0",
+ "@testing-library/cypress": "10.0.1",
"@testing-library/dom": "9.3.3",
- "@testing-library/jest-dom": "5.17.0",
+ "@testing-library/jest-dom": "6.2.1",
"@testing-library/react": "14.1.2",
"@testing-library/user-event": "14.5.2",
- "@typescript-eslint/eslint-plugin": "5.62.0",
- "@typescript-eslint/parser": "5.62.0",
- "babel-jest": "27.5.1",
+ "@typescript-eslint/eslint-plugin": "6.19.1",
+ "@typescript-eslint/parser": "6.19.1",
+ "babel-jest": "29.7.0",
"babel-loader": "9.1.3",
"babel-plugin-module-resolver": "5.0.0",
"babel-plugin-typescript-to-proptypes": "2.1.0",
"concurrently": "8.2.2",
"css-loader": "6.8.1",
- "cypress": "12.17.4",
+ "cypress": "13.6.3",
"deepmerge": "4.3.1",
"eslint": "8.56.0",
- "eslint-config-prettier": "8.10.0",
+ "eslint-config-prettier": "9.1.0",
"eslint-config-react-app": "7.0.1",
"eslint-plugin-cypress": "2.15.1",
"eslint-plugin-flowtype": "8.0.3",
"eslint-plugin-import": "2.29.1",
"eslint-plugin-jsx-a11y": "6.8.0",
- "eslint-plugin-prettier": "4.2.1",
+ "eslint-plugin-prettier": "5.1.3",
"eslint-plugin-react": "7.33.2",
"eslint-plugin-react-hooks": "4.6.0",
"eslint-plugin-storybook": "0.6.15",
- "eslint-plugin-testing-library": "5.11.1",
- "jest": "27.5.1",
- "npm-package-json-lint": "5.4.2",
- "prettier": "2.8.8",
+ "eslint-plugin-testing-library": "6.2.0",
+ "jest": "29.7.0",
+ "npm-package-json-lint": "7.1.0",
+ "prettier": "3.2.4",
"react": "18.2.0",
"react-docgen-typescript-loader": "3.7.2",
"react-dom": "18.2.0",
"sass": "1.69.7",
- "sass-loader": "10.5.1",
+ "sass-loader": "14.0.0",
"storybook": "7.6.7",
"style-loader": "3.3.3",
- "stylelint": "15.11.0",
+ "stylelint": "16.2.0",
"stylelint-config-prettier": "9.0.5",
- "stylelint-config-recommended-scss": "5.0.2",
- "stylelint-order": "5.0.0",
- "stylelint-prettier": "2.0.0",
- "ts-jest": "27.1.5",
+ "stylelint-config-recommended-scss": "14.0.0",
+ "stylelint-order": "6.0.4",
+ "stylelint-prettier": "5.0.0",
+ "ts-jest": "29.1.2",
"tsc-alias": "1.8.8",
- "typescript": "4.9.5",
+ "typescript": "5.3.3",
"vanilla-framework": "4.6.0",
- "wait-on": "5.3.0",
+ "wait-on": "7.2.0",
"webpack": "5.89.0"
},
"dependencies": {
- "@types/jest": "27.5.2",
+ "@types/jest": "29.5.11",
"@types/node": "18.19.4",
"@types/react": "18.2.46",
"@types/react-dom": "18.2.18",
"@types/react-table": "7.7.19",
"classnames": "2.5.1",
- "nanoid": "3.3.7",
+ "jest-environment-jsdom": "29.7.0",
+ "nanoid": "5.0.4",
"prop-types": "15.8.1",
"react-table": "7.8.0",
"react-useportal": "1.0.19"
diff --git a/src/components/ActionButton/ActionButton.test.tsx b/src/components/ActionButton/ActionButton.test.tsx
index 3f4018057..d4748d474 100644
--- a/src/components/ActionButton/ActionButton.test.tsx
+++ b/src/components/ActionButton/ActionButton.test.tsx
@@ -9,7 +9,7 @@ import ActionButton, {
import { act } from "react-dom/test-utils";
describe("ActionButton", () => {
- jest.useFakeTimers("modern");
+ jest.useFakeTimers();
it("matches loading snapshot", () => {
render(Click me);
diff --git a/src/components/ContextualMenu/ContextualMenuDropdown/ContextualMenuDropdown.test.tsx b/src/components/ContextualMenu/ContextualMenuDropdown/ContextualMenuDropdown.test.tsx
index 101cc7b5a..837b61c9f 100644
--- a/src/components/ContextualMenu/ContextualMenuDropdown/ContextualMenuDropdown.test.tsx
+++ b/src/components/ContextualMenu/ContextualMenuDropdown/ContextualMenuDropdown.test.tsx
@@ -6,7 +6,7 @@ import ContextualMenuDropdown, {
adjustForWindow,
} from "./ContextualMenuDropdown";
-jest.useFakeTimers("modern");
+jest.useFakeTimers();
describe("ContextualMenuDropdown ", () => {
it("renders", () => {
diff --git a/src/components/Notification/Notification.test.tsx b/src/components/Notification/Notification.test.tsx
index a06f32997..424c84450 100644
--- a/src/components/Notification/Notification.test.tsx
+++ b/src/components/Notification/Notification.test.tsx
@@ -6,7 +6,7 @@ import userEvent from "@testing-library/user-event";
describe("Notification", () => {
beforeEach(() => {
- jest.useFakeTimers("modern");
+ jest.useFakeTimers();
});
it("renders", () => {
diff --git a/src/components/TablePagination/TablePagination.test.tsx b/src/components/TablePagination/TablePagination.test.tsx
index 6093dbee1..225b5faf7 100644
--- a/src/components/TablePagination/TablePagination.test.tsx
+++ b/src/components/TablePagination/TablePagination.test.tsx
@@ -37,22 +37,22 @@ describe("", () => {
);
});
- it("has correct per page setting when changed", () => {
+ it("has correct per page setting when changed", async () => {
render();
expect(screen.getByRole("navigation")).toHaveTextContent("2/page");
- userEvent.selectOptions(
+ await userEvent.selectOptions(
screen.getByRole("combobox", { name: "Items per page" }),
"5"
);
expect(screen.getByRole("navigation")).toHaveTextContent("5/page");
});
- it("resets to first page when page size is changed", () => {
+ it("resets to first page when page size is changed", async () => {
render();
expect(screen.getByRole("navigation")).toHaveTextContent("2/page");
- userEvent.selectOptions(
+ await userEvent.selectOptions(
screen.getByRole("combobox", { name: "Items per page" }),
"5"
);
@@ -80,7 +80,7 @@ describe("", () => {
expect(currentPageInput).toHaveValue(2);
await userEvent.selectOptions(pageSizeSelector, "2");
expect(currentPageInput).toHaveValue(1);
- await fireEvent.change(currentPageInput, { target: { value: 3 } });
+ fireEvent.change(currentPageInput, { target: { value: 3 } });
expect(currentPageInput).toHaveValue(3);
await userEvent.click(incButton);
expect(currentPageInput).toHaveValue(3);
diff --git a/src/components/TablePagination/TablePaginationControls/__snapshots__/TablePaginationControls.test.tsx.snap b/src/components/TablePagination/TablePaginationControls/__snapshots__/TablePaginationControls.test.tsx.snap
index 3fc41511a..eb5609f2a 100644
--- a/src/components/TablePagination/TablePaginationControls/__snapshots__/TablePaginationControls.test.tsx.snap
+++ b/src/components/TablePagination/TablePaginationControls/__snapshots__/TablePaginationControls.test.tsx.snap
@@ -1,7 +1,7 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[` renders table pagination controls and matches the snapshot 1`] = `
-Array [
+[