cypress-chrome-recorder icon indicating copy to clipboard operation
cypress-chrome-recorder copied to clipboard

Support code view highlight in Recorder

Open jecfish opened this issue 2 years ago • 1 comments

Chrome 110 launches a new "Show code and highlight" feature.

How to test You can test this feature with the latest Chrome Canary

  1. Open a recording in the Recorder, click "Show code".
  2. Hover over each step, the code should highlight accordingly.

Action required

  1. Your extension needs to update to the latest Puppeteer Replay.
  2. Rebuild & publish a new version to Web Store
  3. That's all!

If your extension doesn't have Puppeteer Replay as dependency, you can implement the [sourcemaps] (https://github.com/puppeteer/replay/blob/main/src/stringify.ts#L68) yourself to make it work.

my gif has pretty low res. ezgif-4-33a0309279

jecfish avatar Jan 17 '23 22:01 jecfish

@jordanpowell88 fyi, PR #46 should already enable this feature. Do update it to the latest Puppeteer Replay version (PR https://github.com/cypress-io/cypress-recorder-extension/pull/8, https://github.com/cypress-io/cypress-recorder-extension/pull/7) when you publish a new version again.

jecfish avatar Jan 17 '23 22:01 jecfish