diff --git a/examples/recorder-crx/src/crxRecorder.tsx b/examples/recorder-crx/src/crxRecorder.tsx index ca58cef3b..a59ed461c 100644 --- a/examples/recorder-crx/src/crxRecorder.tsx +++ b/examples/recorder-crx/src/crxRecorder.tsx @@ -33,19 +33,6 @@ function setRunningFileId(fileId: string) { window.playwrightSetRunningFile(fileId); } -function download(filename: string, text: string) { - const blob = new Blob([text], { type: 'text/plain' }); - const url = URL.createObjectURL(blob); - try { - const a = document.createElement('a'); - a.href = url; - a.download = filename; - a.click(); - } finally { - URL.revokeObjectURL(url); - } -} - export const CrxRecorder: React.FC = ({ }) => { const [settings, setSettings] = React.useState(defaultSettings); @@ -59,9 +46,7 @@ export const CrxRecorder: React.FC = ({ React.useEffect(() => { const testServer = new CrxTestServerConnection(); - testServer.onItemSelected(location => console.log('itemSelected', location)); setTestServer(testServer); - testServer.openUiMode().catch(() => {}); return () => testServer.close(); }, []); @@ -69,7 +54,7 @@ export const CrxRecorder: React.FC = ({ const port = chrome.runtime.connect({ name: 'crx-recorder' }); const onMessage = (msg: any) => { if (!('type' in msg) || msg.type !== 'recorder') return; - + switch (msg.method) { case 'setPaused': setPaused(msg.paused); break; case 'setMode': setMode(msg.mode); break; @@ -104,57 +89,6 @@ export const CrxRecorder: React.FC = ({ }; }, []); - const downloadCode = React.useCallback(() => { - if (!settings.experimental) - return; - - if (!testServer || !sources.length || !selectedFileId) - return; - - const source = sources.find(s => s.id === selectedFileId); - if (!source) - return; - - let filename: string | undefined; - - switch (selectedFileId) { - case 'javascript': filename = 'example.js'; break; - case 'playwright-test': filename = 'example.spec.ts'; break; - case 'java-junit': filename = 'TestExample.java'; break; - case 'java': filename = 'Example.java'; break; - case 'python-pytest': filename = 'test_example.py'; break; - case 'python': filename = 'example.py'; break; - case 'python-async': filename = 'example.py'; break; - case 'csharp-mstest': filename = 'Tests.cs'; break; - case 'csharp-nunit': filename = 'Tests.cs'; break; - case 'csharp': filename = 'Example.cs'; break; - }; - - if (!filename) - return; - - const code = source.text; - - testServer.saveScript({ code, language: 'javascript', suggestedName: filename }).catch(() => {}); - }, [sources, selectedFileId, testServer, settings]); - - React.useEffect(() => { - if (!settings.experimental) - return; - - const keydownHandler = (e: KeyboardEvent) => { - if (e.ctrlKey && e.key === 's') { - e.preventDefault(); - downloadCode(); - } - }; - window.addEventListener('keydown', keydownHandler); - - return () => { - window.removeEventListener('keydown', keydownHandler); - }; - }, [downloadCode, settings]); - const dispatchEditedCode = React.useCallback((code: string) => { window.dispatch({ event: 'codeChanged', params: { code } }); }, []); diff --git a/examples/recorder-crx/src/testServer/crxTestServerDispatcher.ts b/examples/recorder-crx/src/testServer/crxTestServerDispatcher.ts index 910314c10..8b5569043 100644 --- a/examples/recorder-crx/src/testServer/crxTestServerDispatcher.ts +++ b/examples/recorder-crx/src/testServer/crxTestServerDispatcher.ts @@ -119,6 +119,11 @@ export class CrxTestServerDispatcher implements Partial, Te return; await fs.writeFile(path, params.code); } + + async loadScript(params: { code: string }) { + const crxApp = await this._crxAppPromise; + await crxApp.recorder.load(params.code); + } async saveStorageState() { const crxApp = await this._crxAppPromise; diff --git a/examples/recorder-crx/src/testServer/crxTestServerTransport.ts b/examples/recorder-crx/src/testServer/crxTestServerTransport.ts index f1bbbbf1f..69e5c924a 100644 --- a/examples/recorder-crx/src/testServer/crxTestServerTransport.ts +++ b/examples/recorder-crx/src/testServer/crxTestServerTransport.ts @@ -36,6 +36,10 @@ export class CrxTestServerConnection extends TestServerConnection implements Crx await this._sendMessage('saveScript', params); } + async loadScript(params: { code: string }) { + await this._sendMessage('loadScript', params); + } + async saveStorageState() { await this._sendMessage('saveStorageState'); }