o problema acontece quando tento executar o script de teste e a especificação pré-existente do playwright está falhando. Atualizei alguns pacotes recentemente devido à migração de webpack
para rspack
, isso inclui jest@29
, eslint@9
.
O Playwright foi adicionado recentemente ao repositório pelo meu colega de trabalho e os testes estão funcionando bem do lado dele. Imagino que possa haver algum problema de dependência de pares internamente no playwright que seja uma causa, mas tenho batido a cabeça na parede o dia todo e não consigo descobrir qual é o culpado.
Log de erros completo:
TypeError: ys.deprecate is not a function
> 1 | import { test, expect } from '@playwright/test';
| ^
2 | import { login } from './utils/helpers';
3 |
4 | test.describe('Login happy paths', () => {
at node_modules/playwright-core/lib/utilsBundleImpl/index.js:2:9075
at node_modules/playwright-core/lib/utilsBundleImpl/index.js:1:324
at node_modules/playwright-core/lib/utilsBundleImpl/index.js:6:268
at node_modules/playwright-core/lib/utilsBundleImpl/index.js:1:324
at Object.<anonymous> (node_modules/playwright-core/lib/utilsBundleImpl/index.js:182:14404)
at Object.<anonymous> (node_modules/playwright-core/lib/utilsBundle.js:30:33)
at Object.<anonymous> (node_modules/playwright-core/lib/server/registry/index.js:22:20)
at Object.<anonymous> (node_modules/playwright-core/lib/server/index.js:102:17)
at Object.<anonymous> (node_modules/playwright-core/lib/inProcessFactory.js:7:15)
at Object.<anonymous> (node_modules/playwright-core/lib/inprocess.js:3:25)
at Object.<anonymous> (node_modules/playwright-core/index.js:33:18)
at Object.<anonymous> (node_modules/playwright/lib/index.js:34:49)
at Object.<anonymous> (node_modules/playwright/test.js:17:13)
at Object.<anonymous> (node_modules/@playwright/test/index.js:17:18)
at Object.require (tests/auth.spec.ts:1:1)
Também erro secundário que ocorre jest
após a atualização:
Test suite failed to run
TypeError: Cannot read properties of undefined (reading 'isNativeError')
at failureDetailsToErrorOrStack (node_modules/jest-message-util/build/index.js:426:17)
at Array.map (<anonymous>)
não há nenhuma outra saída deste teste em particular e o arquivo não faz referência a isNativeError
lugar nenhum. Isso deve ser algo interno do jest.
Tentei fazer o downgrade para 28 e 27, mas sem sucesso.
EDITAR:
auth.spec.ts
import { test, expect } from '@playwright/test';
test.describe('Login happy paths', () => {
test('has title', async ({ page }) => {
await page.goto('/');
await expect(page.getByRole('heading', { name: 'Login' })).toBeVisible();
});
});
package.json
{
"name": "<PROJECT_NAME",
"version": "2.3.0",
"description": "",
"main": "index.js",
"scripts": {
"build-dev": "webpack --config config/webpack/webpack.dev.js --progress",
"build-local": "webpack --config config/webpack/webpack.local.js --progress",
"build-uat": "webpack --config config/webpack/webpack.uat.js --progress",
"build-prod": "webpack --config config/webpack/webpack.prod.js --progress",
"start": "webpack serve --hot --config config/webpack/webpack.local.js --open",
"rspstart": "rspack serve --hot --config config/rspack/rspack.local.js",
"eslint": "eslint \"src/**/*.{js,ts,tsx}\"",
"eslint:fix": "eslint \"src/**/*.{js,ts,tsx}\" --fix",
"test": "cross-env TZ=UTC jest",
"test:watch": "cross-env TZ=UTC jest --watchAll",
"test:coverage": "cross-env TZ=UTC jest --coverage",
"test:debug": "cross-env TZ=UTC jest --detectOpenHandles",
"storybook": "storybook dev -p 6006",
"build-storybook": "storybook build",
"typecheck": "tsc",
"playwright": "npx playwright test",
"playwright:ui": "npx playwright test --ui port 0",
"playwright:report": "npx playwright show-report"
},
"author": "",
"license": "",
"engines": {
"node": ">=14",
"npm": ">=7"
},
"overrides": {
"@jest/create-cache-key-function": "<=27.5.1",
"react-native": "^0.70.6"
},
"dependencies": {
"@floating-ui/react": "^0.27.2",
"@playwright/test": "^1.49.1",
"@reduxjs/toolkit": "^1.9.7",
"@types/highcharts": "^7.0.0",
"aws-amplify": "^6.11.0",
"axios": "^1.7.9",
"classnames": "^2.5.1",
"date-fns": "2.23.0",
"file-saver": "2.0.5",
"git-rev-sync": "^3.0.2",
"highcharts": "^11.2.0",
"highcharts-react-official": "^3.2.1",
"ip": "1.1.5",
"lodash": "^4.17.21",
"lodash.debounce": "^4.0.8",
"polished": "^4.3.1",
"react": "17.0.2",
"react-beautiful-dnd": "^13.1.1",
"react-color": "2.19.3",
"react-dom": "17.0.2",
"react-hook-form": "^7.54.2",
"react-icons": "^4.10.1",
"react-loading-skeleton": "^3.5.0",
"react-markdown": "^8.0.7",
"react-quill": "^2.0.0",
"react-redux": "7.2.5",
"react-rnd": "^10.4.14",
"react-router-dom": "5.3.0",
"react-select": "^5.9.0",
"react-switch": "^7.1.0",
"react-tooltip": "4.2.21",
"react-transition-group": "^4.4.5",
"react-virtualized-auto-sizer": "^1.0.25",
"react-window": "^1.8.11",
"react-window-infinite-loader": "^1.0.9",
"redux": "4.1.1",
"redux-thunk": "2.3.0",
"styled-components": "5.3.1",
"styled-theming": "2.2.0",
"typescript": "^5.7.2",
"uuid": "8.3.2",
"webfontloader": "^1.6.28"
},
"devDependencies": {
"@babel/core": "^7.23.7",
"@babel/eslint-parser": "7.15.4",
"@babel/node": "7.15.4",
"@babel/plugin-proposal-nullish-coalescing-operator": "7.14.5",
"@babel/plugin-proposal-optional-chaining": "7.14.5",
"@babel/plugin-syntax-dynamic-import": "7.8.3",
"@babel/plugin-transform-runtime": "7.15.0",
"@babel/preset-env": "7.15.4",
"@babel/preset-react": "7.14.5",
"@babel/preset-typescript": "^7.16.0",
"@babel/runtime": "^7.3.1",
"@rspack/cli": "^1.1.8",
"@rspack/core": "^1.1.8",
"@rspack/plugin-react-refresh": "^1.0.1",
"@storybook/addon-actions": "^7.6.20",
"@storybook/addon-essentials": "^7.6.20",
"@storybook/addon-links": "^7.6.20",
"@storybook/react": "^7.6.20",
"@storybook/react-webpack5": "^7.6.20",
"@svgr/webpack": "^8.1.0",
"@swc/core": "^1.10.4",
"@swc/plugin-styled-components": "^5.0.2",
"@testing-library/jest-dom": "^6.6.3",
"@testing-library/react": "12.0.0",
"@testing-library/user-event": "^13.5.0",
"@types/file-saver": "^2.0.7",
"@types/fork-ts-checker-webpack-plugin": "^0.4.5",
"@types/jest": "^29.5.14",
"@types/lodash.debounce": "^4.0.9",
"@types/node": "^16.18.122",
"@types/react": "^17.0.83",
"@types/react-beautiful-dnd": "^13.1.8",
"@types/react-color": "^3.0.13",
"@types/react-dom": "^18.0.3",
"@types/react-router-dom": "^5.3.3",
"@types/react-select": "^5.0.1",
"@types/react-transition-group": "^4.4.12",
"@types/react-virtualized-auto-sizer": "^1.0.4",
"@types/react-window": "^1.8.8",
"@types/react-window-infinite-loader": "^1.0.9",
"@types/redux-mock-store": "^1.5.0",
"@types/styled-components": "^5.1.25",
"@types/styled-theming": "^2.2.8",
"@types/uuid": "^9.0.8",
"@types/webfontloader": "^1.6.38",
"@types/webpack": "^4.41.31",
"@types/webpack-dev-server": "^4.7.2",
"@typescript-eslint/eslint-plugin": "^8.19.0",
"@typescript-eslint/parser": "^8.19.0",
"@webpack-cli/serve": "1.5.2",
"as-a": "^2.2.7",
"autoprefixer": "10.3.4",
"babel-jest": "27.1.0",
"babel-loader": "8.2.2",
"babel-plugin-istanbul": "6.0.0",
"babel-plugin-styled-components": "1.13.2",
"clean-webpack-plugin": "4.0.0",
"copy-webpack-plugin": "9.0.1",
"cross-env": "^7.0.3",
"css-loader": "6.2.0",
"css-minimizer-webpack-plugin": "3.0.2",
"dotenv-webpack": "^7.0.3",
"eslint": "9.17",
"eslint-config-prettier": "^9.1.0",
"eslint-plugin-jest": "28.9",
"eslint-plugin-react": "^7.37.3",
"eslint-plugin-react-hooks": "^5.1.0",
"eslint-plugin-storybook": "^0.11.2",
"eslint-rspack-plugin": "^4.2.1",
"eslint-webpack-plugin": "^4.2.0",
"file-loader": "6.2.0",
"fork-ts-checker-webpack-plugin": "^9.0.2",
"globals": "^15.14.0",
"html-webpack-plugin": "5.3.2",
"jest": "^29.7.0",
"jest-environment-jsdom": "^29.7.0",
"jest-styled-components": "7.0.5",
"jsdom": "^25.0.1",
"mini-css-extract-plugin": "2.2.2",
"nyc": "15.1.0",
"postcss": "^8.4.49",
"postcss-loader": "^8.1.1",
"postcss-preset-env": "^10.1.2",
"prettier": "2.3.2",
"react-select-event": "^5.5.1",
"react-test-renderer": "17.0.2",
"redux-devtools-extension": "2.13.9",
"redux-mock-store": "^1.5.5",
"storybook": "^7.6.8",
"style-loader": "3.2.1",
"terser-webpack-plugin": "5.2.3",
"ts-checker-rspack-plugin": "^1.1.0",
"ts-loader": "^9.5.1",
"ts-node": "^10.9.2",
"url-loader": "4.1.1",
"webpack": "^5.52.0",
"webpack-cli": "^4.7.2",
"webpack-dev-server": "^3.11.2",
"webpack-merge": "5.8.0"
}
}
A execução rspstart
funciona bem. Apenas o test
or test:watch
falha no E2E - somente após a migração.
Ao atualizar pacotes, alguns tiveram problemas de dependência de pares, mas estes estavam puramente relacionados a webpack
- eslint
eu executo alguns deles com --legacy-peer-deps
o sinalizador para poder desinstalar plugins webpack redundantes.
Além disso, reconstruir package-lock.json
com uma instalação limpa quebra muito mais coisas. Talvez essas coisas devam ser resolvidas primeiro?