feat(trace-viewer): allow host and port to be specified (#20258)

This commit is contained in:
Etienne 2023-01-27 23:20:25 +01:00 committed by GitHub
parent dfb53513ea
commit 252b489a7f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 19 additions and 10 deletions

View file

@ -295,6 +295,8 @@ program
program
.command('show-trace [trace...]')
.option('-b, --browser <browserType>', 'browser to use, one of cr, chromium, ff, firefox, wk, webkit', 'chromium')
.option('-h, --host <host>', 'Host to serve trace on', 'localhost')
.option('-p, --port <port>', 'Port to serve trace on', '9322')
.description('show trace viewer')
.action(function(traces, options) {
if (options.browser === 'cr')
@ -303,7 +305,8 @@ program
options.browser = 'firefox';
if (options.browser === 'wk')
options.browser = 'webkit';
showTraceViewer(traces, options.browser, false, 9322).catch(logErrorAndExit);
showTraceViewer(traces, options.browser, { headless: false, host: options.host, port: +options.port }).catch(logErrorAndExit);
}).addHelpText('afterAll', `
Examples:

View file

@ -26,7 +26,7 @@ import { serverSideCallMetadata } from '../../instrumentation';
import { createPlaywright } from '../../playwright';
import { ProgressController } from '../../progress';
export async function showTraceViewer(traceUrls: string[], browserName: string, headless = false, preferredPort?: number): Promise<BrowserContext | undefined> {
export async function showTraceViewer(traceUrls: string[], browserName: string, { headless = false, host, port }: { headless?: boolean, host?: string, port?: number }): Promise<BrowserContext | undefined> {
for (const traceUrl of traceUrls) {
if (!traceUrl.startsWith('http://') && !traceUrl.startsWith('https://') && !fs.existsSync(traceUrl)) {
// eslint-disable-next-line no-console
@ -49,7 +49,7 @@ export async function showTraceViewer(traceUrls: string[], browserName: string,
return server.serveFile(request, response, absolutePath);
});
const urlPrefix = await server.start({ preferredPort });
const urlPrefix = await server.start({ preferredPort: port, host });
const traceViewerPlaywright = createPlaywright('javascript', true);
const traceViewerBrowser = isUnderTest() ? 'chromium' : browserName;

View file

@ -29,7 +29,7 @@ type BaseWorkerFixtures = {
};
export type TraceViewerFixtures = {
showTraceViewer: (trace: string[], preferredPort?: number) => Promise<TraceViewerPage>;
showTraceViewer: (trace: string[], options?: {host?: string, port?: number}) => Promise<TraceViewerPage>;
runAndTrace: (body: () => Promise<void>) => Promise<TraceViewerPage>;
};
@ -112,8 +112,8 @@ export const traceViewerFixtures: Fixtures<TraceViewerFixtures, {}, BaseTestFixt
showTraceViewer: async ({ playwright, browserName, headless }, use) => {
const browsers: Browser[] = [];
const contextImpls: any[] = [];
await use(async (traces: string[], preferredPort?: number) => {
const contextImpl = await showTraceViewer(traces, browserName, headless, preferredPort);
await use(async (traces: string[], { host, port } = {}) => {
const contextImpl = await showTraceViewer(traces, browserName, { headless, host, port });
const browser = await playwright.chromium.connectOverCDP(contextImpl._browser.options.wsEndpoint);
browsers.push(browser);
contextImpls.push(contextImpl);
@ -134,4 +134,4 @@ export const traceViewerFixtures: Fixtures<TraceViewerFixtures, {}, BaseTestFixt
return showTraceViewer([traceFile]);
});
},
};
};

View file

@ -79,13 +79,19 @@ test('should show empty trace viewer', async ({ showTraceViewer }, testInfo) =>
});
test('should open two trace viewers', async ({ showTraceViewer }, testInfo) => {
const preferredPort = testInfo.workerIndex + 48321;
const traceViewer1 = await showTraceViewer([testInfo.outputPath()], preferredPort);
const port = testInfo.workerIndex + 48321;
const traceViewer1 = await showTraceViewer([testInfo.outputPath()], { host: 'localhost', port });
await expect(traceViewer1.page).toHaveTitle('Playwright Trace Viewer');
const traceViewer2 = await showTraceViewer([testInfo.outputPath()], preferredPort);
const traceViewer2 = await showTraceViewer([testInfo.outputPath()], { host: 'localhost', port });
await expect(traceViewer2.page).toHaveTitle('Playwright Trace Viewer');
});
test('should open trace viewer on specific host', async ({ showTraceViewer }, testInfo) => {
const traceViewer = await showTraceViewer([testInfo.outputPath()], { host: '127.0.0.1' });
await expect(traceViewer.page).toHaveTitle('Playwright Trace Viewer');
await expect(traceViewer.page).toHaveURL(/127.0.0.1/);
});
test('should open simple trace viewer', async ({ showTraceViewer }) => {
const traceViewer = await showTraceViewer([traceFile]);
await expect(traceViewer.actionTitles).toHaveText([