Test for Trace Viewer settings
This commit is contained in:
parent
af7cc37e2a
commit
7fb7a17168
|
|
@ -49,6 +49,10 @@ class TraceViewerPage {
|
||||||
snapshotContainer: Locator;
|
snapshotContainer: Locator;
|
||||||
sourceCodeTab: Locator;
|
sourceCodeTab: Locator;
|
||||||
|
|
||||||
|
settingsDialog: Locator;
|
||||||
|
darkModeSetting: Locator;
|
||||||
|
displayCanvasContentSetting: Locator;
|
||||||
|
|
||||||
constructor(public page: Page) {
|
constructor(public page: Page) {
|
||||||
this.actionTitles = page.locator('.action-title');
|
this.actionTitles = page.locator('.action-title');
|
||||||
this.actionsTree = page.getByTestId('actions-tree');
|
this.actionsTree = page.getByTestId('actions-tree');
|
||||||
|
|
@ -63,6 +67,10 @@ class TraceViewerPage {
|
||||||
this.snapshotContainer = page.locator('.snapshot-container iframe.snapshot-visible[name=snapshot]');
|
this.snapshotContainer = page.locator('.snapshot-container iframe.snapshot-visible[name=snapshot]');
|
||||||
this.metadataTab = page.getByTestId('metadata-view');
|
this.metadataTab = page.getByTestId('metadata-view');
|
||||||
this.sourceCodeTab = page.getByTestId('source-code');
|
this.sourceCodeTab = page.getByTestId('source-code');
|
||||||
|
|
||||||
|
this.settingsDialog = page.locator('.settings-toolbar-dialog');
|
||||||
|
this.darkModeSetting = page.locator('.setting').getByText('Dark mode');
|
||||||
|
this.displayCanvasContentSetting = page.locator('.setting').getByText('Display canvas content');
|
||||||
}
|
}
|
||||||
|
|
||||||
async actionIconsText(action: string) {
|
async actionIconsText(action: string) {
|
||||||
|
|
@ -115,6 +123,10 @@ class TraceViewerPage {
|
||||||
await this.page.click('text="Metadata"');
|
await this.page.click('text="Metadata"');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async showSettings() {
|
||||||
|
await this.page.locator('.settings-gear').click();
|
||||||
|
}
|
||||||
|
|
||||||
@step
|
@step
|
||||||
async snapshotFrame(actionName: string, ordinal: number = 0, hasSubframe: boolean = false): Promise<FrameLocator> {
|
async snapshotFrame(actionName: string, ordinal: number = 0, hasSubframe: boolean = false): Promise<FrameLocator> {
|
||||||
await this.selectAction(actionName, ordinal);
|
await this.selectAction(actionName, ordinal);
|
||||||
|
|
|
||||||
|
|
@ -1593,3 +1593,60 @@ test('should show a popover', async ({ runAndTrace, page, server }) => {
|
||||||
const popover = snapshot.locator('#pop');
|
const popover = snapshot.locator('#pop');
|
||||||
await expect.poll(() => popover.evaluate(e => e.matches(':popover-open'))).toBe(true);
|
await expect.poll(() => popover.evaluate(e => e.matches(':popover-open'))).toBe(true);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
test('should open settings dialog', async ({ showTraceViewer }) => {
|
||||||
|
const traceViewer = await showTraceViewer([traceFile]);
|
||||||
|
await traceViewer.selectAction('http://localhost');
|
||||||
|
await traceViewer.showSettings();
|
||||||
|
await expect(traceViewer.settingsDialog).toBeVisible();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('should toggle theme color', async ({ showTraceViewer, page }) => {
|
||||||
|
const traceViewer = await showTraceViewer([traceFile]);
|
||||||
|
await traceViewer.selectAction('http://localhost');
|
||||||
|
await traceViewer.showSettings();
|
||||||
|
|
||||||
|
await expect(traceViewer.darkModeSetting).toBeChecked({ checked: false });
|
||||||
|
|
||||||
|
await traceViewer.darkModeSetting.click();
|
||||||
|
await expect(traceViewer.darkModeSetting).toBeChecked({ checked: true });
|
||||||
|
await expect(traceViewer.page.locator('.dark-mode')).toBeVisible();
|
||||||
|
|
||||||
|
await traceViewer.darkModeSetting.click();
|
||||||
|
await expect(traceViewer.darkModeSetting).toBeChecked({ checked: false });
|
||||||
|
await expect(traceViewer.page.locator('.light-mode')).toBeVisible();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('should toggle canvas rendering', async ({ runAndTrace, page }) => {
|
||||||
|
const traceViewer = await runAndTrace(async () => {
|
||||||
|
await page.goto(`data:text/html,<!DOCTYPE html><body><div>Hello world</div><canvas /></body>`);
|
||||||
|
await page.goto(`data:text/html,<!DOCTYPE html><body><div>Hello world</div></body>`);
|
||||||
|
});
|
||||||
|
|
||||||
|
let snapshotRequestPromise = traceViewer.page.waitForRequest(request => request.url().includes('/snapshot/'), { timeout: 2000 });
|
||||||
|
|
||||||
|
// Click on the action with a canvas snapshot
|
||||||
|
await traceViewer.selectAction('goto', 0);
|
||||||
|
|
||||||
|
let snapshotRequest = await snapshotRequestPromise;
|
||||||
|
|
||||||
|
expect(snapshotRequest.url()).not.toContain('shouldPopulateCanvasFromScreenshot');
|
||||||
|
|
||||||
|
await traceViewer.showSettings();
|
||||||
|
|
||||||
|
await expect(traceViewer.displayCanvasContentSetting).toBeChecked({ checked: false });
|
||||||
|
await traceViewer.displayCanvasContentSetting.click();
|
||||||
|
await expect(traceViewer.displayCanvasContentSetting).toBeChecked({ checked: true });
|
||||||
|
|
||||||
|
// Deselect canvas
|
||||||
|
await traceViewer.selectAction('goto', 1);
|
||||||
|
|
||||||
|
snapshotRequestPromise = traceViewer.page.waitForRequest(request => request.url().includes('/snapshot/'), { timeout: 2000 });
|
||||||
|
|
||||||
|
// Select canvas again
|
||||||
|
await traceViewer.selectAction('goto', 0);
|
||||||
|
|
||||||
|
snapshotRequest = await snapshotRequestPromise;
|
||||||
|
|
||||||
|
expect(snapshotRequest.url()).toContain('shouldPopulateCanvasFromScreenshot');
|
||||||
|
});
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue