diff --git a/.eslintignore b/.eslintignore index c0ba36077a..da2559f566 100644 --- a/.eslintignore +++ b/.eslintignore @@ -15,3 +15,4 @@ output/ test-results/ tests-components/ examples/ +DEPS \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index f582edba3b..366b58b577 100644 --- a/package-lock.json +++ b/package-lock.json @@ -40,6 +40,7 @@ "@types/yazl": "^2.4.2", "@typescript-eslint/eslint-plugin": "^5.10.2", "@typescript-eslint/parser": "^5.10.2", + "@vitejs/plugin-react": "^1.0.7", "@zip.js/zip.js": "^2.4.2", "ansi-to-html": "^0.7.2", "babel-loader": "^8.2.3", @@ -67,6 +68,7 @@ "socksv5": "0.0.6", "style-loader": "^3.3.1", "typescript": "^4.5.5", + "vite": "^2.8.0", "webpack": "^5.68.0", "webpack-cli": "^4.9.2", "xml2js": "^0.4.23", @@ -777,6 +779,36 @@ "@babel/core": "^7.0.0-0" } }, + "node_modules/@babel/plugin-transform-react-jsx-self": { + "version": "7.16.7", + "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-self/-/plugin-transform-react-jsx-self-7.16.7.tgz", + "integrity": "sha512-oe5VuWs7J9ilH3BCCApGoYjHoSO48vkjX2CbA5bFVhIuO2HKxA3vyF7rleA4o6/4rTDbk6r8hBW7Ul8E+UZrpA==", + "dev": true, + "dependencies": { + "@babel/helper-plugin-utils": "^7.16.7" + }, + "engines": { + "node": ">=6.9.0" + }, + "peerDependencies": { + "@babel/core": "^7.0.0-0" + } + }, + "node_modules/@babel/plugin-transform-react-jsx-source": { + "version": "7.16.7", + "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-source/-/plugin-transform-react-jsx-source-7.16.7.tgz", + "integrity": "sha512-rONFiQz9vgbsnaMtQlZCjIRwhJvlrPET8TabIUK2hzlXw9B9s2Ieaxte1SCOOXMbWRHodbKixNf3BLcWVOQ8Bw==", + "dev": true, + "dependencies": { + "@babel/helper-plugin-utils": "^7.16.7" + }, + "engines": { + "node": ">=6.9.0" + }, + "peerDependencies": { + "@babel/core": "^7.0.0-0" + } + }, "node_modules/@babel/plugin-transform-react-pure-annotations": { "version": "7.16.7", "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-pure-annotations/-/plugin-transform-react-pure-annotations-7.16.7.tgz", @@ -1134,6 +1166,19 @@ "resolved": "packages/playwright-test", "link": true }, + "node_modules/@rollup/pluginutils": { + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-4.2.0.tgz", + "integrity": "sha512-2WUyJNRkyH5p487pGnn4tWAsxhEFKN/pT8CMgHshd5H+IXkOnKvKZwsz5ZWz+YCXkleZRAU5kwbfgF8CPfDRqA==", + "dev": true, + "dependencies": { + "estree-walker": "^2.0.1", + "picomatch": "^2.2.2" + }, + "engines": { + "node": ">= 8.0.0" + } + }, "node_modules/@sindresorhus/is": { "version": "0.14.0", "resolved": "https://registry.npmjs.org/@sindresorhus/is/-/is-0.14.0.tgz", @@ -1723,6 +1768,25 @@ "url": "https://opencollective.com/typescript-eslint" } }, + "node_modules/@vitejs/plugin-react": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-1.2.0.tgz", + "integrity": "sha512-Rywwt0IXXg6yQ0hv3cMT3mtdDcGIw31mGaa+MMMAT651LhoXLF2yFy4LrakiTs7UKs7RPBo9eNgaS8pgl2A6Qw==", + "dev": true, + "dependencies": { + "@babel/core": "^7.16.12", + "@babel/plugin-transform-react-jsx": "^7.16.7", + "@babel/plugin-transform-react-jsx-development": "^7.16.7", + "@babel/plugin-transform-react-jsx-self": "^7.16.7", + "@babel/plugin-transform-react-jsx-source": "^7.16.7", + "@rollup/pluginutils": "^4.1.2", + "react-refresh": "^0.11.0", + "resolve": "^1.22.0" + }, + "engines": { + "node": ">=12.0.0" + } + }, "node_modules/@webassemblyjs/ast": { "version": "1.11.1", "resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.11.1.tgz", @@ -2176,11 +2240,6 @@ "url": "https://opencollective.com/browserslist" } }, - "node_modules/browserslist/node_modules/picocolors": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz", - "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==" - }, "node_modules/buffer-crc32": { "version": "0.2.13", "resolved": "https://registry.npmjs.org/buffer-crc32/-/buffer-crc32-0.2.13.tgz", @@ -3201,6 +3260,361 @@ "dev": true, "optional": true }, + "node_modules/esbuild": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.14.27.tgz", + "integrity": "sha512-MZQt5SywZS3hA9fXnMhR22dv0oPGh6QtjJRIYbgL1AeqAoQZE+Qn5ppGYQAoHv/vq827flj4tIJ79Mrdiwk46Q==", + "dev": true, + "hasInstallScript": true, + "bin": { + "esbuild": "bin/esbuild" + }, + "engines": { + "node": ">=12" + }, + "optionalDependencies": { + "esbuild-android-64": "0.14.27", + "esbuild-android-arm64": "0.14.27", + "esbuild-darwin-64": "0.14.27", + "esbuild-darwin-arm64": "0.14.27", + "esbuild-freebsd-64": "0.14.27", + "esbuild-freebsd-arm64": "0.14.27", + "esbuild-linux-32": "0.14.27", + "esbuild-linux-64": "0.14.27", + "esbuild-linux-arm": "0.14.27", + "esbuild-linux-arm64": "0.14.27", + "esbuild-linux-mips64le": "0.14.27", + "esbuild-linux-ppc64le": "0.14.27", + "esbuild-linux-riscv64": "0.14.27", + "esbuild-linux-s390x": "0.14.27", + "esbuild-netbsd-64": "0.14.27", + "esbuild-openbsd-64": "0.14.27", + "esbuild-sunos-64": "0.14.27", + "esbuild-windows-32": "0.14.27", + "esbuild-windows-64": "0.14.27", + "esbuild-windows-arm64": "0.14.27" + } + }, + "node_modules/esbuild-android-64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-android-64/-/esbuild-android-64-0.14.27.tgz", + "integrity": "sha512-LuEd4uPuj/16Y8j6kqy3Z2E9vNY9logfq8Tq+oTE2PZVuNs3M1kj5Qd4O95ee66yDGb3isaOCV7sOLDwtMfGaQ==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "android" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/esbuild-android-arm64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-android-arm64/-/esbuild-android-arm64-0.14.27.tgz", + "integrity": "sha512-E8Ktwwa6vX8q7QeJmg8yepBYXaee50OdQS3BFtEHKrzbV45H4foMOeEE7uqdjGQZFBap5VAqo7pvjlyA92wznQ==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "android" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/esbuild-darwin-64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-darwin-64/-/esbuild-darwin-64-0.14.27.tgz", + "integrity": "sha512-czw/kXl/1ZdenPWfw9jDc5iuIYxqUxgQ/Q+hRd4/3udyGGVI31r29LCViN2bAJgGvQkqyLGVcG03PJPEXQ5i2g==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/esbuild-darwin-arm64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-darwin-arm64/-/esbuild-darwin-arm64-0.14.27.tgz", + "integrity": "sha512-BEsv2U2U4o672oV8+xpXNxN9bgqRCtddQC6WBh4YhXKDcSZcdNh7+6nS+DM2vu7qWIWNA4JbRG24LUUYXysimQ==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/esbuild-freebsd-64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-freebsd-64/-/esbuild-freebsd-64-0.14.27.tgz", + "integrity": "sha512-7FeiFPGBo+ga+kOkDxtPmdPZdayrSzsV9pmfHxcyLKxu+3oTcajeZlOO1y9HW+t5aFZPiv7czOHM4KNd0tNwCA==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "freebsd" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/esbuild-freebsd-arm64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-freebsd-arm64/-/esbuild-freebsd-arm64-0.14.27.tgz", + "integrity": "sha512-8CK3++foRZJluOWXpllG5zwAVlxtv36NpHfsbWS7TYlD8S+QruXltKlXToc/5ZNzBK++l6rvRKELu/puCLc7jA==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "freebsd" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/esbuild-linux-32": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-linux-32/-/esbuild-linux-32-0.14.27.tgz", + "integrity": "sha512-qhNYIcT+EsYSBClZ5QhLzFzV5iVsP1YsITqblSaztr3+ZJUI+GoK8aXHyzKd7/CKKuK93cxEMJPpfi1dfsOfdw==", + "cpu": [ + "ia32" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/esbuild-linux-64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-linux-64/-/esbuild-linux-64-0.14.27.tgz", + "integrity": "sha512-ESjck9+EsHoTaKWlFKJpPZRN26uiav5gkI16RuI8WBxUdLrrAlYuYSndxxKgEn1csd968BX/8yQZATYf/9+/qg==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/esbuild-linux-arm": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-linux-arm/-/esbuild-linux-arm-0.14.27.tgz", + "integrity": "sha512-JnnmgUBdqLQO9hoNZQqNHFWlNpSX82vzB3rYuCJMhtkuaWQEmQz6Lec1UIxJdC38ifEghNTBsF9bbe8dFilnCw==", + "cpu": [ + "arm" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/esbuild-linux-arm64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-linux-arm64/-/esbuild-linux-arm64-0.14.27.tgz", + "integrity": "sha512-no6Mi17eV2tHlJnqBHRLekpZ2/VYx+NfGxKcBE/2xOMYwctsanCaXxw4zapvNrGE9X38vefVXLz6YCF8b1EHiQ==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/esbuild-linux-mips64le": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-linux-mips64le/-/esbuild-linux-mips64le-0.14.27.tgz", + "integrity": "sha512-NolWP2uOvIJpbwpsDbwfeExZOY1bZNlWE/kVfkzLMsSgqeVcl5YMen/cedRe9mKnpfLli+i0uSp7N+fkKNU27A==", + "cpu": [ + "mips64el" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/esbuild-linux-ppc64le": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-linux-ppc64le/-/esbuild-linux-ppc64le-0.14.27.tgz", + "integrity": "sha512-/7dTjDvXMdRKmsSxKXeWyonuGgblnYDn0MI1xDC7J1VQXny8k1qgNp6VmrlsawwnsymSUUiThhkJsI+rx0taNA==", + "cpu": [ + "ppc64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/esbuild-linux-riscv64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-linux-riscv64/-/esbuild-linux-riscv64-0.14.27.tgz", + "integrity": "sha512-D+aFiUzOJG13RhrSmZgrcFaF4UUHpqj7XSKrIiCXIj1dkIkFqdrmqMSOtSs78dOtObWiOrFCDDzB24UyeEiNGg==", + "cpu": [ + "riscv64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/esbuild-linux-s390x": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-linux-s390x/-/esbuild-linux-s390x-0.14.27.tgz", + "integrity": "sha512-CD/D4tj0U4UQjELkdNlZhQ8nDHU5rBn6NGp47Hiz0Y7/akAY5i0oGadhEIg0WCY/HYVXFb3CsSPPwaKcTOW3bg==", + "cpu": [ + "s390x" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/esbuild-netbsd-64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-netbsd-64/-/esbuild-netbsd-64-0.14.27.tgz", + "integrity": "sha512-h3mAld69SrO1VoaMpYl3a5FNdGRE/Nqc+E8VtHOag4tyBwhCQXxtvDDOAKOUQexBGca0IuR6UayQ4ntSX5ij1Q==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "netbsd" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/esbuild-openbsd-64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-openbsd-64/-/esbuild-openbsd-64-0.14.27.tgz", + "integrity": "sha512-xwSje6qIZaDHXWoPpIgvL+7fC6WeubHHv18tusLYMwL+Z6bEa4Pbfs5IWDtQdHkArtfxEkIZz77944z8MgDxGw==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "openbsd" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/esbuild-sunos-64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-sunos-64/-/esbuild-sunos-64-0.14.27.tgz", + "integrity": "sha512-/nBVpWIDjYiyMhuqIqbXXsxBc58cBVH9uztAOIfWShStxq9BNBik92oPQPJ57nzWXRNKQUEFWr4Q98utDWz7jg==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "sunos" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/esbuild-windows-32": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-windows-32/-/esbuild-windows-32-0.14.27.tgz", + "integrity": "sha512-Q9/zEjhZJ4trtWhFWIZvS/7RUzzi8rvkoaS9oiizkHTTKd8UxFwn/Mm2OywsAfYymgUYm8+y2b+BKTNEFxUekw==", + "cpu": [ + "ia32" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/esbuild-windows-64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-windows-64/-/esbuild-windows-64-0.14.27.tgz", + "integrity": "sha512-b3y3vTSl5aEhWHK66ngtiS/c6byLf6y/ZBvODH1YkBM+MGtVL6jN38FdHUsZasCz9gFwYs/lJMVY9u7GL6wfYg==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/esbuild-windows-arm64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-windows-arm64/-/esbuild-windows-arm64-0.14.27.tgz", + "integrity": "sha512-I/reTxr6TFMcR5qbIkwRGvldMIaiBu2+MP0LlD7sOlNXrfqIl9uNjsuxFPGEG4IRomjfQ5q8WT+xlF/ySVkqKg==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">=12" + } + }, "node_modules/escalade": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.1.tgz", @@ -3561,6 +3975,12 @@ "node": ">=4.0" } }, + "node_modules/estree-walker": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz", + "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==", + "dev": true + }, "node_modules/esutils": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz", @@ -3902,6 +4322,20 @@ "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz", "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=" }, + "node_modules/fsevents": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", + "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", + "dev": true, + "hasInstallScript": true, + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": "^8.16.0 || ^10.6.0 || >=11.0.0" + } + }, "node_modules/function-bind": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz", @@ -4398,9 +4832,9 @@ "dev": true }, "node_modules/is-core-module": { - "version": "2.6.0", - "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.6.0.tgz", - "integrity": "sha512-wShG8vs60jKfPWpF2KZRaAtvt3a20OAn7+IJ6hLPECpSABLcKtFKTTI4ZtH5QcBruBHlq+WsdHWyz0BCZW7svQ==", + "version": "2.8.1", + "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.8.1.tgz", + "integrity": "sha512-SdNCUs284hr40hFTFP6l0IfZ/RSrMXF3qgoRHd3/79unUTvrFO/JoXwkGm+5J/Oe3E/b5GsnG330uUNgRpu1PA==", "dev": true, "dependencies": { "has": "^1.0.3" @@ -5216,9 +5650,9 @@ "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==" }, "node_modules/nanoid": { - "version": "3.2.0", - "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.2.0.tgz", - "integrity": "sha512-fmsZYa9lpn69Ad5eDn7FMcnnSR+8R34W9qJEijxYhTbfOWzr22n1QxCMzXLK+ODyW2973V3Fux959iQoUxzUIA==", + "version": "3.3.1", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.1.tgz", + "integrity": "sha512-n6Vs/3KGyxPQd6uO0eH4Bv0ojGSUvuLlIHtC3Y0kEO23YRge8H9x1GCzLn28YX0H66pMkxuaeESFq4tKISKwdw==", "dev": true, "bin": { "nanoid": "bin/nanoid.cjs" @@ -5621,10 +6055,9 @@ "integrity": "sha1-elfrVQpng/kRUzH89GY9XI4AelA=" }, "node_modules/picocolors": { - "version": "0.2.1", - "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-0.2.1.tgz", - "integrity": "sha512-cMlDqaLEqfSaW8Z7N5Jw+lyIW869EzT73/F5lhtY9cLGoVxSXznfgfXMO0Z5K0o0Q2TkTXq+0KFsdnSe3jDViA==", - "dev": true + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz", + "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==" }, "node_modules/picomatch": { "version": "2.2.3", @@ -5706,21 +6139,27 @@ } }, "node_modules/postcss": { - "version": "8.3.9", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.9.tgz", - "integrity": "sha512-f/ZFyAKh9Dnqytx5X62jgjhhzttjZS7hMsohcI7HEI5tjELX/HxCy3EFhsRxyzGvrzFF+82XPvCS8T9TFleVJw==", + "version": "8.4.12", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.12.tgz", + "integrity": "sha512-lg6eITwYe9v6Hr5CncVbK70SoioNQIq81nsaG86ev5hAidQvmOeETBqs7jm43K2F5/Ley3ytDtriImV6TpNiSg==", "dev": true, + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/postcss/" + }, + { + "type": "tidelift", + "url": "https://tidelift.com/funding/github/npm/postcss" + } + ], "dependencies": { - "nanoid": "^3.1.28", - "picocolors": "^0.2.1", - "source-map-js": "^0.6.2" + "nanoid": "^3.3.1", + "picocolors": "^1.0.0", + "source-map-js": "^1.0.2" }, "engines": { "node": "^10 || ^12 || >=14" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/postcss/" } }, "node_modules/postcss-modules-extract-imports": { @@ -5995,6 +6434,15 @@ "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==" }, + "node_modules/react-refresh": { + "version": "0.11.0", + "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.11.0.tgz", + "integrity": "sha512-F27qZr8uUqwhWZboondsPx8tnC3Ct3SxZA3V5WyEvujRyyNv0VYPhoBg1gZ8/MV5tubQp76Trw8lTv9hzRBa+A==", + "dev": true, + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/read-pkg": { "version": "5.2.0", "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-5.2.0.tgz", @@ -6049,6 +6497,10 @@ "node": ">= 0.10" } }, + "node_modules/recorder": { + "resolved": "packages/recorder", + "link": true + }, "node_modules/regexpp": { "version": "3.2.0", "resolved": "https://registry.npmjs.org/regexpp/-/regexpp-3.2.0.tgz", @@ -6093,13 +6545,17 @@ } }, "node_modules/resolve": { - "version": "1.20.0", - "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.20.0.tgz", - "integrity": "sha512-wENBPt4ySzg4ybFQW2TT1zMQucPK95HSh/nq2CFTZVOGut2+pQvSsgtda4d26YrYcr067wjbmzOG8byDPBX63A==", + "version": "1.22.0", + "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.0.tgz", + "integrity": "sha512-Hhtrw0nLeSrFQ7phPp4OOcVjLPIeMnRlr5mcnVuMe7M/7eBn98A3hmFRLoFo3DLZkivSYwhRUJTyPyWAk56WLw==", "dev": true, "dependencies": { - "is-core-module": "^2.2.0", - "path-parse": "^1.0.6" + "is-core-module": "^2.8.1", + "path-parse": "^1.0.7", + "supports-preserve-symlinks-flag": "^1.0.0" + }, + "bin": { + "resolve": "bin/resolve" }, "funding": { "url": "https://github.com/sponsors/ljharb" @@ -6201,6 +6657,21 @@ "dev": true, "optional": true }, + "node_modules/rollup": { + "version": "2.70.1", + "resolved": "https://registry.npmjs.org/rollup/-/rollup-2.70.1.tgz", + "integrity": "sha512-CRYsI5EuzLbXdxC6RnYhOuRdtz4bhejPMSWjsFLfVM/7w/85n2szZv6yExqUXsBdz5KT8eoubeyDUDjhLHEslA==", + "dev": true, + "bin": { + "rollup": "dist/bin/rollup" + }, + "engines": { + "node": ">=10.0.0" + }, + "optionalDependencies": { + "fsevents": "~2.3.2" + } + }, "node_modules/run-parallel": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz", @@ -6475,9 +6946,9 @@ } }, "node_modules/source-map-js": { - "version": "0.6.2", - "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-0.6.2.tgz", - "integrity": "sha512-/3GptzWzu0+0MBQFrDKzw/DvvMTUORvgY6k6jd/VS6iCR4RDTKWH6v6WPwQoUO8667uQEf9Oe38DxAYWY5F/Ug==", + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz", + "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==", "dev": true, "engines": { "node": ">=0.10.0" @@ -6660,6 +7131,18 @@ "node": ">=4" } }, + "node_modules/supports-preserve-symlinks-flag": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz", + "integrity": "sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==", + "dev": true, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/tapable": { "version": "2.2.1", "resolved": "https://registry.npmjs.org/tapable/-/tapable-2.2.1.tgz", @@ -6805,6 +7288,10 @@ "node": ">=8.0" } }, + "node_modules/trace-viewer": { + "resolved": "packages/trace-viewer", + "link": true + }, "node_modules/tree-kill": { "version": "1.2.2", "resolved": "https://registry.npmjs.org/tree-kill/-/tree-kill-1.2.2.tgz", @@ -6949,6 +7436,43 @@ "spdx-expression-parse": "^3.0.0" } }, + "node_modules/vite": { + "version": "2.8.6", + "resolved": "https://registry.npmjs.org/vite/-/vite-2.8.6.tgz", + "integrity": "sha512-e4H0QpludOVKkmOsRyqQ7LTcMUDF3mcgyNU4lmi0B5JUbe0ZxeBBl8VoZ8Y6Rfn9eFKYtdXNPcYK97ZwH+K2ug==", + "dev": true, + "dependencies": { + "esbuild": "^0.14.14", + "postcss": "^8.4.6", + "resolve": "^1.22.0", + "rollup": "^2.59.0" + }, + "bin": { + "vite": "bin/vite.js" + }, + "engines": { + "node": ">=12.2.0" + }, + "optionalDependencies": { + "fsevents": "~2.3.2" + }, + "peerDependencies": { + "less": "*", + "sass": "*", + "stylus": "*" + }, + "peerDependenciesMeta": { + "less": { + "optional": true + }, + "sass": { + "optional": true + }, + "stylus": { + "optional": true + } + } + }, "node_modules/watchpack": { "version": "2.3.1", "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.3.1.tgz", @@ -7520,6 +8044,12 @@ "engines": { "node": ">=12" } + }, + "packages/recorder": { + "version": "0.0.0" + }, + "packages/trace-viewer": { + "version": "0.0.0" } }, "dependencies": { @@ -7998,6 +8528,24 @@ "@babel/plugin-transform-react-jsx": "^7.16.7" } }, + "@babel/plugin-transform-react-jsx-self": { + "version": "7.16.7", + "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-self/-/plugin-transform-react-jsx-self-7.16.7.tgz", + "integrity": "sha512-oe5VuWs7J9ilH3BCCApGoYjHoSO48vkjX2CbA5bFVhIuO2HKxA3vyF7rleA4o6/4rTDbk6r8hBW7Ul8E+UZrpA==", + "dev": true, + "requires": { + "@babel/helper-plugin-utils": "^7.16.7" + } + }, + "@babel/plugin-transform-react-jsx-source": { + "version": "7.16.7", + "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-source/-/plugin-transform-react-jsx-source-7.16.7.tgz", + "integrity": "sha512-rONFiQz9vgbsnaMtQlZCjIRwhJvlrPET8TabIUK2hzlXw9B9s2Ieaxte1SCOOXMbWRHodbKixNf3BLcWVOQ8Bw==", + "dev": true, + "requires": { + "@babel/helper-plugin-utils": "^7.16.7" + } + }, "@babel/plugin-transform-react-pure-annotations": { "version": "7.16.7", "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-pure-annotations/-/plugin-transform-react-pure-annotations-7.16.7.tgz", @@ -8330,6 +8878,16 @@ } } }, + "@rollup/pluginutils": { + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-4.2.0.tgz", + "integrity": "sha512-2WUyJNRkyH5p487pGnn4tWAsxhEFKN/pT8CMgHshd5H+IXkOnKvKZwsz5ZWz+YCXkleZRAU5kwbfgF8CPfDRqA==", + "dev": true, + "requires": { + "estree-walker": "^2.0.1", + "picomatch": "^2.2.2" + } + }, "@sindresorhus/is": { "version": "0.14.0", "resolved": "https://registry.npmjs.org/@sindresorhus/is/-/is-0.14.0.tgz", @@ -8815,6 +9373,22 @@ "eslint-visitor-keys": "^3.0.0" } }, + "@vitejs/plugin-react": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-1.2.0.tgz", + "integrity": "sha512-Rywwt0IXXg6yQ0hv3cMT3mtdDcGIw31mGaa+MMMAT651LhoXLF2yFy4LrakiTs7UKs7RPBo9eNgaS8pgl2A6Qw==", + "dev": true, + "requires": { + "@babel/core": "^7.16.12", + "@babel/plugin-transform-react-jsx": "^7.16.7", + "@babel/plugin-transform-react-jsx-development": "^7.16.7", + "@babel/plugin-transform-react-jsx-self": "^7.16.7", + "@babel/plugin-transform-react-jsx-source": "^7.16.7", + "@rollup/pluginutils": "^4.1.2", + "react-refresh": "^0.11.0", + "resolve": "^1.22.0" + } + }, "@webassemblyjs/ast": { "version": "1.11.1", "resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.11.1.tgz", @@ -9188,13 +9762,6 @@ "escalade": "^3.1.1", "node-releases": "^2.0.1", "picocolors": "^1.0.0" - }, - "dependencies": { - "picocolors": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz", - "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==" - } } }, "buffer-crc32": { @@ -9973,6 +10540,174 @@ "dev": true, "optional": true }, + "esbuild": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.14.27.tgz", + "integrity": "sha512-MZQt5SywZS3hA9fXnMhR22dv0oPGh6QtjJRIYbgL1AeqAoQZE+Qn5ppGYQAoHv/vq827flj4tIJ79Mrdiwk46Q==", + "dev": true, + "requires": { + "esbuild-android-64": "0.14.27", + "esbuild-android-arm64": "0.14.27", + "esbuild-darwin-64": "0.14.27", + "esbuild-darwin-arm64": "0.14.27", + "esbuild-freebsd-64": "0.14.27", + "esbuild-freebsd-arm64": "0.14.27", + "esbuild-linux-32": "0.14.27", + "esbuild-linux-64": "0.14.27", + "esbuild-linux-arm": "0.14.27", + "esbuild-linux-arm64": "0.14.27", + "esbuild-linux-mips64le": "0.14.27", + "esbuild-linux-ppc64le": "0.14.27", + "esbuild-linux-riscv64": "0.14.27", + "esbuild-linux-s390x": "0.14.27", + "esbuild-netbsd-64": "0.14.27", + "esbuild-openbsd-64": "0.14.27", + "esbuild-sunos-64": "0.14.27", + "esbuild-windows-32": "0.14.27", + "esbuild-windows-64": "0.14.27", + "esbuild-windows-arm64": "0.14.27" + } + }, + "esbuild-android-64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-android-64/-/esbuild-android-64-0.14.27.tgz", + "integrity": "sha512-LuEd4uPuj/16Y8j6kqy3Z2E9vNY9logfq8Tq+oTE2PZVuNs3M1kj5Qd4O95ee66yDGb3isaOCV7sOLDwtMfGaQ==", + "dev": true, + "optional": true + }, + "esbuild-android-arm64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-android-arm64/-/esbuild-android-arm64-0.14.27.tgz", + "integrity": "sha512-E8Ktwwa6vX8q7QeJmg8yepBYXaee50OdQS3BFtEHKrzbV45H4foMOeEE7uqdjGQZFBap5VAqo7pvjlyA92wznQ==", + "dev": true, + "optional": true + }, + "esbuild-darwin-64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-darwin-64/-/esbuild-darwin-64-0.14.27.tgz", + "integrity": "sha512-czw/kXl/1ZdenPWfw9jDc5iuIYxqUxgQ/Q+hRd4/3udyGGVI31r29LCViN2bAJgGvQkqyLGVcG03PJPEXQ5i2g==", + "dev": true, + "optional": true + }, + "esbuild-darwin-arm64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-darwin-arm64/-/esbuild-darwin-arm64-0.14.27.tgz", + "integrity": "sha512-BEsv2U2U4o672oV8+xpXNxN9bgqRCtddQC6WBh4YhXKDcSZcdNh7+6nS+DM2vu7qWIWNA4JbRG24LUUYXysimQ==", + "dev": true, + "optional": true + }, + "esbuild-freebsd-64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-freebsd-64/-/esbuild-freebsd-64-0.14.27.tgz", + "integrity": "sha512-7FeiFPGBo+ga+kOkDxtPmdPZdayrSzsV9pmfHxcyLKxu+3oTcajeZlOO1y9HW+t5aFZPiv7czOHM4KNd0tNwCA==", + "dev": true, + "optional": true + }, + "esbuild-freebsd-arm64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-freebsd-arm64/-/esbuild-freebsd-arm64-0.14.27.tgz", + "integrity": "sha512-8CK3++foRZJluOWXpllG5zwAVlxtv36NpHfsbWS7TYlD8S+QruXltKlXToc/5ZNzBK++l6rvRKELu/puCLc7jA==", + "dev": true, + "optional": true + }, + "esbuild-linux-32": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-linux-32/-/esbuild-linux-32-0.14.27.tgz", + "integrity": "sha512-qhNYIcT+EsYSBClZ5QhLzFzV5iVsP1YsITqblSaztr3+ZJUI+GoK8aXHyzKd7/CKKuK93cxEMJPpfi1dfsOfdw==", + "dev": true, + "optional": true + }, + "esbuild-linux-64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-linux-64/-/esbuild-linux-64-0.14.27.tgz", + "integrity": "sha512-ESjck9+EsHoTaKWlFKJpPZRN26uiav5gkI16RuI8WBxUdLrrAlYuYSndxxKgEn1csd968BX/8yQZATYf/9+/qg==", + "dev": true, + "optional": true + }, + "esbuild-linux-arm": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-linux-arm/-/esbuild-linux-arm-0.14.27.tgz", + "integrity": "sha512-JnnmgUBdqLQO9hoNZQqNHFWlNpSX82vzB3rYuCJMhtkuaWQEmQz6Lec1UIxJdC38ifEghNTBsF9bbe8dFilnCw==", + "dev": true, + "optional": true + }, + "esbuild-linux-arm64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-linux-arm64/-/esbuild-linux-arm64-0.14.27.tgz", + "integrity": "sha512-no6Mi17eV2tHlJnqBHRLekpZ2/VYx+NfGxKcBE/2xOMYwctsanCaXxw4zapvNrGE9X38vefVXLz6YCF8b1EHiQ==", + "dev": true, + "optional": true + }, + "esbuild-linux-mips64le": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-linux-mips64le/-/esbuild-linux-mips64le-0.14.27.tgz", + "integrity": "sha512-NolWP2uOvIJpbwpsDbwfeExZOY1bZNlWE/kVfkzLMsSgqeVcl5YMen/cedRe9mKnpfLli+i0uSp7N+fkKNU27A==", + "dev": true, + "optional": true + }, + "esbuild-linux-ppc64le": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-linux-ppc64le/-/esbuild-linux-ppc64le-0.14.27.tgz", + "integrity": "sha512-/7dTjDvXMdRKmsSxKXeWyonuGgblnYDn0MI1xDC7J1VQXny8k1qgNp6VmrlsawwnsymSUUiThhkJsI+rx0taNA==", + "dev": true, + "optional": true + }, + "esbuild-linux-riscv64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-linux-riscv64/-/esbuild-linux-riscv64-0.14.27.tgz", + "integrity": "sha512-D+aFiUzOJG13RhrSmZgrcFaF4UUHpqj7XSKrIiCXIj1dkIkFqdrmqMSOtSs78dOtObWiOrFCDDzB24UyeEiNGg==", + "dev": true, + "optional": true + }, + "esbuild-linux-s390x": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-linux-s390x/-/esbuild-linux-s390x-0.14.27.tgz", + "integrity": "sha512-CD/D4tj0U4UQjELkdNlZhQ8nDHU5rBn6NGp47Hiz0Y7/akAY5i0oGadhEIg0WCY/HYVXFb3CsSPPwaKcTOW3bg==", + "dev": true, + "optional": true + }, + "esbuild-netbsd-64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-netbsd-64/-/esbuild-netbsd-64-0.14.27.tgz", + "integrity": "sha512-h3mAld69SrO1VoaMpYl3a5FNdGRE/Nqc+E8VtHOag4tyBwhCQXxtvDDOAKOUQexBGca0IuR6UayQ4ntSX5ij1Q==", + "dev": true, + "optional": true + }, + "esbuild-openbsd-64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-openbsd-64/-/esbuild-openbsd-64-0.14.27.tgz", + "integrity": "sha512-xwSje6qIZaDHXWoPpIgvL+7fC6WeubHHv18tusLYMwL+Z6bEa4Pbfs5IWDtQdHkArtfxEkIZz77944z8MgDxGw==", + "dev": true, + "optional": true + }, + "esbuild-sunos-64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-sunos-64/-/esbuild-sunos-64-0.14.27.tgz", + "integrity": "sha512-/nBVpWIDjYiyMhuqIqbXXsxBc58cBVH9uztAOIfWShStxq9BNBik92oPQPJ57nzWXRNKQUEFWr4Q98utDWz7jg==", + "dev": true, + "optional": true + }, + "esbuild-windows-32": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-windows-32/-/esbuild-windows-32-0.14.27.tgz", + "integrity": "sha512-Q9/zEjhZJ4trtWhFWIZvS/7RUzzi8rvkoaS9oiizkHTTKd8UxFwn/Mm2OywsAfYymgUYm8+y2b+BKTNEFxUekw==", + "dev": true, + "optional": true + }, + "esbuild-windows-64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-windows-64/-/esbuild-windows-64-0.14.27.tgz", + "integrity": "sha512-b3y3vTSl5aEhWHK66ngtiS/c6byLf6y/ZBvODH1YkBM+MGtVL6jN38FdHUsZasCz9gFwYs/lJMVY9u7GL6wfYg==", + "dev": true, + "optional": true + }, + "esbuild-windows-arm64": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/esbuild-windows-arm64/-/esbuild-windows-arm64-0.14.27.tgz", + "integrity": "sha512-I/reTxr6TFMcR5qbIkwRGvldMIaiBu2+MP0LlD7sOlNXrfqIl9uNjsuxFPGEG4IRomjfQ5q8WT+xlF/ySVkqKg==", + "dev": true, + "optional": true + }, "escalade": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.1.tgz", @@ -10231,6 +10966,12 @@ "integrity": "sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw==", "dev": true }, + "estree-walker": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz", + "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==", + "dev": true + }, "esutils": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz", @@ -10492,6 +11233,13 @@ "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz", "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=" }, + "fsevents": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", + "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", + "dev": true, + "optional": true + }, "function-bind": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz", @@ -10859,9 +11607,9 @@ "dev": true }, "is-core-module": { - "version": "2.6.0", - "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.6.0.tgz", - "integrity": "sha512-wShG8vs60jKfPWpF2KZRaAtvt3a20OAn7+IJ6hLPECpSABLcKtFKTTI4ZtH5QcBruBHlq+WsdHWyz0BCZW7svQ==", + "version": "2.8.1", + "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.8.1.tgz", + "integrity": "sha512-SdNCUs284hr40hFTFP6l0IfZ/RSrMXF3qgoRHd3/79unUTvrFO/JoXwkGm+5J/Oe3E/b5GsnG330uUNgRpu1PA==", "dev": true, "requires": { "has": "^1.0.3" @@ -11472,9 +12220,9 @@ "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==" }, "nanoid": { - "version": "3.2.0", - "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.2.0.tgz", - "integrity": "sha512-fmsZYa9lpn69Ad5eDn7FMcnnSR+8R34W9qJEijxYhTbfOWzr22n1QxCMzXLK+ODyW2973V3Fux959iQoUxzUIA==", + "version": "3.3.1", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.1.tgz", + "integrity": "sha512-n6Vs/3KGyxPQd6uO0eH4Bv0ojGSUvuLlIHtC3Y0kEO23YRge8H9x1GCzLn28YX0H66pMkxuaeESFq4tKISKwdw==", "dev": true }, "natural-compare": { @@ -11776,10 +12524,9 @@ "integrity": "sha1-elfrVQpng/kRUzH89GY9XI4AelA=" }, "picocolors": { - "version": "0.2.1", - "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-0.2.1.tgz", - "integrity": "sha512-cMlDqaLEqfSaW8Z7N5Jw+lyIW869EzT73/F5lhtY9cLGoVxSXznfgfXMO0Z5K0o0Q2TkTXq+0KFsdnSe3jDViA==", - "dev": true + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz", + "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==" }, "picomatch": { "version": "2.2.3", @@ -11876,14 +12623,14 @@ "integrity": "sha512-TRzzuFRRmEoSW/p1KVAmiOgPco2Irlah+bGFCeNfJXxxYGwSw7YwAOAcd7X28K/m5bjBWKsC29KyoMfHbypayg==" }, "postcss": { - "version": "8.3.9", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.9.tgz", - "integrity": "sha512-f/ZFyAKh9Dnqytx5X62jgjhhzttjZS7hMsohcI7HEI5tjELX/HxCy3EFhsRxyzGvrzFF+82XPvCS8T9TFleVJw==", + "version": "8.4.12", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.12.tgz", + "integrity": "sha512-lg6eITwYe9v6Hr5CncVbK70SoioNQIq81nsaG86ev5hAidQvmOeETBqs7jm43K2F5/Ley3ytDtriImV6TpNiSg==", "dev": true, "requires": { - "nanoid": "^3.1.28", - "picocolors": "^0.2.1", - "source-map-js": "^0.6.2" + "nanoid": "^3.3.1", + "picocolors": "^1.0.0", + "source-map-js": "^1.0.2" } }, "postcss-modules-extract-imports": { @@ -12084,6 +12831,12 @@ "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==" }, + "react-refresh": { + "version": "0.11.0", + "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.11.0.tgz", + "integrity": "sha512-F27qZr8uUqwhWZboondsPx8tnC3Ct3SxZA3V5WyEvujRyyNv0VYPhoBg1gZ8/MV5tubQp76Trw8lTv9hzRBa+A==", + "dev": true + }, "read-pkg": { "version": "5.2.0", "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-5.2.0.tgz", @@ -12129,6 +12882,9 @@ "resolve": "^1.9.0" } }, + "recorder": { + "version": "file:packages/recorder" + }, "regexpp": { "version": "3.2.0", "resolved": "https://registry.npmjs.org/regexpp/-/regexpp-3.2.0.tgz", @@ -12161,13 +12917,14 @@ "dev": true }, "resolve": { - "version": "1.20.0", - "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.20.0.tgz", - "integrity": "sha512-wENBPt4ySzg4ybFQW2TT1zMQucPK95HSh/nq2CFTZVOGut2+pQvSsgtda4d26YrYcr067wjbmzOG8byDPBX63A==", + "version": "1.22.0", + "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.0.tgz", + "integrity": "sha512-Hhtrw0nLeSrFQ7phPp4OOcVjLPIeMnRlr5mcnVuMe7M/7eBn98A3hmFRLoFo3DLZkivSYwhRUJTyPyWAk56WLw==", "dev": true, "requires": { - "is-core-module": "^2.2.0", - "path-parse": "^1.0.6" + "is-core-module": "^2.8.1", + "path-parse": "^1.0.7", + "supports-preserve-symlinks-flag": "^1.0.0" } }, "resolve-cwd": { @@ -12245,6 +13002,15 @@ } } }, + "rollup": { + "version": "2.70.1", + "resolved": "https://registry.npmjs.org/rollup/-/rollup-2.70.1.tgz", + "integrity": "sha512-CRYsI5EuzLbXdxC6RnYhOuRdtz4bhejPMSWjsFLfVM/7w/85n2szZv6yExqUXsBdz5KT8eoubeyDUDjhLHEslA==", + "dev": true, + "requires": { + "fsevents": "~2.3.2" + } + }, "run-parallel": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz", @@ -12444,9 +13210,9 @@ "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=" }, "source-map-js": { - "version": "0.6.2", - "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-0.6.2.tgz", - "integrity": "sha512-/3GptzWzu0+0MBQFrDKzw/DvvMTUORvgY6k6jd/VS6iCR4RDTKWH6v6WPwQoUO8667uQEf9Oe38DxAYWY5F/Ug==", + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz", + "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==", "dev": true }, "source-map-support": { @@ -12591,6 +13357,12 @@ "has-flag": "^3.0.0" } }, + "supports-preserve-symlinks-flag": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz", + "integrity": "sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==", + "dev": true + }, "tapable": { "version": "2.2.1", "resolved": "https://registry.npmjs.org/tapable/-/tapable-2.2.1.tgz", @@ -12680,6 +13452,9 @@ "is-number": "^7.0.0" } }, + "trace-viewer": { + "version": "file:packages/trace-viewer" + }, "tree-kill": { "version": "1.2.2", "resolved": "https://registry.npmjs.org/tree-kill/-/tree-kill-1.2.2.tgz", @@ -12795,6 +13570,19 @@ "spdx-expression-parse": "^3.0.0" } }, + "vite": { + "version": "2.8.6", + "resolved": "https://registry.npmjs.org/vite/-/vite-2.8.6.tgz", + "integrity": "sha512-e4H0QpludOVKkmOsRyqQ7LTcMUDF3mcgyNU4lmi0B5JUbe0ZxeBBl8VoZ8Y6Rfn9eFKYtdXNPcYK97ZwH+K2ug==", + "dev": true, + "requires": { + "esbuild": "^0.14.14", + "fsevents": "~2.3.2", + "postcss": "^8.4.6", + "resolve": "^1.22.0", + "rollup": "^2.59.0" + } + }, "watchpack": { "version": "2.3.1", "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.3.1.tgz", diff --git a/package.json b/package.json index 0268cbd6f8..4a07e14bef 100644 --- a/package.json +++ b/package.json @@ -71,6 +71,7 @@ "@types/yazl": "^2.4.2", "@typescript-eslint/eslint-plugin": "^5.10.2", "@typescript-eslint/parser": "^5.10.2", + "@vitejs/plugin-react": "^1.0.7", "@zip.js/zip.js": "^2.4.2", "ansi-to-html": "^0.7.2", "babel-loader": "^8.2.3", @@ -98,6 +99,7 @@ "socksv5": "0.0.6", "style-loader": "^3.3.1", "typescript": "^4.5.5", + "vite": "^2.8.0", "webpack": "^5.68.0", "webpack-cli": "^4.9.2", "xml2js": "^0.4.23", diff --git a/packages/playwright-core/.npmignore b/packages/playwright-core/.npmignore index 0d183a6b81..15378d04e2 100644 --- a/packages/playwright-core/.npmignore +++ b/packages/playwright-core/.npmignore @@ -5,6 +5,7 @@ # Include sources from lib, but not map files. !lib/**/*.js # Include web assets for recorder, trace viewer, etc. +!lib/**/*.css !lib/**/*.html !lib/**/*.png !lib/**/*.ttf diff --git a/packages/playwright-core/src/DEPS b/packages/playwright-core/src/DEPS index c741fc6a88..e19298276f 100644 --- a/packages/playwright-core/src/DEPS +++ b/packages/playwright-core/src/DEPS @@ -3,6 +3,7 @@ module.exports = { // CLI should only use client-side features. 'cli/': [ + '..', 'cli/**', 'client/**', 'debug/injected/', @@ -13,10 +14,14 @@ module.exports = { 'utils/**', ], - 'cli/driver.ts': [ '**' ], + 'cli/driver.ts': [ + '..', + '**', + ], // Client depends on chromium protocol for types. 'client/': [ + '../types/**', 'common/', 'protocol/', 'server/chromium/protocol.d.ts', @@ -52,6 +57,7 @@ module.exports = { // Generic dependencies for server-side code. 'server/': [ + '../types/types.d.ts', 'common/', 'generated/', 'protocol/**', @@ -61,6 +67,8 @@ module.exports = { 'server/common/**', 'server/injected/**', 'server/supplements/**', + // For fetch ?!? + 'server/trace/recorder/tracing.ts', 'utils/', ], @@ -110,18 +118,6 @@ module.exports = { 'utils/', ], - 'server/fetch.ts': [ - 'common/', - 'generated/', - 'protocol/**', - 'server/', - 'server/common/**', - 'server/injected/**', - 'server/supplements/**', - 'server/trace/recorder/tracing.ts', - 'utils/', - ], - 'server/playwright.ts': [ 'common/', 'generated/', @@ -171,6 +167,12 @@ module.exports = { 'utils/', ], + // For testing + 'server/trace/test/': [ + '@trace-viewer/**', + '**', + ], + 'server/trace/recorder/': [ 'common/', 'generated/', @@ -216,43 +218,4 @@ module.exports = { 'protocol/', 'third_party/diff_match_patch', ], - - // Tracing is a client/server plugin, nothing should depend on it. - 'web/components/': [ - 'third_party/highlightjs/**', - 'web/third_party/vscode/', - ], - - 'web/recorder/': [ - 'common/', - 'server/supplements/recorder/recorderTypes.ts', - 'web/', - 'web/components/', - 'web/third_party/vscode/', - ], - - 'web/traceViewer/': [ - 'common/', - 'protocol/callMetadata.ts', - 'server/trace/common/', - 'web/', - 'web/third_party/vscode/', - 'web/traceViewer/ui/', - ], - - 'web/traceViewer/ui/': [ - 'common/', - 'protocol/', - 'protocol/channels.ts', - 'server/snapshot/snapshotTypes.ts', - 'server/trace/', - 'server/trace/common/', - 'server/trace/viewer/', - 'third_party/**', - 'web/', - 'web/components/', - 'web/traceViewer/', - ], - - 'web/traceViewer/inMemorySnapshotter.ts': [ '**' ], -} +}; diff --git a/packages/playwright-core/src/server/instrumentation.ts b/packages/playwright-core/src/server/instrumentation.ts index 478f4b2cff..f2186696b6 100644 --- a/packages/playwright-core/src/server/instrumentation.ts +++ b/packages/playwright-core/src/server/instrumentation.ts @@ -33,8 +33,8 @@ export type Attribution = { frame?: Frame; }; -import { CallMetadata } from '../protocol/callMetadata'; -export { CallMetadata } from '../protocol/callMetadata'; +import type { CallMetadata } from '../protocol/callMetadata'; +export type { CallMetadata } from '../protocol/callMetadata'; export class SdkObject extends EventEmitter { guid: string; diff --git a/packages/playwright-core/src/server/trace/common/traceEvents.ts b/packages/playwright-core/src/server/trace/common/traceEvents.ts index 581b7c5fb1..2f4e5e3cb1 100644 --- a/packages/playwright-core/src/server/trace/common/traceEvents.ts +++ b/packages/playwright-core/src/server/trace/common/traceEvents.ts @@ -18,6 +18,7 @@ import type { Size } from '../../../common/types'; import type { CallMetadata } from '../../instrumentation'; import type { FrameSnapshot, ResourceSnapshot } from './snapshotTypes'; +// Make sure you add _modernize_N_to_N1(event: any) to traceModel.ts. export const VERSION = 3; export type BrowserContextEventOptions = { diff --git a/packages/playwright-core/src/web/traceViewer/inMemorySnapshotter.ts b/packages/playwright-core/src/server/trace/test/inMemorySnapshotter.ts similarity index 82% rename from packages/playwright-core/src/web/traceViewer/inMemorySnapshotter.ts rename to packages/playwright-core/src/server/trace/test/inMemorySnapshotter.ts index 5b32775b80..d2cbd6b3a9 100644 --- a/packages/playwright-core/src/web/traceViewer/inMemorySnapshotter.ts +++ b/packages/playwright-core/src/server/trace/test/inMemorySnapshotter.ts @@ -14,16 +14,16 @@ * limitations under the License. */ -import { BrowserContext } from '../../server/browserContext'; -import { eventsHelper } from '../../utils/eventsHelper'; -import { Page } from '../../server/page'; -import { FrameSnapshot } from '../../server/trace/common/snapshotTypes'; -import { SnapshotRenderer } from './snapshotRenderer'; -import { BaseSnapshotStorage } from './snapshotStorage'; -import { Snapshotter, SnapshotterBlob, SnapshotterDelegate } from '../../server/trace/recorder/snapshotter'; -import { ElementHandle } from '../../server/dom'; -import { HarTracer, HarTracerDelegate } from '../../server/supplements/har/harTracer'; -import * as har from '../../server/supplements/har/har'; +import { BrowserContext } from '../../browserContext'; +import { eventsHelper } from '../../../utils/eventsHelper'; +import { Page } from '../../page'; +import { FrameSnapshot } from '../common/snapshotTypes'; +import { SnapshotRenderer } from '../../../../../trace-viewer/src/snapshotRenderer'; +import { BaseSnapshotStorage } from '../../../../../trace-viewer/src/snapshotStorage'; +import { Snapshotter, SnapshotterBlob, SnapshotterDelegate } from '../recorder/snapshotter'; +import { ElementHandle } from '../../dom'; +import { HarTracer, HarTracerDelegate } from '../../supplements/har/harTracer'; +import * as har from '../../supplements/har/har'; export class InMemorySnapshotter extends BaseSnapshotStorage implements SnapshotterDelegate, HarTracerDelegate { private _blobs = new Map(); diff --git a/packages/playwright-core/src/server/types.ts b/packages/playwright-core/src/server/types.ts index f5aeb683ae..f3d7237dc7 100644 --- a/packages/playwright-core/src/server/types.ts +++ b/packages/playwright-core/src/server/types.ts @@ -15,8 +15,8 @@ * limitations under the License. */ -import { Size, Point, TimeoutOptions } from '../common/types'; -export { Size, Point, Rect, Quad, URLMatch, TimeoutOptions } from '../common/types'; +import type { Size, Point, TimeoutOptions } from '../common/types'; +export type { Size, Point, Rect, Quad, URLMatch, TimeoutOptions } from '../common/types'; export type StrictOptions = { strict?: boolean, diff --git a/packages/playwright-core/src/third_party/highlightjs/highlightjs/highlight.js b/packages/playwright-core/src/third_party/highlightjs/highlightjs/highlight.js deleted file mode 100644 index 44179572e8..0000000000 --- a/packages/playwright-core/src/third_party/highlightjs/highlightjs/highlight.js +++ /dev/null @@ -1,2 +0,0 @@ -// This file has been deprecated in favor of core.js -var hljs = require('./core'); diff --git a/packages/playwright-core/src/third_party/highlightjs/highlightjs/index.js b/packages/playwright-core/src/third_party/highlightjs/highlightjs/index.js deleted file mode 100644 index 995333f42c..0000000000 --- a/packages/playwright-core/src/third_party/highlightjs/highlightjs/index.js +++ /dev/null @@ -1,8 +0,0 @@ -var hljs = require('./core'); - -hljs.registerLanguage('javascript', require('./languages/javascript')); -hljs.registerLanguage('python', require('./languages/python')); -hljs.registerLanguage('csharp', require('./languages/csharp')); -hljs.registerLanguage('java', require('./languages/java')); - -module.exports = hljs; \ No newline at end of file diff --git a/packages/playwright-core/src/web/recorder/webpack.config.js b/packages/playwright-core/src/web/recorder/webpack.config.js deleted file mode 100644 index 480b5c2cc2..0000000000 --- a/packages/playwright-core/src/web/recorder/webpack.config.js +++ /dev/null @@ -1,45 +0,0 @@ -const path = require('path'); -const HtmlWebPackPlugin = require('html-webpack-plugin'); - -const mode = process.env.NODE_ENV === 'production' ? 'production' : 'development'; - -module.exports = { - mode, - entry: { - app: path.join(__dirname, 'index.tsx'), - }, - resolve: { - extensions: ['.ts', '.js', '.tsx', '.jsx'] - }, - devtool: mode === 'production' ? false : 'source-map', - output: { - globalObject: 'self', - filename: '[name].bundle.js', - path: path.resolve(__dirname, '../../../lib/webpack/recorder') - }, - module: { - rules: [ - { - test: /\.(j|t)sx?$/, - loader: 'babel-loader', - options: { - presets: [ - "@babel/preset-typescript", - "@babel/preset-react" - ] - }, - exclude: /node_modules/ - }, - { - test: /\.css$/, - use: ['style-loader', 'css-loader'] - }, - ] - }, - plugins: [ - new HtmlWebPackPlugin({ - title: 'Playwright Inspector', - template: path.join(__dirname, 'index.html'), - }) - ] -}; diff --git a/packages/playwright-core/src/web/traceViewer/webpack-sw.config.js b/packages/playwright-core/src/web/traceViewer/webpack-sw.config.js deleted file mode 100644 index 9d0195ae3c..0000000000 --- a/packages/playwright-core/src/web/traceViewer/webpack-sw.config.js +++ /dev/null @@ -1,32 +0,0 @@ -const path = require('path'); - -const mode = process.env.NODE_ENV === 'production' ? 'production' : 'development'; -module.exports = { - mode, - entry: { - sw: path.join(__dirname, 'sw.ts'), - }, - resolve: { - extensions: ['.ts', '.js'] - }, - devtool: mode === 'production' ? false : 'source-map', - output: { - globalObject: 'self', - filename: '[name].bundle.js', - path: path.resolve(__dirname, '../../../lib/webpack/traceViewer') - }, - module: { - rules: [ - { - test: /\.(j|t)sx?$/, - loader: 'babel-loader', - options: { - presets: [ - "@babel/preset-typescript", - ] - }, - exclude: /node_modules/ - }, - ] - }, -}; diff --git a/packages/playwright-core/src/web/traceViewer/webpack.config.js b/packages/playwright-core/src/web/traceViewer/webpack.config.js deleted file mode 100644 index cc0a82a19b..0000000000 --- a/packages/playwright-core/src/web/traceViewer/webpack.config.js +++ /dev/null @@ -1,60 +0,0 @@ -const path = require('path'); -const HtmlWebPackPlugin = require('html-webpack-plugin'); -const CopyPlugin = require('copy-webpack-plugin'); - -const mode = process.env.NODE_ENV === 'production' ? 'production' : 'development'; -module.exports = { - mode, - entry: { - app: path.join(__dirname, 'index.tsx'), - }, - resolve: { - extensions: ['.ts', '.js', '.tsx', '.jsx'] - }, - devtool: mode === 'production' ? false : 'source-map', - output: { - globalObject: 'self', - filename: '[name].bundle.js', - path: path.resolve(__dirname, '../../../lib/webpack/traceViewer') - }, - module: { - rules: [ - { - test: /\.(j|t)sx?$/, - loader: 'babel-loader', - options: { - presets: [ - "@babel/preset-typescript", - "@babel/preset-react" - ] - }, - exclude: /node_modules/ - }, - { - test: /\.css$/, - use: ['style-loader', 'css-loader'] - }, - ] - }, - plugins: [ - new CopyPlugin({ - patterns: [ - { - from: path.resolve(__dirname, '../../../../../node_modules/@zip.js/zip.js/dist/zip-no-worker-inflate.min.js'), - to: 'zip.min.js' - }, - ], - }), - new CopyPlugin({ - patterns: [ - { - from: path.resolve(__dirname, 'static'), - }, - ], - }), - new HtmlWebPackPlugin({ - title: 'Playwright Trace Viewer', - template: path.join(__dirname, 'index.html'), - }) - ] -}; diff --git a/packages/playwright-core/src/web/types.d.ts b/packages/playwright-core/src/web/types.d.ts deleted file mode 100644 index 922973fbaa..0000000000 --- a/packages/playwright-core/src/web/types.d.ts +++ /dev/null @@ -1,20 +0,0 @@ -/* - Copyright (c) Microsoft Corporation. - - Licensed under the Apache License, Version 2.0 (the "License"); - you may not use this file except in compliance with the License. - You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - - Unless required by applicable law or agreed to in writing, software - distributed under the License is distributed on an "AS IS" BASIS, - WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - See the License for the specific language governing permissions and - limitations under the License. -*/ - -declare module '*.png' { - const value: any; - export = value; -} diff --git a/packages/playwright-test/src/DEPS b/packages/playwright-test/src/DEPS index c8cfba6f24..4936cc7f31 100644 --- a/packages/playwright-test/src/DEPS +++ b/packages/playwright-test/src/DEPS @@ -1,8 +1,9 @@ module.exports = { '/': [ + '../types/testReporter.d.ts', + 'matchers/', 'reporters/', 'third_party/', - 'matchers/', ], 'matchers': [ 'expect.ts', @@ -12,6 +13,7 @@ module.exports = { 'util.ts', ], 'reporters': [ - 'util.ts' + '../types/testReporter.d.ts', + 'util.ts', ], }; diff --git a/packages/playwright-test/src/mount.ts b/packages/playwright-test/src/mount.ts index 14baccf96a..62664d893f 100644 --- a/packages/playwright-test/src/mount.ts +++ b/packages/playwright-test/src/mount.ts @@ -14,7 +14,7 @@ * limitations under the License. */ -import { Page } from '@playwright/test'; +import type { Page } from '@playwright/test'; import { createGuid } from 'playwright-core/lib/utils/utils'; export async function mount(page: Page, jsxOrType: any, options: any): Promise { diff --git a/packages/recorder/.gitignore b/packages/recorder/.gitignore new file mode 100644 index 0000000000..a547bf36d8 --- /dev/null +++ b/packages/recorder/.gitignore @@ -0,0 +1,24 @@ +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* +lerna-debug.log* + +node_modules +dist +dist-ssr +*.local + +# Editor directories and files +.vscode/* +!.vscode/extensions.json +.idea +.DS_Store +*.suo +*.ntvs* +*.njsproj +*.sln +*.sw? diff --git a/packages/playwright-core/src/web/recorder/index.html b/packages/recorder/index.html similarity index 72% rename from packages/playwright-core/src/web/recorder/index.html rename to packages/recorder/index.html index dc369e7624..2add6860ca 100644 --- a/packages/playwright-core/src/web/recorder/index.html +++ b/packages/recorder/index.html @@ -13,15 +13,18 @@ See the License for the specific language governing permissions and limitations under the License. --> - - + + + + Playwright Inspector -
+
+ diff --git a/packages/recorder/package.json b/packages/recorder/package.json new file mode 100644 index 0000000000..0641d13367 --- /dev/null +++ b/packages/recorder/package.json @@ -0,0 +1,10 @@ +{ + "name": "recorder", + "private": true, + "version": "0.0.0", + "scripts": { + "dev": "vite", + "build": "vite build && tsc", + "preview": "vite preview" + } +} diff --git a/packages/playwright-core/src/web/traceViewer/static/icon-16x16.png b/packages/recorder/public/icon-16x16.png similarity index 100% rename from packages/playwright-core/src/web/traceViewer/static/icon-16x16.png rename to packages/recorder/public/icon-16x16.png diff --git a/packages/playwright-core/src/web/traceViewer/static/icon-192x192.png b/packages/recorder/public/icon-192x192.png similarity index 100% rename from packages/playwright-core/src/web/traceViewer/static/icon-192x192.png rename to packages/recorder/public/icon-192x192.png diff --git a/packages/playwright-core/src/web/traceViewer/static/icon-256x256.png b/packages/recorder/public/icon-256x256.png similarity index 100% rename from packages/playwright-core/src/web/traceViewer/static/icon-256x256.png rename to packages/recorder/public/icon-256x256.png diff --git a/packages/playwright-core/src/web/traceViewer/static/icon-32x32.png b/packages/recorder/public/icon-32x32.png similarity index 100% rename from packages/playwright-core/src/web/traceViewer/static/icon-32x32.png rename to packages/recorder/public/icon-32x32.png diff --git a/packages/playwright-core/src/web/traceViewer/static/icon-384x384.png b/packages/recorder/public/icon-384x384.png similarity index 100% rename from packages/playwright-core/src/web/traceViewer/static/icon-384x384.png rename to packages/recorder/public/icon-384x384.png diff --git a/packages/playwright-core/src/web/traceViewer/static/icon-512x512.png b/packages/recorder/public/icon-512x512.png similarity index 100% rename from packages/playwright-core/src/web/traceViewer/static/icon-512x512.png rename to packages/recorder/public/icon-512x512.png diff --git a/packages/recorder/public/manifest.webmanifest b/packages/recorder/public/manifest.webmanifest new file mode 100644 index 0000000000..5756cb3b7e --- /dev/null +++ b/packages/recorder/public/manifest.webmanifest @@ -0,0 +1,30 @@ +{ + "theme_color": "#000", + "background_color": "#fff", + "display": "browser", + "start_url": "index.html", + "name": "Playwright Inspector", + "short_name": "Playwright Inspector", + "icons": [ + { + "src": "icon-192x192.png", + "sizes": "192x192", + "type": "image/png" + }, + { + "src": "icon-256x256.png", + "sizes": "256x256", + "type": "image/png" + }, + { + "src": "icon-384x384.png", + "sizes": "384x384", + "type": "image/png" + }, + { + "src": "icon-512x512.png", + "sizes": "512x512", + "type": "image/png" + } + ] +} diff --git a/packages/recorder/src/DEPS b/packages/recorder/src/DEPS new file mode 100644 index 0000000000..1949198364 --- /dev/null +++ b/packages/recorder/src/DEPS @@ -0,0 +1,5 @@ +module.exports = { + '/': [ + '@web/**' + ] +}; diff --git a/packages/playwright-core/src/web/recorder/callLog.css b/packages/recorder/src/callLog.css similarity index 100% rename from packages/playwright-core/src/web/recorder/callLog.css rename to packages/recorder/src/callLog.css diff --git a/packages/playwright-core/src/web/recorder/callLog.tsx b/packages/recorder/src/callLog.tsx similarity index 95% rename from packages/playwright-core/src/web/recorder/callLog.tsx rename to packages/recorder/src/callLog.tsx index 5c7afed250..c5feb2b751 100644 --- a/packages/playwright-core/src/web/recorder/callLog.tsx +++ b/packages/recorder/src/callLog.tsx @@ -16,8 +16,8 @@ import './callLog.css'; import * as React from 'react'; -import type { CallLog } from '../../server/supplements/recorder/recorderTypes'; -import { msToString } from '../uiUtils'; +import type { CallLog } from '@playwright-core/server/supplements/recorder/recorderTypes'; +import { msToString } from '@web/uiUtils'; export interface CallLogProps { log: CallLog[], diff --git a/packages/playwright-core/src/web/recorder/index.tsx b/packages/recorder/src/index.tsx similarity index 87% rename from packages/playwright-core/src/web/recorder/index.tsx rename to packages/recorder/src/index.tsx index d82790f2c3..9d55f8608a 100644 --- a/packages/playwright-core/src/web/recorder/index.tsx +++ b/packages/recorder/src/index.tsx @@ -14,11 +14,11 @@ * limitations under the License. */ -import '../third_party/vscode/codicon.css'; +import '@web/common.css'; +import { applyTheme } from '@web/theme'; +import '@web/third_party/vscode/codicon.css'; import * as React from 'react'; import * as ReactDOM from 'react-dom'; -import { applyTheme } from '../theme'; -import '../common.css'; import { Main } from './main'; (async () => { diff --git a/packages/playwright-core/src/web/recorder/main.tsx b/packages/recorder/src/main.tsx similarity index 94% rename from packages/playwright-core/src/web/recorder/main.tsx rename to packages/recorder/src/main.tsx index 05ab7b7328..e1dfc3b155 100644 --- a/packages/playwright-core/src/web/recorder/main.tsx +++ b/packages/recorder/src/main.tsx @@ -14,10 +14,10 @@ limitations under the License. */ -import './recorder.css'; +import type { CallLog, Mode, Source } from '@playwright-core/server/supplements/recorder/recorderTypes'; import * as React from 'react'; -import type { CallLog, Mode, Source } from '../../server/supplements/recorder/recorderTypes'; import { Recorder } from './recorder'; +import './recorder.css'; declare global { interface Window { diff --git a/packages/playwright-core/src/web/recorder/recorder.css b/packages/recorder/src/recorder.css similarity index 100% rename from packages/playwright-core/src/web/recorder/recorder.css rename to packages/recorder/src/recorder.css diff --git a/packages/playwright-core/src/web/recorder/recorder.tsx b/packages/recorder/src/recorder.tsx similarity index 93% rename from packages/playwright-core/src/web/recorder/recorder.tsx rename to packages/recorder/src/recorder.tsx index 10c8ea015b..dca24e35b0 100644 --- a/packages/playwright-core/src/web/recorder/recorder.tsx +++ b/packages/recorder/src/recorder.tsx @@ -14,14 +14,14 @@ limitations under the License. */ -import './recorder.css'; +import type { CallLog, Mode, Source } from '@playwright-core/server/supplements/recorder/recorderTypes'; +import { Source as SourceView } from '@web/components/source'; +import { SplitView } from '@web/components/splitView'; +import { Toolbar } from '@web/components/toolbar'; +import { ToolbarButton } from '@web/components/toolbarButton'; import * as React from 'react'; -import { Toolbar } from '../components/toolbar'; -import { ToolbarButton } from '../components/toolbarButton'; -import { Source as SourceView } from '../components/source'; -import type { CallLog, Mode, Source } from '../../server/supplements/recorder/recorderTypes'; -import { SplitView } from '../components/splitView'; import { CallLogView } from './callLog'; +import './recorder.css'; declare global { interface Window { diff --git a/packages/recorder/src/vite-env.d.ts b/packages/recorder/src/vite-env.d.ts new file mode 100644 index 0000000000..11f02fe2a0 --- /dev/null +++ b/packages/recorder/src/vite-env.d.ts @@ -0,0 +1 @@ +/// diff --git a/packages/recorder/tsconfig.json b/packages/recorder/tsconfig.json new file mode 100644 index 0000000000..fd28152728 --- /dev/null +++ b/packages/recorder/tsconfig.json @@ -0,0 +1,26 @@ +{ + "compilerOptions": { + "target": "ESNext", + "useDefineForClassFields": true, + "lib": ["DOM", "DOM.Iterable", "ESNext"], + "allowJs": true, + "skipLibCheck": false, + "esModuleInterop": false, + "allowSyntheticDefaultImports": true, + "strict": true, + "module": "ESNext", + "moduleResolution": "Node", + "resolveJsonModule": true, + "isolatedModules": true, + "noEmit": true, + "jsx": "react-jsx", + "baseUrl": ".", + "useUnknownInCatchVariables": false, + "paths": { + "@web/*": ["../web/src/*"], + "@playwright-core/*": ["../playwright-core/src/*"], + } + }, + "include": ["src"], + "references": [{ "path": "./tsconfig.node.json" }] +} diff --git a/packages/recorder/tsconfig.node.json b/packages/recorder/tsconfig.node.json new file mode 100644 index 0000000000..e993792cb1 --- /dev/null +++ b/packages/recorder/tsconfig.node.json @@ -0,0 +1,8 @@ +{ + "compilerOptions": { + "composite": true, + "module": "esnext", + "moduleResolution": "node" + }, + "include": ["vite.config.ts"] +} diff --git a/packages/recorder/vite.config.ts b/packages/recorder/vite.config.ts new file mode 100644 index 0000000000..019f44b435 --- /dev/null +++ b/packages/recorder/vite.config.ts @@ -0,0 +1,41 @@ +/** + * Copyright (c) Microsoft Corporation. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { defineConfig } from 'vite'; +import react from '@vitejs/plugin-react'; +import * as path from 'path'; + +// https://vitejs.dev/config/ +export default defineConfig({ + plugins: [ + react() + ], + resolve: { + alias: { + '@web': path.resolve(__dirname, '../web/src'), + '@playwright-core': path.resolve(__dirname, '../playwright-core/src'), + }, + }, + build: { + outDir: path.resolve(__dirname, '../playwright-core/lib/webpack/recorder'), + emptyOutDir: true, + rollupOptions: { + output: { + manualChunks: undefined, + }, + }, + } +}); diff --git a/packages/trace-viewer/.gitignore b/packages/trace-viewer/.gitignore new file mode 100644 index 0000000000..a547bf36d8 --- /dev/null +++ b/packages/trace-viewer/.gitignore @@ -0,0 +1,24 @@ +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* +lerna-debug.log* + +node_modules +dist +dist-ssr +*.local + +# Editor directories and files +.vscode/* +!.vscode/extensions.json +.idea +.DS_Store +*.suo +*.ntvs* +*.njsproj +*.sln +*.sw? diff --git a/packages/playwright-core/src/web/traceViewer/index.html b/packages/trace-viewer/index.html similarity index 72% rename from packages/playwright-core/src/web/traceViewer/index.html rename to packages/trace-viewer/index.html index 432ec31238..85ff705578 100644 --- a/packages/playwright-core/src/web/traceViewer/index.html +++ b/packages/trace-viewer/index.html @@ -13,18 +13,18 @@ See the License for the specific language governing permissions and limitations under the License. --> - - + - - - + + + Playwright Trace Viewer -
+
+ diff --git a/packages/trace-viewer/package.json b/packages/trace-viewer/package.json new file mode 100644 index 0000000000..eae4f1835c --- /dev/null +++ b/packages/trace-viewer/package.json @@ -0,0 +1,10 @@ +{ + "name": "trace-viewer", + "private": true, + "version": "0.0.0", + "scripts": { + "dev": "vite", + "build": "vite build && tsc", + "preview": "vite preview" + } +} diff --git a/packages/trace-viewer/public/icon-16x16.png b/packages/trace-viewer/public/icon-16x16.png new file mode 100644 index 0000000000..1f6c4d6c1e Binary files /dev/null and b/packages/trace-viewer/public/icon-16x16.png differ diff --git a/packages/trace-viewer/public/icon-192x192.png b/packages/trace-viewer/public/icon-192x192.png new file mode 100644 index 0000000000..a4f0dbfa96 Binary files /dev/null and b/packages/trace-viewer/public/icon-192x192.png differ diff --git a/packages/trace-viewer/public/icon-256x256.png b/packages/trace-viewer/public/icon-256x256.png new file mode 100644 index 0000000000..0eb864f739 Binary files /dev/null and b/packages/trace-viewer/public/icon-256x256.png differ diff --git a/packages/trace-viewer/public/icon-32x32.png b/packages/trace-viewer/public/icon-32x32.png new file mode 100644 index 0000000000..650be13340 Binary files /dev/null and b/packages/trace-viewer/public/icon-32x32.png differ diff --git a/packages/trace-viewer/public/icon-384x384.png b/packages/trace-viewer/public/icon-384x384.png new file mode 100644 index 0000000000..cac721050e Binary files /dev/null and b/packages/trace-viewer/public/icon-384x384.png differ diff --git a/packages/trace-viewer/public/icon-512x512.png b/packages/trace-viewer/public/icon-512x512.png new file mode 100644 index 0000000000..63c4468432 Binary files /dev/null and b/packages/trace-viewer/public/icon-512x512.png differ diff --git a/packages/playwright-core/src/web/traceViewer/static/manifest.webmanifest b/packages/trace-viewer/public/manifest.webmanifest similarity index 100% rename from packages/playwright-core/src/web/traceViewer/static/manifest.webmanifest rename to packages/trace-viewer/public/manifest.webmanifest diff --git a/packages/trace-viewer/src/DEPS b/packages/trace-viewer/src/DEPS new file mode 100644 index 0000000000..4bb77445cb --- /dev/null +++ b/packages/trace-viewer/src/DEPS @@ -0,0 +1,12 @@ +module.exports = { + '/': [ + '@web/**', + 'ui/', + ], + + 'ui/': [ + '@web/**', + 'geometry.ts', + 'entries.ts', + ] +}; diff --git a/packages/playwright-core/src/web/traceViewer/entries.ts b/packages/trace-viewer/src/entries.ts similarity index 89% rename from packages/playwright-core/src/web/traceViewer/entries.ts rename to packages/trace-viewer/src/entries.ts index 9862deafe4..8a92c8c381 100644 --- a/packages/playwright-core/src/web/traceViewer/entries.ts +++ b/packages/trace-viewer/src/entries.ts @@ -14,8 +14,8 @@ * limitations under the License. */ -import type { ResourceSnapshot } from '../../server/trace/common/snapshotTypes'; -import * as trace from '../../server/trace/common/traceEvents'; +import type { ResourceSnapshot } from '@playwright-core/server/trace/common/snapshotTypes'; +import type * as trace from '@playwright-core/server/trace/common/traceEvents'; export type ContextEntry = { traceUrl: string; diff --git a/packages/playwright-core/src/web/traceViewer/geometry.ts b/packages/trace-viewer/src/geometry.ts similarity index 100% rename from packages/playwright-core/src/web/traceViewer/geometry.ts rename to packages/trace-viewer/src/geometry.ts diff --git a/packages/playwright-core/src/web/traceViewer/index.tsx b/packages/trace-viewer/src/index.tsx similarity index 91% rename from packages/playwright-core/src/web/traceViewer/index.tsx rename to packages/trace-viewer/src/index.tsx index 3f0241c852..edb599c3dc 100644 --- a/packages/playwright-core/src/web/traceViewer/index.tsx +++ b/packages/trace-viewer/src/index.tsx @@ -14,12 +14,12 @@ * limitations under the License. */ -import '../third_party/vscode/codicon.css'; +import '@web/third_party/vscode/codicon.css'; import { Workbench } from './ui/workbench'; import * as React from 'react'; import * as ReactDOM from 'react-dom'; -import { applyTheme } from '../theme'; -import '../common.css'; +import { applyTheme } from '@web/theme'; +import '@web/common.css'; (async () => { applyTheme(); diff --git a/packages/playwright-core/src/web/traceViewer/snapshotRenderer.ts b/packages/trace-viewer/src/snapshotRenderer.ts similarity index 98% rename from packages/playwright-core/src/web/traceViewer/snapshotRenderer.ts rename to packages/trace-viewer/src/snapshotRenderer.ts index b3fef09480..bb83d888fc 100644 --- a/packages/playwright-core/src/web/traceViewer/snapshotRenderer.ts +++ b/packages/trace-viewer/src/snapshotRenderer.ts @@ -14,7 +14,7 @@ * limitations under the License. */ -import { FrameSnapshot, NodeSnapshot, RenderedFrameSnapshot, ResourceSnapshot } from '../../server/trace/common/snapshotTypes'; +import type { FrameSnapshot, NodeSnapshot, RenderedFrameSnapshot, ResourceSnapshot } from '@playwright-core/server/trace/common/snapshotTypes'; export class SnapshotRenderer { private _snapshots: FrameSnapshot[]; diff --git a/packages/playwright-core/src/web/traceViewer/snapshotServer.ts b/packages/trace-viewer/src/snapshotServer.ts similarity index 98% rename from packages/playwright-core/src/web/traceViewer/snapshotServer.ts rename to packages/trace-viewer/src/snapshotServer.ts index 2bb8ceaf8b..23d9a701e1 100644 --- a/packages/playwright-core/src/web/traceViewer/snapshotServer.ts +++ b/packages/trace-viewer/src/snapshotServer.ts @@ -15,7 +15,7 @@ */ import { SnapshotStorage } from './snapshotStorage'; -import type { Point } from '../../common/types'; +import type { Point } from '@playwright-core/common/types'; import { URLSearchParams } from 'url'; import { SnapshotRenderer } from './snapshotRenderer'; diff --git a/packages/playwright-core/src/web/traceViewer/snapshotStorage.ts b/packages/trace-viewer/src/snapshotStorage.ts similarity index 96% rename from packages/playwright-core/src/web/traceViewer/snapshotStorage.ts rename to packages/trace-viewer/src/snapshotStorage.ts index 3f3310fb72..a0e1b124f1 100644 --- a/packages/playwright-core/src/web/traceViewer/snapshotStorage.ts +++ b/packages/trace-viewer/src/snapshotStorage.ts @@ -14,8 +14,8 @@ * limitations under the License. */ +import type { FrameSnapshot, ResourceSnapshot } from '@playwright-core/server/trace/common/snapshotTypes'; import { EventEmitter } from 'events'; -import { FrameSnapshot, ResourceSnapshot } from '../../server/trace/common/snapshotTypes'; import { SnapshotRenderer } from './snapshotRenderer'; export interface SnapshotStorage { diff --git a/packages/playwright-core/src/web/traceViewer/sw.ts b/packages/trace-viewer/src/sw.ts similarity index 100% rename from packages/playwright-core/src/web/traceViewer/sw.ts rename to packages/trace-viewer/src/sw.ts diff --git a/packages/playwright-core/src/web/traceViewer/traceModel.ts b/packages/trace-viewer/src/traceModel.ts similarity index 95% rename from packages/playwright-core/src/web/traceViewer/traceModel.ts rename to packages/trace-viewer/src/traceModel.ts index 5fd6989fa8..3a09d791f4 100644 --- a/packages/playwright-core/src/web/traceViewer/traceModel.ts +++ b/packages/trace-viewer/src/traceModel.ts @@ -14,17 +14,15 @@ * limitations under the License. */ -import * as trace from '../../server/trace/common/traceEvents'; +import type { CallMetadata } from '@playwright-core/protocol/callMetadata'; +import type * as trace from '@playwright-core/server/trace/common/traceEvents'; +import type zip from '@zip.js/zip.js'; +// @ts-ignore +import zipImport from '@zip.js/zip.js/dist/zip-no-worker-inflate.min.js'; +import { ContextEntry, createEmptyContext, PageEntry } from './entries'; import { BaseSnapshotStorage } from './snapshotStorage'; -import type zip from '@zip.js/zip.js'; -import { ContextEntry, createEmptyContext, PageEntry } from './entries'; -import type { CallMetadata } from '../../protocol/callMetadata'; - -// @ts-ignore -self.importScripts('zip.min.js'); - -const zipjs = (self as any).zip as typeof zip; +const zipjs = zipImport as typeof zip; export class TraceModel { contextEntry: ContextEntry; @@ -159,7 +157,7 @@ export class TraceModel { private _modernize(event: any): trace.TraceEvent { if (this._version === undefined) return event; - for (let version = this._version; version < trace.VERSION; ++version) + for (let version = this._version; version < 3; ++version) event = (this as any)[`_modernize_${version}_to_${version + 1}`].call(this, event); return event; } diff --git a/packages/playwright-core/src/web/traceViewer/ui/actionList.css b/packages/trace-viewer/src/ui/actionList.css similarity index 100% rename from packages/playwright-core/src/web/traceViewer/ui/actionList.css rename to packages/trace-viewer/src/ui/actionList.css diff --git a/packages/playwright-core/src/web/traceViewer/ui/actionList.tsx b/packages/trace-viewer/src/ui/actionList.tsx similarity index 97% rename from packages/playwright-core/src/web/traceViewer/ui/actionList.tsx rename to packages/trace-viewer/src/ui/actionList.tsx index 4602444c96..a82af9c6c0 100644 --- a/packages/playwright-core/src/web/traceViewer/ui/actionList.tsx +++ b/packages/trace-viewer/src/ui/actionList.tsx @@ -14,12 +14,12 @@ limitations under the License. */ -import './actionList.css'; -import './tabbedPane.css'; +import type { ActionTraceEvent } from '@playwright-core/server/trace/common/traceEvents'; +import { msToString } from '@web/uiUtils'; import * as React from 'react'; +import './actionList.css'; import * as modelUtil from './modelUtil'; -import { ActionTraceEvent } from '../../../server/trace/common/traceEvents'; -import { msToString } from '../../uiUtils'; +import './tabbedPane.css'; export interface ActionListProps { actions: ActionTraceEvent[], diff --git a/packages/playwright-core/src/web/traceViewer/ui/callTab.css b/packages/trace-viewer/src/ui/callTab.css similarity index 100% rename from packages/playwright-core/src/web/traceViewer/ui/callTab.css rename to packages/trace-viewer/src/ui/callTab.css diff --git a/packages/playwright-core/src/web/traceViewer/ui/callTab.tsx b/packages/trace-viewer/src/ui/callTab.tsx similarity index 71% rename from packages/playwright-core/src/web/traceViewer/ui/callTab.tsx rename to packages/trace-viewer/src/ui/callTab.tsx index eed17514db..3f11af0ac9 100644 --- a/packages/playwright-core/src/web/traceViewer/ui/callTab.tsx +++ b/packages/trace-viewer/src/ui/callTab.tsx @@ -14,12 +14,12 @@ * limitations under the License. */ +import type { CallMetadata } from '@playwright-core/protocol/callMetadata'; +import type { SerializedValue } from '@playwright-core/protocol/channels'; +import type { ActionTraceEvent } from '@playwright-core/server/trace/common/traceEvents'; +import { msToString } from '@web/uiUtils'; import * as React from 'react'; import './callTab.css'; -import type { ActionTraceEvent } from '../../../server/trace/common/traceEvents'; -import { CallMetadata } from '../../../protocol/callMetadata'; -import { parseSerializedValue } from '../../../protocol/serializers'; -import { msToString } from '../../uiUtils'; export const CallTab: React.FunctionComponent<{ action: ActionTraceEvent | undefined, @@ -88,3 +88,44 @@ function toString(metadata: CallMetadata, name: string, value: any): { title: st return { title: '', type: 'handle' }; return { title: JSON.stringify(value), type: 'object' }; } + +function parseSerializedValue(value: SerializedValue, handles: any[] | undefined): any { + if (value.n !== undefined) + return value.n; + if (value.s !== undefined) + return value.s; + if (value.b !== undefined) + return value.b; + if (value.v !== undefined) { + if (value.v === 'undefined') + return undefined; + if (value.v === 'null') + return null; + if (value.v === 'NaN') + return NaN; + if (value.v === 'Infinity') + return Infinity; + if (value.v === '-Infinity') + return -Infinity; + if (value.v === '-0') + return -0; + } + if (value.d !== undefined) + return new Date(value.d); + if (value.r !== undefined) + return new RegExp(value.r.p, value.r.f); + if (value.a !== undefined) + return value.a.map((a: any) => parseSerializedValue(a, handles)); + if (value.o !== undefined) { + const result: any = {}; + for (const { k, v } of value.o) + result[k] = parseSerializedValue(v, handles); + return result; + } + if (value.h !== undefined) { + if (handles === undefined) + return ''; + return handles[value.h]; + } + return ''; +} diff --git a/packages/playwright-core/src/web/traceViewer/ui/consoleTab.css b/packages/trace-viewer/src/ui/consoleTab.css similarity index 100% rename from packages/playwright-core/src/web/traceViewer/ui/consoleTab.css rename to packages/trace-viewer/src/ui/consoleTab.css diff --git a/packages/playwright-core/src/web/traceViewer/ui/consoleTab.tsx b/packages/trace-viewer/src/ui/consoleTab.tsx similarity index 95% rename from packages/playwright-core/src/web/traceViewer/ui/consoleTab.tsx rename to packages/trace-viewer/src/ui/consoleTab.tsx index f6ac938b47..9ab44e0ebe 100644 --- a/packages/playwright-core/src/web/traceViewer/ui/consoleTab.tsx +++ b/packages/trace-viewer/src/ui/consoleTab.tsx @@ -14,10 +14,10 @@ * limitations under the License. */ +import type * as channels from '@playwright-core/protocol/channels'; +import type { ActionTraceEvent } from '@playwright-core/server/trace/common/traceEvents'; import * as React from 'react'; import './consoleTab.css'; -import { ActionTraceEvent } from '../../../server/trace/common/traceEvents'; -import * as channels from '../../../protocol/channels'; import * as modelUtil from './modelUtil'; export const ConsoleTab: React.FunctionComponent<{ diff --git a/packages/playwright-core/src/web/traceViewer/ui/contextSelector.css b/packages/trace-viewer/src/ui/contextSelector.css similarity index 100% rename from packages/playwright-core/src/web/traceViewer/ui/contextSelector.css rename to packages/trace-viewer/src/ui/contextSelector.css diff --git a/packages/playwright-core/src/web/traceViewer/ui/contextSelector.tsx b/packages/trace-viewer/src/ui/contextSelector.tsx similarity index 100% rename from packages/playwright-core/src/web/traceViewer/ui/contextSelector.tsx rename to packages/trace-viewer/src/ui/contextSelector.tsx diff --git a/packages/playwright-core/src/web/traceViewer/ui/filmStrip.css b/packages/trace-viewer/src/ui/filmStrip.css similarity index 100% rename from packages/playwright-core/src/web/traceViewer/ui/filmStrip.css rename to packages/trace-viewer/src/ui/filmStrip.css diff --git a/packages/playwright-core/src/web/traceViewer/ui/filmStrip.tsx b/packages/trace-viewer/src/ui/filmStrip.tsx similarity index 99% rename from packages/playwright-core/src/web/traceViewer/ui/filmStrip.tsx rename to packages/trace-viewer/src/ui/filmStrip.tsx index e58ae077f3..916350d2c7 100644 --- a/packages/playwright-core/src/web/traceViewer/ui/filmStrip.tsx +++ b/packages/trace-viewer/src/ui/filmStrip.tsx @@ -18,7 +18,7 @@ import './filmStrip.css'; import { Boundaries, Size } from '../geometry'; import * as React from 'react'; import { useMeasure } from './helpers'; -import { upperBound } from '../../uiUtils'; +import { upperBound } from '@web/uiUtils'; import { PageEntry } from '../entries'; import { MultiTraceModel } from './modelUtil'; diff --git a/packages/playwright-core/src/web/traceViewer/ui/helpers.tsx b/packages/trace-viewer/src/ui/helpers.tsx similarity index 100% rename from packages/playwright-core/src/web/traceViewer/ui/helpers.tsx rename to packages/trace-viewer/src/ui/helpers.tsx diff --git a/packages/playwright-core/src/web/traceViewer/ui/modelUtil.ts b/packages/trace-viewer/src/ui/modelUtil.ts similarity index 93% rename from packages/playwright-core/src/web/traceViewer/ui/modelUtil.ts rename to packages/trace-viewer/src/ui/modelUtil.ts index b0bcb6eb41..c156e833bf 100644 --- a/packages/playwright-core/src/web/traceViewer/ui/modelUtil.ts +++ b/packages/trace-viewer/src/ui/modelUtil.ts @@ -14,10 +14,10 @@ * limitations under the License. */ -import { ResourceSnapshot } from '../../../server/trace/common/snapshotTypes'; -import { ActionTraceEvent } from '../../../server/trace/common/traceEvents'; -import { ContextEntry, PageEntry } from '../entries'; -import * as trace from '../../../server/trace/common/traceEvents'; +import type { ResourceSnapshot } from '@playwright-core/server/trace/common/snapshotTypes'; +import type * as trace from '@playwright-core/server/trace/common/traceEvents'; +import type { ActionTraceEvent } from '@playwright-core/server/trace/common/traceEvents'; +import type { ContextEntry, PageEntry } from '../entries'; const contextSymbol = Symbol('context'); const nextSymbol = Symbol('next'); diff --git a/packages/playwright-core/src/web/traceViewer/ui/networkResourceDetails.css b/packages/trace-viewer/src/ui/networkResourceDetails.css similarity index 100% rename from packages/playwright-core/src/web/traceViewer/ui/networkResourceDetails.css rename to packages/trace-viewer/src/ui/networkResourceDetails.css diff --git a/packages/playwright-core/src/web/traceViewer/ui/networkResourceDetails.tsx b/packages/trace-viewer/src/ui/networkResourceDetails.tsx similarity index 97% rename from packages/playwright-core/src/web/traceViewer/ui/networkResourceDetails.tsx rename to packages/trace-viewer/src/ui/networkResourceDetails.tsx index 77b03a5452..18d58fccbd 100644 --- a/packages/playwright-core/src/web/traceViewer/ui/networkResourceDetails.tsx +++ b/packages/trace-viewer/src/ui/networkResourceDetails.tsx @@ -14,10 +14,10 @@ * limitations under the License. */ -import './networkResourceDetails.css'; +import type { ResourceSnapshot } from '@playwright-core/server/trace/common/snapshotTypes'; +import { Expandable } from '@web/components/expandable'; import * as React from 'react'; -import type { ResourceSnapshot } from '../../../server/trace/common/snapshotTypes'; -import { Expandable } from '../../components/expandable'; +import './networkResourceDetails.css'; export const NetworkResourceDetails: React.FunctionComponent<{ resource: ResourceSnapshot, diff --git a/packages/playwright-core/src/web/traceViewer/ui/networkTab.css b/packages/trace-viewer/src/ui/networkTab.css similarity index 100% rename from packages/playwright-core/src/web/traceViewer/ui/networkTab.css rename to packages/trace-viewer/src/ui/networkTab.css diff --git a/packages/playwright-core/src/web/traceViewer/ui/networkTab.tsx b/packages/trace-viewer/src/ui/networkTab.tsx similarity index 93% rename from packages/playwright-core/src/web/traceViewer/ui/networkTab.tsx rename to packages/trace-viewer/src/ui/networkTab.tsx index 975a6071de..4a6d32fa33 100644 --- a/packages/playwright-core/src/web/traceViewer/ui/networkTab.tsx +++ b/packages/trace-viewer/src/ui/networkTab.tsx @@ -15,7 +15,7 @@ */ import * as React from 'react'; -import { ActionTraceEvent } from '../../../server/trace/common/traceEvents'; +import type { ActionTraceEvent } from '@playwright-core/server/trace/common/traceEvents'; import * as modelUtil from './modelUtil'; import { NetworkResourceDetails } from './networkResourceDetails'; import './networkTab.css'; diff --git a/packages/playwright-core/src/web/traceViewer/ui/snapshotTab.css b/packages/trace-viewer/src/ui/snapshotTab.css similarity index 100% rename from packages/playwright-core/src/web/traceViewer/ui/snapshotTab.css rename to packages/trace-viewer/src/ui/snapshotTab.css diff --git a/packages/playwright-core/src/web/traceViewer/ui/snapshotTab.tsx b/packages/trace-viewer/src/ui/snapshotTab.tsx similarity index 98% rename from packages/playwright-core/src/web/traceViewer/ui/snapshotTab.tsx rename to packages/trace-viewer/src/ui/snapshotTab.tsx index ef1eb398d8..944ba61f8a 100644 --- a/packages/playwright-core/src/web/traceViewer/ui/snapshotTab.tsx +++ b/packages/trace-viewer/src/ui/snapshotTab.tsx @@ -18,7 +18,7 @@ import './snapshotTab.css'; import './tabbedPane.css'; import * as React from 'react'; import { useMeasure } from './helpers'; -import { ActionTraceEvent } from '../../../server/trace/common/traceEvents'; +import type { ActionTraceEvent } from '@playwright-core/server/trace/common/traceEvents'; import { context } from './modelUtil'; export const SnapshotTab: React.FunctionComponent<{ diff --git a/packages/playwright-core/src/web/traceViewer/ui/sourceTab.css b/packages/trace-viewer/src/ui/sourceTab.css similarity index 100% rename from packages/playwright-core/src/web/traceViewer/ui/sourceTab.css rename to packages/trace-viewer/src/ui/sourceTab.css diff --git a/packages/playwright-core/src/web/traceViewer/ui/sourceTab.tsx b/packages/trace-viewer/src/ui/sourceTab.tsx similarity index 90% rename from packages/playwright-core/src/web/traceViewer/ui/sourceTab.tsx rename to packages/trace-viewer/src/ui/sourceTab.tsx index a0e6e1bcfd..c75bf28fdb 100644 --- a/packages/playwright-core/src/web/traceViewer/ui/sourceTab.tsx +++ b/packages/trace-viewer/src/ui/sourceTab.tsx @@ -14,15 +14,15 @@ * limitations under the License. */ +import type { StackFrame } from '@playwright-core/protocol/channels'; +import type { ActionTraceEvent } from '@playwright-core/server/trace/common/traceEvents'; +import { Source as SourceView } from '@web/components/source'; +import { SplitView } from '@web/components/splitView'; +import '@web/third_party/highlightjs/highlightjs/tomorrow.css'; import * as React from 'react'; import { useAsyncMemo } from './helpers'; import './sourceTab.css'; -import '../../../third_party/highlightjs/highlightjs/tomorrow.css'; -import { Source as SourceView } from '../../components/source'; import { StackTraceView } from './stackTrace'; -import { SplitView } from '../../components/splitView'; -import { ActionTraceEvent } from '../../../server/trace/common/traceEvents'; -import { StackFrame } from '../../../protocol/channels'; type StackInfo = string | { frames: StackFrame[]; diff --git a/packages/playwright-core/src/web/traceViewer/ui/stackTrace.css b/packages/trace-viewer/src/ui/stackTrace.css similarity index 100% rename from packages/playwright-core/src/web/traceViewer/ui/stackTrace.css rename to packages/trace-viewer/src/ui/stackTrace.css diff --git a/packages/playwright-core/src/web/traceViewer/ui/stackTrace.tsx b/packages/trace-viewer/src/ui/stackTrace.tsx similarity index 94% rename from packages/playwright-core/src/web/traceViewer/ui/stackTrace.tsx rename to packages/trace-viewer/src/ui/stackTrace.tsx index 0e1d3f34f2..ea650459f4 100644 --- a/packages/playwright-core/src/web/traceViewer/ui/stackTrace.tsx +++ b/packages/trace-viewer/src/ui/stackTrace.tsx @@ -16,7 +16,7 @@ import * as React from 'react'; import './stackTrace.css'; -import { ActionTraceEvent } from '../../../server/trace/common/traceEvents'; +import type { ActionTraceEvent } from '@playwright-core/server/trace/common/traceEvents'; export const StackTraceView: React.FunctionComponent<{ action: ActionTraceEvent | undefined, diff --git a/packages/playwright-core/src/web/traceViewer/ui/tabbedPane.css b/packages/trace-viewer/src/ui/tabbedPane.css similarity index 100% rename from packages/playwright-core/src/web/traceViewer/ui/tabbedPane.css rename to packages/trace-viewer/src/ui/tabbedPane.css diff --git a/packages/playwright-core/src/web/traceViewer/ui/tabbedPane.tsx b/packages/trace-viewer/src/ui/tabbedPane.tsx similarity index 100% rename from packages/playwright-core/src/web/traceViewer/ui/tabbedPane.tsx rename to packages/trace-viewer/src/ui/tabbedPane.tsx diff --git a/packages/playwright-core/src/web/traceViewer/ui/timeline.css b/packages/trace-viewer/src/ui/timeline.css similarity index 100% rename from packages/playwright-core/src/web/traceViewer/ui/timeline.css rename to packages/trace-viewer/src/ui/timeline.css diff --git a/packages/playwright-core/src/web/traceViewer/ui/timeline.tsx b/packages/trace-viewer/src/ui/timeline.tsx similarity index 98% rename from packages/playwright-core/src/web/traceViewer/ui/timeline.tsx rename to packages/trace-viewer/src/ui/timeline.tsx index a016700da4..153f2013b3 100644 --- a/packages/playwright-core/src/web/traceViewer/ui/timeline.tsx +++ b/packages/trace-viewer/src/ui/timeline.tsx @@ -15,9 +15,9 @@ limitations under the License. */ +import type { ActionTraceEvent } from '@playwright-core/server/trace/common/traceEvents'; +import { msToString } from '@web/uiUtils'; import * as React from 'react'; -import { ActionTraceEvent } from '../../../server/trace/common/traceEvents'; -import { msToString } from '../../uiUtils'; import { Boundaries } from '../geometry'; import { FilmStrip } from './filmStrip'; import { useMeasure } from './helpers'; diff --git a/packages/playwright-core/src/web/traceViewer/ui/workbench.css b/packages/trace-viewer/src/ui/workbench.css similarity index 100% rename from packages/playwright-core/src/web/traceViewer/ui/workbench.css rename to packages/trace-viewer/src/ui/workbench.css diff --git a/packages/playwright-core/src/web/traceViewer/ui/workbench.tsx b/packages/trace-viewer/src/ui/workbench.tsx similarity index 98% rename from packages/playwright-core/src/web/traceViewer/ui/workbench.tsx rename to packages/trace-viewer/src/ui/workbench.tsx index 5206530166..2f1b85054a 100644 --- a/packages/playwright-core/src/web/traceViewer/ui/workbench.tsx +++ b/packages/trace-viewer/src/ui/workbench.tsx @@ -14,22 +14,22 @@ limitations under the License. */ -import { ActionTraceEvent } from '../../../server/trace/common/traceEvents'; +import type { ActionTraceEvent } from '@playwright-core/server/trace/common/traceEvents'; +import { SplitView } from '@web/components/splitView'; +import { msToString } from '@web/uiUtils'; +import * as React from 'react'; import { ContextEntry } from '../entries'; import { ActionList } from './actionList'; +import { CallTab } from './callTab'; +import { ConsoleTab } from './consoleTab'; +import * as modelUtil from './modelUtil'; +import { MultiTraceModel } from './modelUtil'; +import { NetworkTab } from './networkTab'; +import { SnapshotTab } from './snapshotTab'; +import { SourceTab } from './sourceTab'; import { TabbedPane } from './tabbedPane'; import { Timeline } from './timeline'; import './workbench.css'; -import * as React from 'react'; -import { NetworkTab } from './networkTab'; -import { SourceTab } from './sourceTab'; -import { SnapshotTab } from './snapshotTab'; -import { CallTab } from './callTab'; -import { SplitView } from '../../components/splitView'; -import { ConsoleTab } from './consoleTab'; -import * as modelUtil from './modelUtil'; -import { msToString } from '../../uiUtils'; -import { MultiTraceModel } from './modelUtil'; export const Workbench: React.FunctionComponent<{ }> = () => { diff --git a/packages/trace-viewer/src/vite-env.d.ts b/packages/trace-viewer/src/vite-env.d.ts new file mode 100644 index 0000000000..11f02fe2a0 --- /dev/null +++ b/packages/trace-viewer/src/vite-env.d.ts @@ -0,0 +1 @@ +/// diff --git a/packages/trace-viewer/tsconfig.json b/packages/trace-viewer/tsconfig.json new file mode 100644 index 0000000000..69193c83c8 --- /dev/null +++ b/packages/trace-viewer/tsconfig.json @@ -0,0 +1,26 @@ +{ + "compilerOptions": { + "target": "ESNext", + "useDefineForClassFields": true, + "lib": ["DOM", "DOM.Iterable", "ESNext"], + "allowJs": true, + "skipLibCheck": false, + "esModuleInterop": false, + "allowSyntheticDefaultImports": true, + "strict": true, + "module": "ESNext", + "moduleResolution": "Node", + "resolveJsonModule": true, + "isolatedModules": true, + "noEmit": true, + "jsx": "react-jsx", + "baseUrl": ".", + "paths": { + "@web/*": ["../web/src/*"], + "@playwright-core/*": ["../playwright-core/src/*"], + }, + "useUnknownInCatchVariables": false, + }, + "include": ["src"], + "references": [{ "path": "./tsconfig.node.json" }] +} diff --git a/packages/trace-viewer/tsconfig.node.json b/packages/trace-viewer/tsconfig.node.json new file mode 100644 index 0000000000..e993792cb1 --- /dev/null +++ b/packages/trace-viewer/tsconfig.node.json @@ -0,0 +1,8 @@ +{ + "compilerOptions": { + "composite": true, + "module": "esnext", + "moduleResolution": "node" + }, + "include": ["vite.config.ts"] +} diff --git a/packages/trace-viewer/vite.config.ts b/packages/trace-viewer/vite.config.ts new file mode 100644 index 0000000000..0390ff25a9 --- /dev/null +++ b/packages/trace-viewer/vite.config.ts @@ -0,0 +1,48 @@ +/** + * Copyright (c) Microsoft Corporation. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { defineConfig } from 'vite'; +import react from '@vitejs/plugin-react'; +import * as path from 'path'; + +// https://vitejs.dev/config/ +export default defineConfig({ + base: '/trace/', + plugins: [ + react() + ], + resolve: { + alias: { + '@web': path.resolve(__dirname, '../web/src'), + '@playwright-core': path.resolve(__dirname, '../playwright-core/src'), + }, + }, + build: { + outDir: path.resolve(__dirname, '../playwright-core/lib/webpack/traceViewer'), + emptyOutDir: true, + rollupOptions: { + input: { + main: path.resolve(__dirname, 'index.html'), + sw: path.resolve(__dirname, 'src/sw.ts'), + }, + output: { + entryFileNames: info => info.name === 'sw' ? '[name].bundle.js' : '[name].[hash].js', + assetFileNames: () => '[name].[hash][extname]', + manualChunks: undefined, + }, + }, + } +}); diff --git a/packages/playwright-core/src/web/common.css b/packages/web/src/common.css similarity index 100% rename from packages/playwright-core/src/web/common.css rename to packages/web/src/common.css diff --git a/packages/playwright-core/src/web/components/expandable.tsx b/packages/web/src/components/expandable.tsx similarity index 100% rename from packages/playwright-core/src/web/components/expandable.tsx rename to packages/web/src/components/expandable.tsx diff --git a/packages/playwright-core/src/web/components/source.css b/packages/web/src/components/source.css similarity index 100% rename from packages/playwright-core/src/web/components/source.css rename to packages/web/src/components/source.css diff --git a/packages/playwright-core/src/web/components/source.tsx b/packages/web/src/components/source.tsx similarity index 94% rename from packages/playwright-core/src/web/components/source.tsx rename to packages/web/src/components/source.tsx index 7d3dee3a5a..ea8c9087d0 100644 --- a/packages/playwright-core/src/web/components/source.tsx +++ b/packages/web/src/components/source.tsx @@ -16,8 +16,8 @@ import './source.css'; import * as React from 'react'; -import * as highlightjs from '../../third_party/highlightjs/highlightjs'; -import '../../third_party/highlightjs/highlightjs/tomorrow.css'; +import highlightjs from '../third_party/highlightjs/highlightjs'; +import '../third_party/highlightjs/highlightjs/tomorrow.css'; export type SourceHighlight = { line: number; diff --git a/packages/playwright-core/src/web/components/splitView.css b/packages/web/src/components/splitView.css similarity index 100% rename from packages/playwright-core/src/web/components/splitView.css rename to packages/web/src/components/splitView.css diff --git a/packages/playwright-core/src/web/components/splitView.tsx b/packages/web/src/components/splitView.tsx similarity index 100% rename from packages/playwright-core/src/web/components/splitView.tsx rename to packages/web/src/components/splitView.tsx diff --git a/packages/playwright-core/src/web/components/toolbar.css b/packages/web/src/components/toolbar.css similarity index 100% rename from packages/playwright-core/src/web/components/toolbar.css rename to packages/web/src/components/toolbar.css diff --git a/packages/playwright-core/src/web/components/toolbar.tsx b/packages/web/src/components/toolbar.tsx similarity index 100% rename from packages/playwright-core/src/web/components/toolbar.tsx rename to packages/web/src/components/toolbar.tsx diff --git a/packages/playwright-core/src/web/components/toolbarButton.css b/packages/web/src/components/toolbarButton.css similarity index 100% rename from packages/playwright-core/src/web/components/toolbarButton.css rename to packages/web/src/components/toolbarButton.css diff --git a/packages/playwright-core/src/web/components/toolbarButton.tsx b/packages/web/src/components/toolbarButton.tsx similarity index 100% rename from packages/playwright-core/src/web/components/toolbarButton.tsx rename to packages/web/src/components/toolbarButton.tsx diff --git a/packages/playwright-core/src/web/theme.ts b/packages/web/src/theme.ts similarity index 100% rename from packages/playwright-core/src/web/theme.ts rename to packages/web/src/theme.ts diff --git a/packages/playwright-core/src/third_party/highlightjs/README.md b/packages/web/src/third_party/highlightjs/README.md similarity index 100% rename from packages/playwright-core/src/third_party/highlightjs/README.md rename to packages/web/src/third_party/highlightjs/README.md diff --git a/packages/playwright-core/src/third_party/highlightjs/highlightjs/LICENSE b/packages/web/src/third_party/highlightjs/highlightjs/LICENSE similarity index 100% rename from packages/playwright-core/src/third_party/highlightjs/highlightjs/LICENSE rename to packages/web/src/third_party/highlightjs/highlightjs/LICENSE diff --git a/packages/playwright-core/src/third_party/highlightjs/highlightjs/core.js b/packages/web/src/third_party/highlightjs/highlightjs/core.js similarity index 99% rename from packages/playwright-core/src/third_party/highlightjs/highlightjs/core.js rename to packages/web/src/third_party/highlightjs/highlightjs/core.js index 59d131b1f3..726d7dd1a7 100644 --- a/packages/playwright-core/src/third_party/highlightjs/highlightjs/core.js +++ b/packages/web/src/third_party/highlightjs/highlightjs/core.js @@ -2373,6 +2373,4 @@ const HLJS = function(hljs) { }; // export an "instance" of the highlighter -var highlight = HLJS({}); - -module.exports = highlight; +export default HLJS({}); diff --git a/packages/playwright-core/src/third_party/highlightjs/highlightjs/index.d.ts b/packages/web/src/third_party/highlightjs/highlightjs/index.d.ts similarity index 100% rename from packages/playwright-core/src/third_party/highlightjs/highlightjs/index.d.ts rename to packages/web/src/third_party/highlightjs/highlightjs/index.d.ts diff --git a/packages/web/src/third_party/highlightjs/highlightjs/index.js b/packages/web/src/third_party/highlightjs/highlightjs/index.js new file mode 100644 index 0000000000..82a7cf373b --- /dev/null +++ b/packages/web/src/third_party/highlightjs/highlightjs/index.js @@ -0,0 +1,12 @@ +import core from './core'; +import javascript from './languages/javascript'; +import python from './languages/python'; +import csharp from './languages/csharp'; +import java from './languages/java'; + +core.registerLanguage('javascript', javascript); +core.registerLanguage('python', python); +core.registerLanguage('csharp', csharp); +core.registerLanguage('java', java); + +export default core; diff --git a/packages/playwright-core/src/third_party/highlightjs/highlightjs/languages/csharp.js b/packages/web/src/third_party/highlightjs/highlightjs/languages/csharp.js similarity index 99% rename from packages/playwright-core/src/third_party/highlightjs/highlightjs/languages/csharp.js rename to packages/web/src/third_party/highlightjs/highlightjs/languages/csharp.js index 6474f2e94d..9e3f9db456 100644 --- a/packages/playwright-core/src/third_party/highlightjs/highlightjs/languages/csharp.js +++ b/packages/web/src/third_party/highlightjs/highlightjs/languages/csharp.js @@ -7,7 +7,7 @@ Category: common */ /** @type LanguageFn */ -function csharp(hljs) { +export default function csharp(hljs) { var BUILT_IN_KEYWORDS = [ 'bool', 'byte', @@ -363,5 +363,3 @@ function csharp(hljs) { ] }; } - -module.exports = csharp; diff --git a/packages/playwright-core/src/third_party/highlightjs/highlightjs/languages/java.js b/packages/web/src/third_party/highlightjs/highlightjs/languages/java.js similarity index 99% rename from packages/playwright-core/src/third_party/highlightjs/highlightjs/languages/java.js rename to packages/web/src/third_party/highlightjs/highlightjs/languages/java.js index 39170e511b..408074fe91 100644 --- a/packages/playwright-core/src/third_party/highlightjs/highlightjs/languages/java.js +++ b/packages/web/src/third_party/highlightjs/highlightjs/languages/java.js @@ -40,7 +40,7 @@ Category: common, enterprise Website: https://www.java.com/ */ -function java(hljs) { +export default function java(hljs) { var JAVA_IDENT_RE = '[\u00C0-\u02B8a-zA-Z_$][\u00C0-\u02B8a-zA-Z_$0-9]*'; var GENERIC_IDENT_RE = JAVA_IDENT_RE + '(<' + JAVA_IDENT_RE + '(\\s*,\\s*' + JAVA_IDENT_RE + ')*>)?'; var KEYWORDS = 'false synchronized int abstract float private char boolean var static null if const ' + @@ -172,5 +172,3 @@ function java(hljs) { ] }; } - -module.exports = java; diff --git a/packages/playwright-core/src/third_party/highlightjs/highlightjs/languages/javascript.js b/packages/web/src/third_party/highlightjs/highlightjs/languages/javascript.js similarity index 99% rename from packages/playwright-core/src/third_party/highlightjs/highlightjs/languages/javascript.js rename to packages/web/src/third_party/highlightjs/highlightjs/languages/javascript.js index f2a9e575fe..ee07a8baed 100644 --- a/packages/playwright-core/src/third_party/highlightjs/highlightjs/languages/javascript.js +++ b/packages/web/src/third_party/highlightjs/highlightjs/languages/javascript.js @@ -177,7 +177,7 @@ Website: https://developer.mozilla.org/en-US/docs/Web/JavaScript */ /** @type LanguageFn */ -function javascript(hljs) { +export default function javascript(hljs) { /** * Takes a string like "({ snapshotter: async ({ mode, toImpl, context }, run, testInfo) => { diff --git a/tests/tsconfig.json b/tests/tsconfig.json index 47b0c03736..55a01b2c71 100644 --- a/tests/tsconfig.json +++ b/tests/tsconfig.json @@ -9,6 +9,10 @@ "strictBindCallApply": true, "allowSyntheticDefaultImports": true, "useUnknownInCatchVariables": false, + "baseUrl": ".", + "paths": { + "@playwright-core/*": ["../packages/playwright-core/src/*"], + }, }, "include": ["**/*.spec.js", "**/*.ts", "index.d.ts"], "exclude": ["playwright-test/"] diff --git a/tsconfig.json b/tsconfig.json index 18af9593ce..3bdeb59f29 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -5,6 +5,12 @@ "lib": ["esnext", "dom", "DOM.Iterable"], "baseUrl": ".", "paths": { + /* + The following two serve different purposes: + - @playwright-core is for importing types only, + - playwright-core/lib means require dependency + */ + "@playwright-core/*": ["./packages/playwright-core/src/*"], "playwright-core/lib/*": ["./packages/playwright-core/src/*"] }, "esModuleInterop": true, @@ -20,5 +26,8 @@ "include": ["packages"], "exclude": [ "packages/*/lib", + "packages/recorder", + "packages/trace-viewer", + "packages/web", ], } diff --git a/utils/build/build.js b/utils/build/build.js index f71101f468..4d957996e5 100644 --- a/utils/build/build.js +++ b/utils/build/build.js @@ -46,7 +46,10 @@ const { workspace } = require('../workspace'); * committed: boolean, * inputs: string[], * mustExist?: string[], - * script: string, + * script?: string, + * command?: string, + * args?: string[], + * cwd?: string, * }} OnChange */ @@ -78,24 +81,29 @@ function quotePath(path) { } async function runWatch() { - function runOnChanges(paths, mustExist = [], nodeFile) { - nodeFile = filePath(nodeFile); + /** @param {OnChange} onChange */ + function runOnChange(onChange) { + const paths = onChange.inputs; + const mustExist = onChange.mustExist || []; let timeout; - const callback = () => { + function callback() { timeout = undefined; for (const fileMustExist of mustExist) { if (!fs.existsSync(filePath(fileMustExist))) return; } - child_process.spawnSync('node', [nodeFile], { stdio: 'inherit' }); - }; + if (onChange.script) + child_process.spawnSync('node', [onChange.script], { stdio: 'inherit' }); + else + child_process.spawnSync(onChange.command, onChange.args || [], { stdio: 'inherit', cwd: onChange.cwd }); + } // chokidar will report all files as added in a sync loop, throttle those. const reschedule = () => { if (timeout) clearTimeout(timeout); timeout = setTimeout(callback, 500); }; - chokidar.watch([...paths, ...mustExist, nodeFile].map(filePath)).on('all', reschedule); + chokidar.watch([...paths, ...mustExist, onChange.script].filter(Boolean).map(filePath)).on('all', reschedule); callback(); } @@ -119,7 +127,7 @@ async function runWatch() { })); process.on('exit', () => spawns.forEach(s => s.kill())); for (const onChange of onChanges) - runOnChanges(onChange.inputs, onChange.mustExist, onChange.script); + runOnChange(onChange); } async function runBuild() { @@ -153,8 +161,12 @@ async function runBuild() { for (const step of steps) runStep(step); for (const onChange of onChanges) { - if (!onChange.committed) + if (onChange.committed) + continue; + if (onChange.script) runStep({ command: 'node', args: [filePath(onChange.script)], shell: false }); + else + runStep({ command: onChange.command, args: onChange.args, shell: false, cwd: onChange.cwd }); } } @@ -180,9 +192,6 @@ steps.push({ // Build injected scripts. const webPackFiles = [ 'packages/playwright-core/src/server/injected/webpack.config.js', - 'packages/playwright-core/src/web/traceViewer/webpack.config.js', - 'packages/playwright-core/src/web/traceViewer/webpack-sw.config.js', - 'packages/playwright-core/src/web/recorder/webpack.config.js', 'packages/html-reporter/webpack.config.js', 'packages/html-reporter/tests/webpack.config.js', ]; @@ -244,6 +253,35 @@ onChanges.push({ script: 'utils/generate_types/index.js', }); +// Update web clients. +onChanges.push({ + committed: false, + inputs: [ + 'packages/trace-viewer/index.html', + 'packages/trace-viewer/pubic/', + 'packages/trace-viewer/src/', + 'packages/trace-viewer/view.config.ts', + 'packages/web/src/', + ], + command: 'npx', + args: ['vite', 'build'], + cwd: 'packages/trace-viewer', +}); + +onChanges.push({ + committed: false, + inputs: [ + 'packages/recorder/index.html', + 'packages/recorder/pubic/', + 'packages/recorder/src/', + 'packages/recorder/view.config.ts', + 'packages/web/src/', + ], + command: 'npx', + args: ['vite', 'build'], + cwd: 'packages/recorder', +}); + // The recorder and trace viewer have an app_icon.png that needs to be copied. copyFiles.push({ files: 'packages/playwright-core/src/server/chromium/*.png', @@ -277,12 +315,22 @@ copyFiles.push({ }); if (lintMode) { - // Run TypeScript for type chekcing. + // Run TypeScript for type checking. steps.push({ command: 'npx', args: ['tsc', ...(watchMode ? ['-w'] : []), '-p', quotePath(filePath('.'))], shell: true, }); + steps.push({ + command: 'npx', + args: ['tsc', ...(watchMode ? ['-w'] : []), '-p', quotePath(filePath('packages/recorder'))], + shell: true, + }); + steps.push({ + command: 'npx', + args: ['tsc', ...(watchMode ? ['-w'] : []), '-p', quotePath(filePath('packages/trace-viewer'))], + shell: true, + }); } watchMode ? runWatch() : runBuild(); diff --git a/utils/check_deps.js b/utils/check_deps.js index 660773a1b9..31b5de466e 100644 --- a/utils/check_deps.js +++ b/utils/check_deps.js @@ -24,9 +24,12 @@ const path = require('path'); const packagesDir = path.normalize(path.join(__dirname, '..', 'packages')); const packages = fs.readdirSync(packagesDir); -const peerDependencies = ['electron', 'react', 'react-dom']; +const peerDependencies = ['electron', 'react', 'react-dom', '@zip.js/zip.js']; async function checkDeps() { + await innerCheckDeps(path.join(packagesDir, 'recorder'), true, true); + await innerCheckDeps(path.join(packagesDir, 'trace-viewer'), true, true); + const corePackageJson = await innerCheckDeps(path.join(packagesDir, 'playwright-core'), true, true); const testPackageJson = await innerCheckDeps(path.join(packagesDir, 'playwright-test'), true, true); @@ -115,6 +118,8 @@ async function innerCheckDeps(root, checkDepsFile, checkPackageJson) { importPath = importPath + '.ts'; else if (fs.existsSync(importPath + '.tsx')) importPath = importPath + '.tsx'; + else if (fs.existsSync(importPath + '.d.ts')) + importPath = importPath + '.d.ts'; } if (checkDepsFile && !allowImport(depsFile, fileName, importPath)) @@ -134,8 +139,6 @@ async function innerCheckDeps(root, checkDepsFile, checkPackageJson) { } function allowImport(depsFile, from, to) { - if (!to.startsWith(src + path.sep)) - return true; const fromDirectory = path.dirname(from); const toDirectory = path.dirname(to); if (fromDirectory === toDirectory)