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 [ +[