diff --git a/packages/playwright-core/src/server/recorder/recorderCollection.ts b/packages/playwright-core/src/server/recorder/recorderCollection.ts
index b5216d7382..2643dece91 100644
--- a/packages/playwright-core/src/server/recorder/recorderCollection.ts
+++ b/packages/playwright-core/src/server/recorder/recorderCollection.ts
@@ -38,7 +38,7 @@ export class RecorderCollection extends EventEmitter {
restart() {
this._actions = [];
- this._fireChange();
+ this.emit('change', []);
}
setEnabled(enabled: boolean) {
@@ -128,6 +128,7 @@ export class RecorderCollection extends EventEmitter {
private _fireChange() {
if (!this._enabled)
return;
+
this.emit('change', collapseActions(this._actions));
}
}
diff --git a/tests/library/inspector/cli-codegen-1.spec.ts b/tests/library/inspector/cli-codegen-1.spec.ts
index a876a25e47..0fd5f69d0b 100644
--- a/tests/library/inspector/cli-codegen-1.spec.ts
+++ b/tests/library/inspector/cli-codegen-1.spec.ts
@@ -926,4 +926,34 @@ await page.GetByRole(AriaRole.Button, new() { Name = "Submit" }).ClickAsync();`)
const predicate = (msg: ConsoleMessage) => msg.type() === 'error' && /Content[\- ]Security[\- ]Policy/i.test(msg.text());
await expect(page.waitForEvent('console', { predicate, timeout: 1000 })).rejects.toThrow();
});
+
+ test('should clear when recording is disabled', { annotation: { type: 'issue', description: 'https://github.com/microsoft/playwright/issues/33802' } }, async ({ openRecorder }) => {
+ const { recorder } = await openRecorder();
+
+ await recorder.setContentAndWait(`
+
+
+ `);
+
+ await recorder.hoverOverElement('#foo');
+ let [sources] = await Promise.all([
+ recorder.waitForOutput('JavaScript', 'click'),
+ recorder.trustedClick(),
+ ]);
+
+ expect(sources.get('JavaScript').text).toContain(`getByRole('button', { name: 'Foo' }).click()`);
+
+ await recorder.recorderPage.getByRole('button', { name: 'Record' }).click();
+ await recorder.recorderPage.getByRole('button', { name: 'Clear' }).click();
+ await recorder.recorderPage.getByRole('button', { name: 'Record' }).click();
+
+ await recorder.hoverOverElement('#bar');
+ [sources] = await Promise.all([
+ recorder.waitForOutput('JavaScript', 'click'),
+ recorder.trustedClick(),
+ ]);
+
+ expect(sources.get('JavaScript').text).toContain(`getByRole('button', { name: 'Bar' }).click()`);
+ expect(sources.get('JavaScript').text).not.toContain(`getByRole('button', { name: 'Foo' })`);
+ });
});