diff --git a/README.md b/README.md index 9872fdfd..476cc192 100644 --- a/README.md +++ b/README.md @@ -16,8 +16,6 @@ npm install @puppeteer/replay --save ``` -> Currently, @puppeteer/replay ships only ESM modules. Please vote/comment on [this issue](https://github.com/puppeteer/replay/issues/26), if you need CJS module support. - If you want to replay recordings using Puppeteer, install Puppeteer as well: ``` @@ -212,3 +210,12 @@ console.log( ) ); ``` + + +## CommonJS modules + +If you want to use CommonJS modules, `require` the code from `@puppeteer/replay/cjs`. For example, + +```js +const { stringify } = require('@puppeteer/replay/cjs'); +``` diff --git a/examples/cjs/main.js b/examples/cjs/main.js new file mode 100644 index 00000000..afbe9cfc --- /dev/null +++ b/examples/cjs/main.js @@ -0,0 +1,54 @@ +const { + createRunner, + PuppeteerRunnerExtension, +} = require('../../lib/cjs/main.js'); +const puppeteer = require('puppeteer'); + +async function main() { + const browser = await puppeteer.launch({ + headless: true, + }); + + const page = await browser.newPage(); + + class Extension extends PuppeteerRunnerExtension { + async beforeAllSteps(flow) { + await super.beforeAllSteps(flow); + console.log('starting'); + } + + async beforeEachStep(step, flow) { + await super.beforeEachStep(step, flow); + console.log('before', step); + } + + async afterEachStep(step, flow) { + await super.afterEachStep(step, flow); + console.log('after', step); + } + + async afterAllSteps(flow) { + await super.afterAllSteps(flow); + console.log('done'); + } + } + + const runner = await createRunner( + { + title: 'Test recording', + steps: [ + { + type: 'navigate', + url: 'https://wikipedia.org', + }, + ], + }, + new Extension(browser, page, 7000) + ); + + await runner.run(); + + await browser.close(); +} + +main(); diff --git a/examples/cjs/package.json b/examples/cjs/package.json new file mode 100644 index 00000000..5bbefffb --- /dev/null +++ b/examples/cjs/package.json @@ -0,0 +1,3 @@ +{ + "type": "commonjs" +} diff --git a/package.json b/package.json index 39578e7b..8e422fee 100644 --- a/package.json +++ b/package.json @@ -20,7 +20,7 @@ "eslint-fix": "eslint --ext js --ext ts --fix .", "clean-lib": "rimraf lib", "build": "npm run tsc", - "tsc": "npm run clean-lib && tsc --version && tsc -b tsconfig.json", + "tsc": "npm run clean-lib && tsc --version && tsc -b tsconfig.json && tsc -b tsconfig.cjs.json && echo '{\"type\":\"commonjs\"}' > lib/cjs/package.json", "lint": "npm run eslint", "docs": "typedoc --readme none --gitRevision main --externalPattern --excludeExternals --excludeProtected --excludePrivate --plugin typedoc-plugin-markdown --out docs/api src/main.ts", "release": "standard-version" diff --git a/src/cli.ts b/src/cli.ts index 162bed46..15f17fbd 100644 --- a/src/cli.ts +++ b/src/cli.ts @@ -27,7 +27,7 @@ interface Arguments { headless?: string; } -await yargs(hideBin(process.argv)) +yargs(hideBin(process.argv)) .command( '$0 ', 'run files', diff --git a/tsconfig.cjs.json b/tsconfig.cjs.json new file mode 100644 index 00000000..17939a97 --- /dev/null +++ b/tsconfig.cjs.json @@ -0,0 +1,7 @@ +{ + "extends": "./tsconfig.json", + "compilerOptions": { + "outDir": "lib/cjs", + "module": "CommonJS", + } +}