diff --git a/.babelrc.js b/.babelrc.js deleted file mode 100644 index 4e9ca959f..000000000 --- a/.babelrc.js +++ /dev/null @@ -1,37 +0,0 @@ -const pathAliases = require('./pathAliases'); - -module.exports = { - env: { - production: { - presets: ['next/babel'], - plugins: ['add-react-displayname'], - }, - development: { - presets: ['next/babel'], - plugins: ['istanbul'], - }, - test: { - presets: [ - [ - 'next/babel', - { - 'preset-env': { - modules: 'commonjs', - }, - }, - ], - '@babel/preset-typescript', - ], - }, - }, - plugins: [ - [ - 'module-resolver', - { - root: ['./'], - alias: pathAliases, - }, - ], - 'macros', - ], -}; diff --git a/.circleci/config.yml b/.circleci/config.yml index ab479dd86..066a7b053 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -65,10 +65,6 @@ jobs: - run: name: Run tests command: yarn test:ci - - persist_to_workspace: - root: << pipeline.parameters.workspace_root >> - paths: - - project/vitest-coverage lint: executor: default @@ -82,28 +78,6 @@ jobs: command: | yarn lint:ci - report_coverage: - executor: default - steps: - - checkout - - *attach_workspace - - *restore_cache - - *yarn_install - - run: - name: Merge reports into one file - command: | - mkdir reports - mkdir .nyc_output - ls -al cypress-coverage - cp cypress-coverage/coverage.node-*.json reports - cp vitest-coverage/coverage-final.json reports/from-vitest.json - yarn nyc merge reports - mv coverage.json .nyc_output/out.json - - run: - name: Convert finalized report from JSON to lcov - command: | - yarn nyc report --reporter lcov --report-dir coverage - workflows: default: jobs: @@ -116,36 +90,3 @@ workflows: - lint: requires: - install_dependencies - - - cypress/run: - name: integration_tests - requires: - - install_dependencies - executor: default - pre-steps: - - checkout - - *attach_workspace - - *restore_cache - - *yarn_install - attach-workspace: true - browser: 'chrome' # actually use Chrome (and not Electron) - record: true # record results on Cypress Dashboard - parallel: true # split all specs across machines - parallelism: 3 # use X number of CircleCI machines - command-prefix: yarn # dont use npx - group: 'all tests' # name this group "all tests" on the dashboard - start: 'yarn dev' # start server before running tests - wait-on: http://localhost:3000 # wait until server is ready - post-steps: - - run: - name: Get each parallelized node's coverage report - command: cp cypress-coverage/coverage-final.json "cypress-coverage/coverage.node-$CIRCLE_NODE_INDEX.json" - - persist_to_workspace: - root: << pipeline.parameters.workspace_root >> - paths: - - project/cypress-coverage - - - report_coverage: - requires: - - unit_tests - - integration_tests diff --git a/.eslintignore b/.eslintignore index fe1dc2fb0..754e83b29 100644 --- a/.eslintignore +++ b/.eslintignore @@ -1,8 +1,6 @@ node_modules package.json yarn.lock -.babelrc -**/.babelrc .next .github bin diff --git a/.eslintrc.js b/.eslintrc.js index f66f76726..6fe8c0731 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -4,9 +4,8 @@ module.exports = { extends: [ 'plugin:@typescript-eslint/eslint-recommended', - 'airbnb', + 'plugin:react/recommended', 'plugin:jsx-a11y/recommended', - 'plugin:cypress/recommended', 'plugin:storybook/recommended', 'plugin:prettier/recommended', 'prettier', @@ -15,22 +14,10 @@ module.exports = { browser: true, commonjs: true, es6: true, - 'cypress/globals': true, node: true, }, - parser: '@babel/eslint-parser', - plugins: [ - 'unicorn', - 'cypress', - '@operation_code/custom-rules', - 'import', - 'lodash', - '@typescript-eslint', - ], - globals: { - cy: true, - Cypress: true, - }, + parser: '@typescript-eslint/parser', + plugins: ['unicorn', '@operation_code/custom-rules', 'import', 'lodash', '@typescript-eslint'], rules: { // Import Rules 'import/extensions': [ @@ -247,7 +234,7 @@ module.exports = { { name: 'formik', importNames: ['Form'], - message: `Please use our Form component to have good defaults defined.\n "import Form from 'components/Form/Form';"`, + message: `Please use our Form component to have good defaults defined.\n "import { Form } from 'components/Form/Form';"`, }, { name: 'react', @@ -274,24 +261,31 @@ module.exports = { }, }, { - files: ['./**/*.test.ts', './**/*.test.tsx'], + files: ['./e2e/**/*.spec.ts'], + extends: 'plugin:playwright/recommended', rules: { - '@typescript-eslint/no-non-null-assertion': 'off', + 'func-names': 'off', + 'vitest/expect-expect': 'off', + 'vitest/valid-expect': 'off', + 'no-unused-expressions': ['off'], + 'playwright/expect-expect': [ + 'warn', + { + assertFunctionNames: ['expect', 'assertError', 'assertFailedLogin'], + }, + ], }, }, { - files: ['./pages/api/**/*.ts'], + files: ['./**/*.test.ts', './**/*.test.tsx'], rules: { - 'no-console': 'off', + '@typescript-eslint/no-non-null-assertion': 'off', }, }, { - files: ['cypress/**/*.js'], + files: ['./pages/api/**/*.ts'], rules: { - 'func-names': 'off', - 'vitest/expect-expect': 'off', - 'vitest/valid-expect': 'off', - 'no-unused-expressions': ['off'], + 'no-console': 'off', }, }, { diff --git a/.github/workflows/playwright.yml b/.github/workflows/playwright.yml new file mode 100644 index 000000000..06a50053a --- /dev/null +++ b/.github/workflows/playwright.yml @@ -0,0 +1,28 @@ +name: Playwright Tests +on: + push: + branches: [main, master] + pull_request: + branches: [main, master] +jobs: + test: + timeout-minutes: 60 + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v5 + - uses: actions/setup-node@v6 + with: + node-version-file: ".nvmrc" + cache: "yarn" + - name: Install dependencies + run: yarn install --frozen-lockfile + - name: Install Playwright Browsers + run: yarn playwright install --with-deps + - name: Run Playwright tests + run: yarn test:e2e:headless + - uses: actions/upload-artifact@v4 + if: always() + with: + name: playwright-report + path: playwright-report/ + retention-days: 30 diff --git a/.gitignore b/.gitignore index cabcf4ad8..054e0fead 100644 --- a/.gitignore +++ b/.gitignore @@ -28,9 +28,6 @@ cypress-coverage vitest-coverage reports -# nyc test coverage -.nyc_output - # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) .grunt @@ -86,3 +83,10 @@ out # Autogenerated static files public/sitemap.xml + +# Playwright +/test-results/ +/playwright-report/ +/blob-report/ +/playwright/.cache/ +/playwright/.auth/ diff --git a/components/Branding/ColorSection/ColorSection.tsx b/components/Branding/ColorSection/ColorSection.tsx index 3ec456fc9..7d57e9d8e 100644 --- a/components/Branding/ColorSection/ColorSection.tsx +++ b/components/Branding/ColorSection/ColorSection.tsx @@ -21,11 +21,11 @@ function ColorSection() { hasTitleUnderline theme="white" columns={[ -
+

Primary

, -
+

Secondary

, diff --git a/components/Branding/FontSection/FontSection.tsx b/components/Branding/FontSection/FontSection.tsx index 617a62286..f39e6fcce 100644 --- a/components/Branding/FontSection/FontSection.tsx +++ b/components/Branding/FontSection/FontSection.tsx @@ -11,7 +11,7 @@ function FontSection() { theme="gray" hasTitleUnderline columns={[ -