search

ruifigueira / playwright-crx

Playwright for chrome extensions
Apache License 2.0
126 stars 27 forks source link

[Feature] Editing Recorded Playwright Script #31

Closed srivathsav01 closed 1 month ago

srivathsav01 commented 1 month ago

Hi @ruifigueira , First off , Thanks for creating and maintaining such an incredible project. I've been exploring the Plugin and the source-code, and I'm impressed .

I’d like to contribute by adding a feature that allows users to edit the recorded Playwright scripts. I’ve tried a few approaches but haven’t had much luck. Could you offer any guidance on implementing this feature or point me in the right direction?

I added another component for popup and displayed the raw content in a tabular fashion. But i am not able to make the edits here reflect in the original script.

image

ruifigueira commented 1 month ago

Hi @srivathsav01,

glad to know you enjoy it. Editing recorded playwright scripts would be a nice feature indeed, I didn't want to significantly change the recorder UI code and that's one of the reasons I never tried it (the other is that, if edited freely, player won't work because it relies on a structured action set).

Nevertheless, if you want to give it a try, you can look into crxRecorderApp.ts, which works as a middleware between the recorder UI and the recorder server.

Recorder server calls crxRecorderApp.setSources to push source changes into UI, and UI sends events to crxRecorderApp that are then forwarded into the recorder server. One possibility is to send a new event from UI, e.g updateSources, and handle it here:

https://github.com/ruifigueira/playwright-crx/blob/1b062f52dcc0dfdd1cec69a5f3114aae90c0b4c3/playwright/packages/playwright-core/src/server/recorder.ts#L122-L150

This requires patching actual playwright code, which I try to do only as a last resource, because thst is a conflict candidate everytime I merge their releases, but then again, I had to change a few things for player to work.

asadzakir commented 1 month ago

Hi @ruifigueira ,

I really like what you have done with playwright crx.

Just wanted to ask quick question. In the attached screen shot you can see we have array of pw steps but I can't use eval or new Function for executing pw script because of the permission issue in chrome extension manifest v3.

Is there any other way to execute dynamic pw steps using crx.

image

ruifigueira commented 1 month ago

Extension service workers don't support eval or other form of dynamic evaluation, for security reasons. You need to rely on some JS interpreter to achieve that.