Chore: Migrate build to vite (#1033)
* Chore: Add move most types from rrweb to @rrweb/types package * Split off type imports * Split off type import to its own line * Get vite to generate type definitions * Apply formatting changes * noEmit not allowed in tsconfig, moved it to build step * Migrate rrdom-nodejs build to vite * Apply formatting changes * Migrate rrweb-snapshot to vite * Unify configs * Chore: Migrate rrdom to vite Turns out what we where doing by overwriting `public textContent: string | undefined` as a getter in a subclass is something that isn't allowed in typescript. Because we where using `// @ts-ignore` to hide this error our bundler chose to allow the overwrite. Vite choses to disallow the overwrite making all subclasses' `textContent` undefined. To mitigate this we're using an abstract class, which does allow sub classes to decide if they wan't to use getters or not. * Chore: Migrate rrweb to vite WIP * build:browser was removed (for now) * BREAKING: moved rrweb-plugin-console to its own npm module This removes console from rrweb-all.js * Support cjs files in startServer * Move canvas-webrtc plugin to its own package * Chore: move sequential-id plugin to its own package * Chore: Configure rrweb's vite bundling * `Id` had lowercase `d` before, making it lowercase again * Test: Move console tests to their own package * remove unused utils from rrdom * pull in latest version of master something when wrong earlier when resolving merge conflicts, this should be correct * Fix type casting issue in diff.ts * Fix typo * Fix duplicate entries in package.json and tsconfig.json * Apply formatting changes * Update dependencies in package.json files * Update dependencies to use Vite 5.2.8 in package.json files * Get tests passing for rrdom `apply virtual style rules to node` tests need to be moved to rrweb to avoid circular dependencies * Fix image loading issue in integration tests * Move pack/unpack to its own @rrweb/packer module * Get tests to work in rrdom-nodejs * Port tests in rrweb-snapshot to vitest and fix them * Fix tests for rrweb-plugin-console-record * Add @rrweb/all package * Fix publint and attw errors for rrdom and @rrweb/types * Use shared vitest.config.ts in rrweb-snapshot package * Fix publint and attw issues for rrweb-snapshot * Export `ReplayPlugin` type directly from rrweb * Fix publint and attw issues for packages * Fix publint & attw issue. I was bumping into this issue:3729bc2a3c/docs/problems/NoResolution.mdAnd had to choose one of these three methods described here: https://github.com/andrewbranch/example-subpath-exports-ts-compat?tab=readme-ov-file#typescript-friendly-strategies-for-packagejson-subpath-exports-compatibility And I ended up going for the method described here:1ffe3425b0/examples/node_modules/package-json-redirects (package-json-redirects)The redirect method seemed the least invasive and most effective. * Fix publint & attw issue. I was bumping into this issue:3729bc2a3c/docs/problems/NoResolution.mdAnd had to choose one of these three methods described here: https://github.com/andrewbranch/example-subpath-exports-ts-compat?tab=readme-ov-file#typescript-friendly-strategies-for-packagejson-subpath-exports-compatibility And I ended up going for the method described here:1ffe3425b0/examples/node_modules/package-json-redirects (package-json-redirects)The redirect method seemed the least invasive and most effective. * move some rrdom tests that require rrweb to rrweb package * Use pre-jest 29 syntax for snapshotting * get rrweb passing publint and attw * const enum does not work with isolated modules flag * Fix script tag type in webgl.test.ts.snap and update rrweb.umd.cjs path in webgl.test.ts * Fix paths * Move tests for console record plugin and fix bundle path * Fix tests for rrweb * pack integration tests were moved to @rrweb/all * Update rrweb bundle path in test files * Fix flaky scroll emit from test * Migrate rrweb's tests over to vitest and make them pass * Make sure benchmarks & updating tests work * Remove jest from rrweb * Fix paths * always use rrweb's own cssom * Update tsconfig.json for rrweb-plugin-sequential-id-record Fixes this error: Error: @rrweb/rrweb-plugin-sequential-id-record:prepublish: tsconfig.json(9,5): error TS6377: Cannot write file '/home/runner/work/rrweb/rrweb/tsconfig.tsbuildinfo' because it will overwrite '.tsbuildinfo' file generated by referenced project '/home/runner/work/rrweb/rrweb/packages/rrweb' * Add tsbuildinfo config to extended tsconfig files * Move rrdom over to vitest * Apply formatting changes * Update rrweb imports to use the new package structure * extend rrweb-snapshot's tsconfig from monorepo base config * extend @rrweb/types's tsconfig from monorepo base config * extend rrdom's tsconfig from monorepo base config * extend rrdom-nodejs's tsconfig from monorepo base config * extend web-extension's tsconfig from monorepo base config * unify tsconfigs * Continue when tests fail * Add stricter type checking * Add check-types global command * remove jest * Remove unused code * Add check-types command to build script * Fix linting issues * Add setup Chrome action for CI/CD workflow * Update puppeteer version in package.json for rrweb * Update Chrome setup in CI/CD workflow * Update Chrome setup in CI/CD workflow * Add Chrome setup and test cache location * Update CI/CD workflow to test chrome cache location * Add chrome installation step to CI/CD workflow * Update Puppeteer configuration for headless testing * Update dependencies and workflow configuration * Use same version of chrome on CI as is run locally * Use version of chrome that seems to work with rrdom tests * Try using puppeteerrc to define chrome version * Add .cache directory to .gitignore * Move global flag to vitest config * Update puppeteer version to 20.9.0 * Update console log messages in rrweb-plugin-console-record for new puppeteer version * Remove redundant Chrome setup from CI/CD workflow * Add minification and umd for all built files * Update import paths for rrweb dist files * Add @rrweb/replay and @rrweb/record * Add script to lint packages * Apply formatting changes * exclude styles export from typescript package type checking * WIP Move rrweb-player over to vite * Apply formatting changes * chore: Update rrweb plugin import paths * Remove rollup from rrweb-player * Fix typing issues * Fix typing issues * chore: Update rrweb-player to use vite for build process * Apply formatting changes * chore: Export Player class in rrweb-player/src/main.ts Makes attw happy * Apply formatting changes * Gets wiped by yarn workspaces-to-typescript-project-references * Add .eslintignore and .eslintrc.cjs files for rrweb-player package * Apply formatting changes * Update dependencies in rrweb-player/package.json * Apply formatting changes * chore: Update eslint configuration for rrweb-player package * Apply formatting changes * chore: Remove unused files from rrweb-player package * Apply formatting changes * chore: Update rrweb-player import path to use rrweb-player.cjs * chore: Update addEventListener signature in rrweb-player * Apply formatting changes * Add .eslintignore and update .gitignore files for to root * Apply formatting changes * Update documentation * Update @rrweb/types package description * Apply formatting changes * Update build and run commands in CONTRIBUTING.md * Apply formatting changes * Update package versions to 2.0.0-alpha.13 * Apply formatting changes * Apply formatting changes * Fix import statement in media/index.ts * Apply formatting changes * chore: Update .gitignore to exclude build and dist directories * Apply formatting changes * Apply formatting changes * Migrate setTimeout to vitest * Apply formatting changes * Apply formatting changes * Fix isNativeShadowDom function signature in utils.ts * try out jsr * Apply formatting changes * Update package versions to 2.0.0-alpha.14 * Apply formatting changes * Fix name of rrwebSnapshot object * Apply formatting changes * Remove unused lock files * Apply formatting changes * Update rrweb bundle path to use umd.cjs format * Apply formatting changes * Trigger tests to run again * Rename snapshots for vitest * Apply formatting changes * Ping CI * Apply formatting changes * Ping CI * Apply formatting changes * Ignore files generated by svelte-kit for prettier * Correct Player object
This commit is contained in:
Justin Halsall
@@ -0,0 +1,697 @@
|
||||
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
|
||||
|
||||
exports[`rrweb-plugin-console-record > should handle recursive console messages 1`] = `
|
||||
"[
|
||||
{
|
||||
\\"type\\": 4,
|
||||
\\"data\\": {
|
||||
\\"href\\": \\"about:blank\\",
|
||||
\\"width\\": 1920,
|
||||
\\"height\\": 1080
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"data\\": {
|
||||
\\"node\\": {
|
||||
\\"type\\": 0,
|
||||
\\"childNodes\\": [
|
||||
{
|
||||
\\"type\\": 1,
|
||||
\\"name\\": \\"html\\",
|
||||
\\"publicId\\": \\"\\",
|
||||
\\"systemId\\": \\"\\",
|
||||
\\"id\\": 2
|
||||
},
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"tagName\\": \\"html\\",
|
||||
\\"attributes\\": {
|
||||
\\"lang\\": \\"en\\"
|
||||
},
|
||||
\\"childNodes\\": [
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"tagName\\": \\"head\\",
|
||||
\\"attributes\\": {},
|
||||
\\"childNodes\\": [
|
||||
{
|
||||
\\"type\\": 3,
|
||||
\\"textContent\\": \\"\\\\n \\",
|
||||
\\"id\\": 5
|
||||
},
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"tagName\\": \\"script\\",
|
||||
\\"attributes\\": {
|
||||
\\"type\\": \\"module\\",
|
||||
\\"src\\": \\"http://localhost:3030/@vite/client\\"
|
||||
},
|
||||
\\"childNodes\\": [],
|
||||
\\"id\\": 6
|
||||
},
|
||||
{
|
||||
\\"type\\": 3,
|
||||
\\"textContent\\": \\"\\\\n\\\\n \\",
|
||||
\\"id\\": 7
|
||||
},
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"tagName\\": \\"meta\\",
|
||||
\\"attributes\\": {
|
||||
\\"charset\\": \\"UTF-8\\"
|
||||
},
|
||||
\\"childNodes\\": [],
|
||||
\\"id\\": 8
|
||||
},
|
||||
{
|
||||
\\"type\\": 3,
|
||||
\\"textContent\\": \\"\\\\n \\",
|
||||
\\"id\\": 9
|
||||
},
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"tagName\\": \\"meta\\",
|
||||
\\"attributes\\": {
|
||||
\\"name\\": \\"viewport\\",
|
||||
\\"content\\": \\"width=device-width, initial-scale=1.0\\"
|
||||
},
|
||||
\\"childNodes\\": [],
|
||||
\\"id\\": 10
|
||||
},
|
||||
{
|
||||
\\"type\\": 3,
|
||||
\\"textContent\\": \\"\\\\n \\",
|
||||
\\"id\\": 11
|
||||
},
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"tagName\\": \\"meta\\",
|
||||
\\"attributes\\": {
|
||||
\\"http-equiv\\": \\"X-UA-Compatible\\",
|
||||
\\"content\\": \\"ie=edge\\"
|
||||
},
|
||||
\\"childNodes\\": [],
|
||||
\\"id\\": 12
|
||||
},
|
||||
{
|
||||
\\"type\\": 3,
|
||||
\\"textContent\\": \\"\\\\n \\",
|
||||
\\"id\\": 13
|
||||
},
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"tagName\\": \\"title\\",
|
||||
\\"attributes\\": {},
|
||||
\\"childNodes\\": [
|
||||
{
|
||||
\\"type\\": 3,
|
||||
\\"textContent\\": \\"Log record\\",
|
||||
\\"id\\": 15
|
||||
}
|
||||
],
|
||||
\\"id\\": 14
|
||||
},
|
||||
{
|
||||
\\"type\\": 3,
|
||||
\\"textContent\\": \\"\\\\n \\",
|
||||
\\"id\\": 16
|
||||
},
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"tagName\\": \\"script\\",
|
||||
\\"attributes\\": {
|
||||
\\"src\\": \\"http://localhost:3030/test/html/index.ts\\",
|
||||
\\"type\\": \\"module\\"
|
||||
},
|
||||
\\"childNodes\\": [],
|
||||
\\"id\\": 17
|
||||
},
|
||||
{
|
||||
\\"type\\": 3,
|
||||
\\"textContent\\": \\"\\\\n \\",
|
||||
\\"id\\": 18
|
||||
}
|
||||
],
|
||||
\\"id\\": 4
|
||||
},
|
||||
{
|
||||
\\"type\\": 3,
|
||||
\\"textContent\\": \\"\\\\n \\",
|
||||
\\"id\\": 19
|
||||
},
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"tagName\\": \\"body\\",
|
||||
\\"attributes\\": {},
|
||||
\\"childNodes\\": [
|
||||
{
|
||||
\\"type\\": 3,
|
||||
\\"textContent\\": \\"\\\\n\\\\n\\",
|
||||
\\"id\\": 21
|
||||
}
|
||||
],
|
||||
\\"id\\": 20
|
||||
}
|
||||
],
|
||||
\\"id\\": 3
|
||||
}
|
||||
],
|
||||
\\"id\\": 1
|
||||
},
|
||||
\\"initialOffset\\": {
|
||||
\\"left\\": 0,
|
||||
\\"top\\": 0
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 6,
|
||||
\\"data\\": {
|
||||
\\"plugin\\": \\"rrweb/console@1\\",
|
||||
\\"payload\\": {
|
||||
\\"level\\": \\"log\\",
|
||||
\\"trace\\": [
|
||||
\\"__puppeteer_evaluation_script__:21:15\\"
|
||||
],
|
||||
\\"payload\\": [
|
||||
\\"\\\\\\"Proxied object:\\\\\\"\\",
|
||||
\\"\\\\\\"[object Object]\\\\\\"\\"
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
]"
|
||||
`;
|
||||
|
||||
exports[`rrweb-plugin-console-record > should record console messages 1`] = `
|
||||
"[
|
||||
{
|
||||
\\"type\\": 4,
|
||||
\\"data\\": {
|
||||
\\"href\\": \\"about:blank\\",
|
||||
\\"width\\": 1920,
|
||||
\\"height\\": 1080
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"data\\": {
|
||||
\\"node\\": {
|
||||
\\"type\\": 0,
|
||||
\\"childNodes\\": [
|
||||
{
|
||||
\\"type\\": 1,
|
||||
\\"name\\": \\"html\\",
|
||||
\\"publicId\\": \\"\\",
|
||||
\\"systemId\\": \\"\\",
|
||||
\\"id\\": 2
|
||||
},
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"tagName\\": \\"html\\",
|
||||
\\"attributes\\": {
|
||||
\\"lang\\": \\"en\\"
|
||||
},
|
||||
\\"childNodes\\": [
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"tagName\\": \\"head\\",
|
||||
\\"attributes\\": {},
|
||||
\\"childNodes\\": [
|
||||
{
|
||||
\\"type\\": 3,
|
||||
\\"textContent\\": \\"\\\\n \\",
|
||||
\\"id\\": 5
|
||||
},
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"tagName\\": \\"script\\",
|
||||
\\"attributes\\": {
|
||||
\\"type\\": \\"module\\",
|
||||
\\"src\\": \\"http://localhost:3030/@vite/client\\"
|
||||
},
|
||||
\\"childNodes\\": [],
|
||||
\\"id\\": 6
|
||||
},
|
||||
{
|
||||
\\"type\\": 3,
|
||||
\\"textContent\\": \\"\\\\n\\\\n \\",
|
||||
\\"id\\": 7
|
||||
},
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"tagName\\": \\"meta\\",
|
||||
\\"attributes\\": {
|
||||
\\"charset\\": \\"UTF-8\\"
|
||||
},
|
||||
\\"childNodes\\": [],
|
||||
\\"id\\": 8
|
||||
},
|
||||
{
|
||||
\\"type\\": 3,
|
||||
\\"textContent\\": \\"\\\\n \\",
|
||||
\\"id\\": 9
|
||||
},
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"tagName\\": \\"meta\\",
|
||||
\\"attributes\\": {
|
||||
\\"name\\": \\"viewport\\",
|
||||
\\"content\\": \\"width=device-width, initial-scale=1.0\\"
|
||||
},
|
||||
\\"childNodes\\": [],
|
||||
\\"id\\": 10
|
||||
},
|
||||
{
|
||||
\\"type\\": 3,
|
||||
\\"textContent\\": \\"\\\\n \\",
|
||||
\\"id\\": 11
|
||||
},
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"tagName\\": \\"meta\\",
|
||||
\\"attributes\\": {
|
||||
\\"http-equiv\\": \\"X-UA-Compatible\\",
|
||||
\\"content\\": \\"ie=edge\\"
|
||||
},
|
||||
\\"childNodes\\": [],
|
||||
\\"id\\": 12
|
||||
},
|
||||
{
|
||||
\\"type\\": 3,
|
||||
\\"textContent\\": \\"\\\\n \\",
|
||||
\\"id\\": 13
|
||||
},
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"tagName\\": \\"title\\",
|
||||
\\"attributes\\": {},
|
||||
\\"childNodes\\": [
|
||||
{
|
||||
\\"type\\": 3,
|
||||
\\"textContent\\": \\"Log record\\",
|
||||
\\"id\\": 15
|
||||
}
|
||||
],
|
||||
\\"id\\": 14
|
||||
},
|
||||
{
|
||||
\\"type\\": 3,
|
||||
\\"textContent\\": \\"\\\\n \\",
|
||||
\\"id\\": 16
|
||||
},
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"tagName\\": \\"script\\",
|
||||
\\"attributes\\": {
|
||||
\\"src\\": \\"http://localhost:3030/test/html/index.ts\\",
|
||||
\\"type\\": \\"module\\"
|
||||
},
|
||||
\\"childNodes\\": [],
|
||||
\\"id\\": 17
|
||||
},
|
||||
{
|
||||
\\"type\\": 3,
|
||||
\\"textContent\\": \\"\\\\n \\",
|
||||
\\"id\\": 18
|
||||
}
|
||||
],
|
||||
\\"id\\": 4
|
||||
},
|
||||
{
|
||||
\\"type\\": 3,
|
||||
\\"textContent\\": \\"\\\\n \\",
|
||||
\\"id\\": 19
|
||||
},
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"tagName\\": \\"body\\",
|
||||
\\"attributes\\": {},
|
||||
\\"childNodes\\": [
|
||||
{
|
||||
\\"type\\": 3,
|
||||
\\"textContent\\": \\"\\\\n\\\\n\\",
|
||||
\\"id\\": 21
|
||||
}
|
||||
],
|
||||
\\"id\\": 20
|
||||
}
|
||||
],
|
||||
\\"id\\": 3
|
||||
}
|
||||
],
|
||||
\\"id\\": 1
|
||||
},
|
||||
\\"initialOffset\\": {
|
||||
\\"left\\": 0,
|
||||
\\"top\\": 0
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 6,
|
||||
\\"data\\": {
|
||||
\\"plugin\\": \\"rrweb/console@1\\",
|
||||
\\"payload\\": {
|
||||
\\"level\\": \\"assert\\",
|
||||
\\"trace\\": [
|
||||
\\"__puppeteer_evaluation_script__:2:15\\"
|
||||
],
|
||||
\\"payload\\": [
|
||||
\\"true\\",
|
||||
\\"\\\\\\"assert\\\\\\"\\"
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 6,
|
||||
\\"data\\": {
|
||||
\\"plugin\\": \\"rrweb/console@1\\",
|
||||
\\"payload\\": {
|
||||
\\"level\\": \\"count\\",
|
||||
\\"trace\\": [
|
||||
\\"__puppeteer_evaluation_script__:3:15\\"
|
||||
],
|
||||
\\"payload\\": [
|
||||
\\"\\\\\\"count\\\\\\"\\"
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 6,
|
||||
\\"data\\": {
|
||||
\\"plugin\\": \\"rrweb/console@1\\",
|
||||
\\"payload\\": {
|
||||
\\"level\\": \\"countReset\\",
|
||||
\\"trace\\": [
|
||||
\\"__puppeteer_evaluation_script__:4:15\\"
|
||||
],
|
||||
\\"payload\\": [
|
||||
\\"\\\\\\"count\\\\\\"\\"
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 6,
|
||||
\\"data\\": {
|
||||
\\"plugin\\": \\"rrweb/console@1\\",
|
||||
\\"payload\\": {
|
||||
\\"level\\": \\"debug\\",
|
||||
\\"trace\\": [
|
||||
\\"__puppeteer_evaluation_script__:5:15\\"
|
||||
],
|
||||
\\"payload\\": [
|
||||
\\"\\\\\\"debug\\\\\\"\\"
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 6,
|
||||
\\"data\\": {
|
||||
\\"plugin\\": \\"rrweb/console@1\\",
|
||||
\\"payload\\": {
|
||||
\\"level\\": \\"dir\\",
|
||||
\\"trace\\": [
|
||||
\\"__puppeteer_evaluation_script__:6:15\\"
|
||||
],
|
||||
\\"payload\\": [
|
||||
\\"\\\\\\"dir\\\\\\"\\"
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 6,
|
||||
\\"data\\": {
|
||||
\\"plugin\\": \\"rrweb/console@1\\",
|
||||
\\"payload\\": {
|
||||
\\"level\\": \\"dirxml\\",
|
||||
\\"trace\\": [
|
||||
\\"__puppeteer_evaluation_script__:7:15\\"
|
||||
],
|
||||
\\"payload\\": [
|
||||
\\"\\\\\\"dirxml\\\\\\"\\"
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 6,
|
||||
\\"data\\": {
|
||||
\\"plugin\\": \\"rrweb/console@1\\",
|
||||
\\"payload\\": {
|
||||
\\"level\\": \\"group\\",
|
||||
\\"trace\\": [
|
||||
\\"__puppeteer_evaluation_script__:8:15\\"
|
||||
],
|
||||
\\"payload\\": []
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 6,
|
||||
\\"data\\": {
|
||||
\\"plugin\\": \\"rrweb/console@1\\",
|
||||
\\"payload\\": {
|
||||
\\"level\\": \\"groupCollapsed\\",
|
||||
\\"trace\\": [
|
||||
\\"__puppeteer_evaluation_script__:9:15\\"
|
||||
],
|
||||
\\"payload\\": []
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 6,
|
||||
\\"data\\": {
|
||||
\\"plugin\\": \\"rrweb/console@1\\",
|
||||
\\"payload\\": {
|
||||
\\"level\\": \\"info\\",
|
||||
\\"trace\\": [
|
||||
\\"__puppeteer_evaluation_script__:10:15\\"
|
||||
],
|
||||
\\"payload\\": [
|
||||
\\"\\\\\\"info\\\\\\"\\"
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 6,
|
||||
\\"data\\": {
|
||||
\\"plugin\\": \\"rrweb/console@1\\",
|
||||
\\"payload\\": {
|
||||
\\"level\\": \\"log\\",
|
||||
\\"trace\\": [
|
||||
\\"__puppeteer_evaluation_script__:11:15\\"
|
||||
],
|
||||
\\"payload\\": [
|
||||
\\"\\\\\\"log\\\\\\"\\"
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 6,
|
||||
\\"data\\": {
|
||||
\\"plugin\\": \\"rrweb/console@1\\",
|
||||
\\"payload\\": {
|
||||
\\"level\\": \\"table\\",
|
||||
\\"trace\\": [
|
||||
\\"__puppeteer_evaluation_script__:12:15\\"
|
||||
],
|
||||
\\"payload\\": [
|
||||
\\"\\\\\\"table\\\\\\"\\"
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 6,
|
||||
\\"data\\": {
|
||||
\\"plugin\\": \\"rrweb/console@1\\",
|
||||
\\"payload\\": {
|
||||
\\"level\\": \\"time\\",
|
||||
\\"trace\\": [
|
||||
\\"__puppeteer_evaluation_script__:13:15\\"
|
||||
],
|
||||
\\"payload\\": []
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 6,
|
||||
\\"data\\": {
|
||||
\\"plugin\\": \\"rrweb/console@1\\",
|
||||
\\"payload\\": {
|
||||
\\"level\\": \\"timeEnd\\",
|
||||
\\"trace\\": [
|
||||
\\"__puppeteer_evaluation_script__:14:15\\"
|
||||
],
|
||||
\\"payload\\": []
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 6,
|
||||
\\"data\\": {
|
||||
\\"plugin\\": \\"rrweb/console@1\\",
|
||||
\\"payload\\": {
|
||||
\\"level\\": \\"timeLog\\",
|
||||
\\"trace\\": [
|
||||
\\"__puppeteer_evaluation_script__:15:15\\"
|
||||
],
|
||||
\\"payload\\": []
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 6,
|
||||
\\"data\\": {
|
||||
\\"plugin\\": \\"rrweb/console@1\\",
|
||||
\\"payload\\": {
|
||||
\\"level\\": \\"trace\\",
|
||||
\\"trace\\": [
|
||||
\\"__puppeteer_evaluation_script__:16:15\\"
|
||||
],
|
||||
\\"payload\\": [
|
||||
\\"\\\\\\"trace\\\\\\"\\"
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 6,
|
||||
\\"data\\": {
|
||||
\\"plugin\\": \\"rrweb/console@1\\",
|
||||
\\"payload\\": {
|
||||
\\"level\\": \\"warn\\",
|
||||
\\"trace\\": [
|
||||
\\"__puppeteer_evaluation_script__:17:15\\"
|
||||
],
|
||||
\\"payload\\": [
|
||||
\\"\\\\\\"warn\\\\\\"\\"
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 6,
|
||||
\\"data\\": {
|
||||
\\"plugin\\": \\"rrweb/console@1\\",
|
||||
\\"payload\\": {
|
||||
\\"level\\": \\"clear\\",
|
||||
\\"trace\\": [
|
||||
\\"__puppeteer_evaluation_script__:18:15\\"
|
||||
],
|
||||
\\"payload\\": []
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 6,
|
||||
\\"data\\": {
|
||||
\\"plugin\\": \\"rrweb/console@1\\",
|
||||
\\"payload\\": {
|
||||
\\"level\\": \\"log\\",
|
||||
\\"trace\\": [
|
||||
\\"__puppeteer_evaluation_script__:19:15\\"
|
||||
],
|
||||
\\"payload\\": [
|
||||
\\"\\\\\\"TypeError: a message\\\\\\\\n at __puppeteer_evaluation_script__:19:19\\\\\\\\nEnd of stack for Error object\\\\\\"\\"
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 3,
|
||||
\\"data\\": {
|
||||
\\"source\\": 0,
|
||||
\\"texts\\": [],
|
||||
\\"attributes\\": [],
|
||||
\\"removes\\": [],
|
||||
\\"adds\\": [
|
||||
{
|
||||
\\"parentId\\": 20,
|
||||
\\"nextId\\": null,
|
||||
\\"node\\": {
|
||||
\\"type\\": 2,
|
||||
\\"tagName\\": \\"iframe\\",
|
||||
\\"attributes\\": {},
|
||||
\\"childNodes\\": [],
|
||||
\\"id\\": 22
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 3,
|
||||
\\"data\\": {
|
||||
\\"source\\": 0,
|
||||
\\"adds\\": [
|
||||
{
|
||||
\\"parentId\\": 22,
|
||||
\\"nextId\\": null,
|
||||
\\"node\\": {
|
||||
\\"type\\": 0,
|
||||
\\"childNodes\\": [
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"tagName\\": \\"html\\",
|
||||
\\"attributes\\": {},
|
||||
\\"childNodes\\": [
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"tagName\\": \\"head\\",
|
||||
\\"attributes\\": {},
|
||||
\\"childNodes\\": [],
|
||||
\\"rootId\\": 23,
|
||||
\\"id\\": 25
|
||||
},
|
||||
{
|
||||
\\"type\\": 2,
|
||||
\\"tagName\\": \\"body\\",
|
||||
\\"attributes\\": {},
|
||||
\\"childNodes\\": [],
|
||||
\\"rootId\\": 23,
|
||||
\\"id\\": 26
|
||||
}
|
||||
],
|
||||
\\"rootId\\": 23,
|
||||
\\"id\\": 24
|
||||
}
|
||||
],
|
||||
\\"compatMode\\": \\"BackCompat\\",
|
||||
\\"id\\": 23
|
||||
}
|
||||
}
|
||||
],
|
||||
\\"removes\\": [],
|
||||
\\"texts\\": [],
|
||||
\\"attributes\\": [],
|
||||
\\"isAttachIframe\\": true
|
||||
}
|
||||
},
|
||||
{
|
||||
\\"type\\": 6,
|
||||
\\"data\\": {
|
||||
\\"plugin\\": \\"rrweb/console@1\\",
|
||||
\\"payload\\": {
|
||||
\\"level\\": \\"log\\",
|
||||
\\"trace\\": [
|
||||
\\"__puppeteer_evaluation_script__:2:15\\"
|
||||
],
|
||||
\\"payload\\": [
|
||||
\\"\\\\\\"from iframe\\\\\\"\\"
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
]"
|
||||
`;
|
||||
@@ -0,0 +1,19 @@
|
||||
import type { eventWithTime } from '@rrweb/types';
|
||||
import { record } from 'rrweb';
|
||||
import { getRecordConsolePlugin } from '../../src/index';
|
||||
|
||||
window.Date.now = () => new Date(Date.UTC(2018, 10, 15, 8)).valueOf();
|
||||
const snapshots: eventWithTime[] = ((window as any).snapshots = []);
|
||||
record({
|
||||
emit: (event) => {
|
||||
snapshots.push(event);
|
||||
},
|
||||
// maskTextSelector: ${JSON.stringify(options.maskTextSelector)},
|
||||
// maskAllInputs: ${options.maskAllInputs},
|
||||
// maskInputOptions: ${JSON.stringify(options.maskAllInputs)},
|
||||
// userTriggeredOnInput: ${options.userTriggeredOnInput},
|
||||
// maskTextFn: ${options.maskTextFn},
|
||||
// recordCanvas: ${options.recordCanvas},
|
||||
// inlineImages: ${options.inlineImages},
|
||||
plugins: [getRecordConsolePlugin()],
|
||||
});
|
||||
@@ -0,0 +1,11 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
||||
<title>Log record</title>
|
||||
<script src="./index.ts" type="module"></script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
||||
128
packages/plugins/rrweb-plugin-console-record/test/index.test.ts
Normal file
128
packages/plugins/rrweb-plugin-console-record/test/index.test.ts
Normal file
@@ -0,0 +1,128 @@
|
||||
import { describe, it, beforeAll, afterAll, expect, vi } from 'vitest';
|
||||
import { stringifySnapshots } from '../../../rrweb/test/utils';
|
||||
import { createServer, ViteDevServer } from 'vite';
|
||||
import * as puppeteer from 'puppeteer';
|
||||
import type { Browser, Page } from 'puppeteer';
|
||||
import type { eventWithTime } from '@rrweb/types';
|
||||
|
||||
export async function launchPuppeteer(
|
||||
options?: Parameters<(typeof puppeteer)['launch']>[0],
|
||||
) {
|
||||
return await puppeteer.launch({
|
||||
headless: process.env.PUPPETEER_HEADLESS ? true : false,
|
||||
defaultViewport: {
|
||||
width: 1920,
|
||||
height: 1080,
|
||||
},
|
||||
args: ['--no-sandbox'],
|
||||
...options,
|
||||
});
|
||||
}
|
||||
|
||||
export function assertSnapshot(snapshots: eventWithTime[]) {
|
||||
expect(snapshots).toBeDefined();
|
||||
expect(stringifySnapshots(snapshots)).toMatchSnapshot();
|
||||
}
|
||||
|
||||
describe('rrweb-plugin-console-record', () => {
|
||||
// vi.setConfig({ testTimeout: 120_000 });
|
||||
let server: ViteDevServer;
|
||||
let serverUrl: string;
|
||||
let browser: Browser;
|
||||
let page: Page;
|
||||
|
||||
beforeAll(async () => {
|
||||
server = await createServer({
|
||||
preview: { port: 3000 },
|
||||
mode: 'test',
|
||||
// hmr calls `console.debug('[vite] connected')` and messes up our snapshots
|
||||
// so we disable it
|
||||
server: { hmr: false },
|
||||
});
|
||||
await server.listen();
|
||||
serverUrl = server.resolvedUrls!.local[0];
|
||||
browser = await launchPuppeteer();
|
||||
page = await browser.newPage();
|
||||
});
|
||||
|
||||
afterAll(async () => {
|
||||
await browser.close();
|
||||
await server.close();
|
||||
});
|
||||
|
||||
it('should handle recursive console messages', async () => {
|
||||
await page.goto(`${serverUrl}test/html/log.html`);
|
||||
|
||||
await page.evaluate(() => {
|
||||
// Some frameworks like Vue.js use proxies to implement reactivity.
|
||||
// This can cause infinite loops when logging objects.
|
||||
let recursiveTarget = { foo: 'bar', proxied: 'i-am', proxy: null };
|
||||
let count = 0;
|
||||
|
||||
const handler = {
|
||||
get(target: any, prop: any, ...args: any[]) {
|
||||
if (prop === 'proxied') {
|
||||
if (count > 9) {
|
||||
return;
|
||||
}
|
||||
count++; // We don't want out test to get into an infinite loop...
|
||||
console.warn(
|
||||
'proxied was accessed so triggering a console.warn',
|
||||
target,
|
||||
);
|
||||
}
|
||||
return Reflect.get(target, prop, ...args);
|
||||
},
|
||||
};
|
||||
|
||||
const proxy = new Proxy(recursiveTarget, handler);
|
||||
recursiveTarget.proxy = proxy;
|
||||
|
||||
console.log('Proxied object:', proxy);
|
||||
});
|
||||
|
||||
// await waitForRAF(page);
|
||||
|
||||
const snapshots = (await page.evaluate(
|
||||
'window.snapshots',
|
||||
)) as eventWithTime[];
|
||||
// The snapshots should containe 1 console log, not multiple.
|
||||
assertSnapshot(snapshots);
|
||||
});
|
||||
|
||||
it('should record console messages', async () => {
|
||||
await page.goto(`${serverUrl}test/html/log.html`);
|
||||
|
||||
await page.evaluate(() => {
|
||||
console.assert(0 === 0, 'assert');
|
||||
console.count('count');
|
||||
console.countReset('count');
|
||||
console.debug('debug');
|
||||
console.dir('dir');
|
||||
console.dirxml('dirxml');
|
||||
console.group();
|
||||
console.groupCollapsed();
|
||||
console.info('info');
|
||||
console.log('log');
|
||||
console.table('table');
|
||||
console.time();
|
||||
console.timeEnd();
|
||||
console.timeLog();
|
||||
console.trace('trace');
|
||||
console.warn('warn');
|
||||
console.clear();
|
||||
console.log(new TypeError('a message'));
|
||||
const iframe = document.createElement('iframe');
|
||||
document.body.appendChild(iframe);
|
||||
});
|
||||
|
||||
await page.frames()[1].evaluate(() => {
|
||||
console.log('from iframe');
|
||||
});
|
||||
|
||||
const snapshots = (await page.evaluate(
|
||||
'window.snapshots',
|
||||
)) as eventWithTime[];
|
||||
assertSnapshot(snapshots);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,12 @@
|
||||
/**
|
||||
* @vitest-environment jsdom
|
||||
*/
|
||||
|
||||
import { stringify } from '../src/stringify';
|
||||
import { describe, it, expect } from 'vitest';
|
||||
|
||||
describe('console record plugin', () => {
|
||||
it('can stringify bigint', () => {
|
||||
expect(stringify(BigInt(1))).toEqual('"1n"');
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user