From f71bf9a42ac2a3aacaea6a466ec57982b03304ec Mon Sep 17 00:00:00 2001 From: Pavel Feldman Date: Wed, 24 Feb 2021 13:39:51 -0800 Subject: [PATCH] chore: move trace viewer into server (#5597) --- src/cli/cli.ts | 2 +- src/server/playwright.ts | 2 +- .../{traceTypes.ts => common/traceEvents.ts} | 16 +++++++++++++--- src/server/trace/{ => recorder}/snapshotter.ts | 16 ++++++++-------- .../trace/{ => recorder}/snapshotterInjected.ts | 12 +----------- src/server/trace/{ => recorder}/tracer.ts | 16 ++++++++-------- .../trace/viewer}/screenshotGenerator.ts | 2 +- .../trace/viewer}/snapshotServer.ts | 2 +- .../trace/viewer}/traceModel.ts | 4 ++-- .../trace/viewer}/traceServer.ts | 0 .../trace/viewer}/traceViewer.ts | 6 +++--- src/web/traceViewer/ui/actionList.tsx | 2 +- src/web/traceViewer/ui/contextSelector.tsx | 2 +- src/web/traceViewer/ui/logsTab.tsx | 2 +- .../traceViewer/ui/networkResourceDetails.tsx | 2 +- src/web/traceViewer/ui/networkTab.tsx | 2 +- src/web/traceViewer/ui/snapshotTab.tsx | 2 +- src/web/traceViewer/ui/sourceTab.tsx | 2 +- src/web/traceViewer/ui/timeline.tsx | 2 +- src/web/traceViewer/ui/workbench.tsx | 2 +- test/trace.spec.ts | 2 +- utils/check_deps.js | 10 +++++++--- 22 files changed, 56 insertions(+), 52 deletions(-) rename src/server/trace/{traceTypes.ts => common/traceEvents.ts} (87%) rename src/server/trace/{ => recorder}/snapshotter.ts (93%) rename src/server/trace/{ => recorder}/snapshotterInjected.ts (97%) rename src/server/trace/{ => recorder}/tracer.ts (96%) rename src/{cli/traceViewer => server/trace/viewer}/screenshotGenerator.ts (98%) rename src/{cli/traceViewer => server/trace/viewer}/snapshotServer.ts (99%) rename src/{cli/traceViewer => server/trace/viewer}/traceModel.ts (98%) rename src/{cli/traceViewer => server/trace/viewer}/traceServer.ts (100%) rename src/{cli/traceViewer => server/trace/viewer}/traceViewer.ts (96%) diff --git a/src/cli/cli.ts b/src/cli/cli.ts index dd19a5a289..0889d6844e 100755 --- a/src/cli/cli.ts +++ b/src/cli/cli.ts @@ -23,7 +23,7 @@ import program from 'commander'; import os from 'os'; import fs from 'fs'; import { runServer, printApiJson, installBrowsers } from './driver'; -import { showTraceViewer } from './traceViewer/traceViewer'; +import { showTraceViewer } from '../server/trace/viewer/traceViewer'; import * as playwright from '../..'; import { BrowserContext } from '../client/browserContext'; import { Browser } from '../client/browser'; diff --git a/src/server/playwright.ts b/src/server/playwright.ts index b22a13618e..cb9533737b 100644 --- a/src/server/playwright.ts +++ b/src/server/playwright.ts @@ -15,7 +15,7 @@ */ import path from 'path'; -import { Tracer } from './trace/tracer'; +import { Tracer } from './trace/recorder/tracer'; import { Android } from './android/android'; import { AdbBackend } from './android/backendAdb'; import { PlaywrightOptions } from './browser'; diff --git a/src/server/trace/traceTypes.ts b/src/server/trace/common/traceEvents.ts similarity index 87% rename from src/server/trace/traceTypes.ts rename to src/server/trace/common/traceEvents.ts index 239cc8e4fd..9298308e90 100644 --- a/src/server/trace/traceTypes.ts +++ b/src/server/trace/common/traceEvents.ts @@ -14,9 +14,19 @@ * limitations under the License. */ -import { StackFrame } from '../../common/types'; -import { NodeSnapshot } from './snapshotterInjected'; -export { NodeSnapshot } from './snapshotterInjected'; +import { StackFrame } from '../../../common/types'; + +export type NodeSnapshot = + // Text node. + string | + // Subtree reference, "x snapshots ago, node #y". Could point to a text node. + // Only nodes that are not references are counted, starting from zero, using post-order traversal. + [ [number, number] ] | + // Just node name. + [ string ] | + // Node name, attributes, child nodes. + // Unfortunately, we cannot make this type definition recursive, therefore "any". + [ string, { [attr: string]: string }, ...any ]; export type ContextCreatedTraceEvent = { timestamp: number, diff --git a/src/server/trace/snapshotter.ts b/src/server/trace/recorder/snapshotter.ts similarity index 93% rename from src/server/trace/snapshotter.ts rename to src/server/trace/recorder/snapshotter.ts index 27c5d13c14..1099cf42ca 100644 --- a/src/server/trace/snapshotter.ts +++ b/src/server/trace/recorder/snapshotter.ts @@ -14,15 +14,15 @@ * limitations under the License. */ -import { BrowserContext } from '../browserContext'; -import { Page } from '../page'; -import * as network from '../network'; -import { helper, RegisteredListener } from '../helper'; -import { debugLogger } from '../../utils/debugLogger'; -import { Frame } from '../frames'; +import { BrowserContext } from '../../browserContext'; +import { Page } from '../../page'; +import * as network from '../../network'; +import { helper, RegisteredListener } from '../../helper'; +import { debugLogger } from '../../../utils/debugLogger'; +import { Frame } from '../../frames'; import { SnapshotData, frameSnapshotStreamer, kSnapshotBinding, kSnapshotStreamer } from './snapshotterInjected'; -import { calculateSha1 } from '../../utils/utils'; -import { FrameSnapshot } from './traceTypes'; +import { calculateSha1 } from '../../../utils/utils'; +import { FrameSnapshot } from '../common/traceEvents'; export type SnapshotterResource = { pageId: string, diff --git a/src/server/trace/snapshotterInjected.ts b/src/server/trace/recorder/snapshotterInjected.ts similarity index 97% rename from src/server/trace/snapshotterInjected.ts rename to src/server/trace/recorder/snapshotterInjected.ts index 4269ec3ce4..8e90611a75 100644 --- a/src/server/trace/snapshotterInjected.ts +++ b/src/server/trace/recorder/snapshotterInjected.ts @@ -14,17 +14,7 @@ * limitations under the License. */ -export type NodeSnapshot = - // Text node. - string | - // Subtree reference, "x snapshots ago, node #y". Could point to a text node. - // Only nodes that are not references are counted, starting from zero, using post-order traversal. - [ [number, number] ] | - // Just node name. - [ string ] | - // Node name, attributes, child nodes. - // Unfortunately, we cannot make this type definition recursive, therefore "any". - [ string, { [attr: string]: string }, ...any ]; +import type { NodeSnapshot } from '../common/traceEvents'; export type SnapshotData = { doctype?: string, diff --git a/src/server/trace/tracer.ts b/src/server/trace/recorder/tracer.ts similarity index 96% rename from src/server/trace/tracer.ts rename to src/server/trace/recorder/tracer.ts index 74be0d380d..d2b71ebd2e 100644 --- a/src/server/trace/tracer.ts +++ b/src/server/trace/recorder/tracer.ts @@ -14,20 +14,20 @@ * limitations under the License. */ -import { BrowserContext, Video } from '../browserContext'; +import { BrowserContext, Video } from '../../browserContext'; import type { SnapshotterResource as SnapshotterResource, SnapshotterBlob, SnapshotterDelegate } from './snapshotter'; -import * as trace from './traceTypes'; +import * as trace from '../common/traceEvents'; import path from 'path'; import * as util from 'util'; import fs from 'fs'; -import { createGuid, getFromENV, mkdirIfNeeded, monotonicTime } from '../../utils/utils'; -import { Page } from '../page'; +import { createGuid, getFromENV, mkdirIfNeeded, monotonicTime } from '../../../utils/utils'; +import { Page } from '../../page'; import { Snapshotter } from './snapshotter'; -import { helper, RegisteredListener } from '../helper'; -import { Dialog } from '../dialog'; -import { Frame, NavigationEvent } from '../frames'; +import { helper, RegisteredListener } from '../../helper'; +import { Dialog } from '../../dialog'; +import { Frame, NavigationEvent } from '../../frames'; import { snapshotScript } from './snapshotterInjected'; -import { CallMetadata, InstrumentationListener, SdkObject } from '../instrumentation'; +import { CallMetadata, InstrumentationListener, SdkObject } from '../../instrumentation'; const fsWriteFileAsync = util.promisify(fs.writeFile.bind(fs)); const fsAppendFileAsync = util.promisify(fs.appendFile.bind(fs)); diff --git a/src/cli/traceViewer/screenshotGenerator.ts b/src/server/trace/viewer/screenshotGenerator.ts similarity index 98% rename from src/cli/traceViewer/screenshotGenerator.ts rename to src/server/trace/viewer/screenshotGenerator.ts index 8d63e7f95b..03b4ed02ad 100644 --- a/src/cli/traceViewer/screenshotGenerator.ts +++ b/src/server/trace/viewer/screenshotGenerator.ts @@ -16,7 +16,7 @@ import fs from 'fs'; import path from 'path'; -import * as playwright from '../../..'; +import * as playwright from '../../../..'; import * as util from 'util'; import { actionById, ActionEntry, ContextEntry, TraceModel } from './traceModel'; import { SnapshotServer } from './snapshotServer'; diff --git a/src/cli/traceViewer/snapshotServer.ts b/src/server/trace/viewer/snapshotServer.ts similarity index 99% rename from src/cli/traceViewer/snapshotServer.ts rename to src/server/trace/viewer/snapshotServer.ts index e5173b2efa..8ff97425d8 100644 --- a/src/cli/traceViewer/snapshotServer.ts +++ b/src/server/trace/viewer/snapshotServer.ts @@ -19,7 +19,7 @@ import fs from 'fs'; import path from 'path'; import querystring from 'querystring'; import type { TraceModel } from './traceModel'; -import * as trace from '../../server/trace/traceTypes'; +import * as trace from '../common/traceEvents'; import { TraceServer } from './traceServer'; export class SnapshotServer { diff --git a/src/cli/traceViewer/traceModel.ts b/src/server/trace/viewer/traceModel.ts similarity index 98% rename from src/cli/traceViewer/traceModel.ts rename to src/server/trace/viewer/traceModel.ts index 11a1ab3c81..bcdfaa1469 100644 --- a/src/cli/traceViewer/traceModel.ts +++ b/src/server/trace/viewer/traceModel.ts @@ -14,8 +14,8 @@ * limitations under the License. */ -import * as trace from '../../server/trace/traceTypes'; -export * as trace from '../../server/trace/traceTypes'; +import * as trace from '../common/traceEvents'; +export * as trace from '../common/traceEvents'; export type TraceModel = { contexts: ContextEntry[]; diff --git a/src/cli/traceViewer/traceServer.ts b/src/server/trace/viewer/traceServer.ts similarity index 100% rename from src/cli/traceViewer/traceServer.ts rename to src/server/trace/viewer/traceServer.ts diff --git a/src/cli/traceViewer/traceViewer.ts b/src/server/trace/viewer/traceViewer.ts similarity index 96% rename from src/cli/traceViewer/traceViewer.ts rename to src/server/trace/viewer/traceViewer.ts index 2753e68f7f..96996b70a0 100644 --- a/src/cli/traceViewer/traceViewer.ts +++ b/src/server/trace/viewer/traceViewer.ts @@ -16,11 +16,11 @@ import fs from 'fs'; import path from 'path'; -import * as playwright from '../../..'; +import * as playwright from '../../../..'; import * as util from 'util'; import { ScreenshotGenerator } from './screenshotGenerator'; import { readTraceFile, TraceModel } from './traceModel'; -import type { TraceEvent } from '../../server/trace/traceTypes'; +import type { TraceEvent } from '../common/traceEvents'; import { SnapshotServer } from './snapshotServer'; import { ServerRouteHandler, TraceServer } from './traceServer'; @@ -106,7 +106,7 @@ class TraceViewer { const traceViewerHandler: ServerRouteHandler = (request, response) => { const relativePath = request.url!.substring('/traceviewer/'.length); - const absolutePath = path.join(__dirname, '..', '..', 'web', ...relativePath.split('/')); + const absolutePath = path.join(__dirname, '..', '..', '..', 'web', ...relativePath.split('/')); return server.serveFile(response, absolutePath); }; server.routePrefix('/traceviewer/', traceViewerHandler, true); diff --git a/src/web/traceViewer/ui/actionList.tsx b/src/web/traceViewer/ui/actionList.tsx index 00b8d72d29..987fc09886 100644 --- a/src/web/traceViewer/ui/actionList.tsx +++ b/src/web/traceViewer/ui/actionList.tsx @@ -14,7 +14,7 @@ limitations under the License. */ -import { ActionEntry } from '../../../cli/traceViewer/traceModel'; +import { ActionEntry } from '../../../server/trace/viewer/traceModel'; import './actionList.css'; import * as React from 'react'; diff --git a/src/web/traceViewer/ui/contextSelector.tsx b/src/web/traceViewer/ui/contextSelector.tsx index eaf81c89ac..034ce95fd1 100644 --- a/src/web/traceViewer/ui/contextSelector.tsx +++ b/src/web/traceViewer/ui/contextSelector.tsx @@ -15,7 +15,7 @@ */ import * as React from 'react'; -import { ContextEntry } from '../../../cli/traceViewer/traceModel'; +import { ContextEntry } from '../../../server/trace/viewer/traceModel'; import './contextSelector.css'; export const ContextSelector: React.FunctionComponent<{ diff --git a/src/web/traceViewer/ui/logsTab.tsx b/src/web/traceViewer/ui/logsTab.tsx index 0c74cf67f8..98f40b2f28 100644 --- a/src/web/traceViewer/ui/logsTab.tsx +++ b/src/web/traceViewer/ui/logsTab.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ -import { ActionEntry } from '../../../cli/traceViewer/traceModel'; +import { ActionEntry } from '../../../server/trace/viewer/traceModel'; import * as React from 'react'; import './logsTab.css'; diff --git a/src/web/traceViewer/ui/networkResourceDetails.tsx b/src/web/traceViewer/ui/networkResourceDetails.tsx index 2b5c7f4774..a13b9c988a 100644 --- a/src/web/traceViewer/ui/networkResourceDetails.tsx +++ b/src/web/traceViewer/ui/networkResourceDetails.tsx @@ -17,7 +17,7 @@ import './networkResourceDetails.css'; import * as React from 'react'; import { Expandable } from './helpers'; -import { NetworkResourceTraceEvent } from '../../../server/trace/traceTypes'; +import { NetworkResourceTraceEvent } from '../../../server/trace/common/traceEvents'; const utf8Encoder = new TextDecoder('utf-8'); diff --git a/src/web/traceViewer/ui/networkTab.tsx b/src/web/traceViewer/ui/networkTab.tsx index 2d41c69e22..351520cec4 100644 --- a/src/web/traceViewer/ui/networkTab.tsx +++ b/src/web/traceViewer/ui/networkTab.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ -import { ActionEntry } from '../../../cli/traceViewer/traceModel'; +import { ActionEntry } from '../../../server/trace/viewer/traceModel'; import './networkTab.css'; import * as React from 'react'; import { NetworkResourceDetails } from './networkResourceDetails'; diff --git a/src/web/traceViewer/ui/snapshotTab.tsx b/src/web/traceViewer/ui/snapshotTab.tsx index ad83dd4ab2..31f4270f07 100644 --- a/src/web/traceViewer/ui/snapshotTab.tsx +++ b/src/web/traceViewer/ui/snapshotTab.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ -import { ActionEntry } from '../../../cli/traceViewer/traceModel'; +import { ActionEntry } from '../../../server/trace/viewer/traceModel'; import { Boundaries, Size } from '../geometry'; import './snapshotTab.css'; import * as React from 'react'; diff --git a/src/web/traceViewer/ui/sourceTab.tsx b/src/web/traceViewer/ui/sourceTab.tsx index 96277b6204..bbac07965d 100644 --- a/src/web/traceViewer/ui/sourceTab.tsx +++ b/src/web/traceViewer/ui/sourceTab.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ -import { ActionEntry } from '../../../cli/traceViewer/traceModel'; +import { ActionEntry } from '../../../server/trace/viewer/traceModel'; import * as React from 'react'; import { useAsyncMemo } from './helpers'; import './sourceTab.css'; diff --git a/src/web/traceViewer/ui/timeline.tsx b/src/web/traceViewer/ui/timeline.tsx index d3919c96a3..0b10845610 100644 --- a/src/web/traceViewer/ui/timeline.tsx +++ b/src/web/traceViewer/ui/timeline.tsx @@ -15,7 +15,7 @@ limitations under the License. */ -import { ContextEntry, InterestingPageEvent, ActionEntry, trace } from '../../../cli/traceViewer/traceModel'; +import { ContextEntry, InterestingPageEvent, ActionEntry, trace } from '../../../server/trace/viewer/traceModel'; import './timeline.css'; import { Boundaries } from '../geometry'; import * as React from 'react'; diff --git a/src/web/traceViewer/ui/workbench.tsx b/src/web/traceViewer/ui/workbench.tsx index af660669dd..5dcf522656 100644 --- a/src/web/traceViewer/ui/workbench.tsx +++ b/src/web/traceViewer/ui/workbench.tsx @@ -14,7 +14,7 @@ limitations under the License. */ -import { ActionEntry, TraceModel } from '../../../cli/traceViewer/traceModel'; +import { ActionEntry, TraceModel } from '../../../server/trace/viewer/traceModel'; import { ActionList } from './actionList'; import { TabbedPane } from './tabbedPane'; import { Timeline } from './timeline'; diff --git a/test/trace.spec.ts b/test/trace.spec.ts index 4084afd56e..3d248c64c0 100644 --- a/test/trace.spec.ts +++ b/test/trace.spec.ts @@ -15,7 +15,7 @@ */ import { it, expect } from './fixtures'; -import type * as trace from '../src/server/trace/traceTypes'; +import type * as trace from '../src/server/trace/common/traceEvents'; import path from 'path'; import fs from 'fs'; diff --git a/utils/check_deps.js b/utils/check_deps.js index 8d9b33bc09..8f0d093199 100644 --- a/utils/check_deps.js +++ b/utils/check_deps.js @@ -140,13 +140,13 @@ DEPS['src/server/injected/'] = ['src/server/common/']; DEPS['src/server/android/'] = [...DEPS['src/server/'], 'src/server/chromium/', 'src/protocol/']; DEPS['src/server/electron/'] = [...DEPS['src/server/'], 'src/server/chromium/']; -DEPS['src/server/playwright.ts'] = [...DEPS['src/server/'], 'src/server/trace/', 'src/server/chromium/', 'src/server/webkit/', 'src/server/firefox/', 'src/server/android/', 'src/server/electron/']; +DEPS['src/server/playwright.ts'] = [...DEPS['src/server/'], 'src/server/trace/recorder/tracer.ts', 'src/server/chromium/', 'src/server/webkit/', 'src/server/firefox/', 'src/server/android/', 'src/server/electron/']; DEPS['src/cli/driver.ts'] = DEPS['src/inprocess.ts'] = DEPS['src/browserServerImpl.ts'] = ['src/**']; // Tracing is a client/server plugin, nothing should depend on it. DEPS['src/web/recorder/'] = ['src/common/', 'src/web/', 'src/web/components/', 'src/server/supplements/recorder/recorderTypes.ts']; -DEPS['src/web/traceViewer/'] = ['src/common/', 'src/web/', 'src/cli/traceViewer/']; -DEPS['src/web/traceViewer/ui/'] = ['src/common/', 'src/web/traceViewer/', 'src/web/', 'src/cli/traceViewer/', 'src/server/trace/']; +DEPS['src/web/traceViewer/'] = ['src/common/', 'src/web/']; +DEPS['src/web/traceViewer/ui/'] = ['src/common/', 'src/web/traceViewer/', 'src/web/', 'src/server/trace/viewer/', 'src/server/trace/', 'src/server/trace/common/']; // The service is a cross-cutting feature, and so it depends on a bunch of things. DEPS['src/remote/'] = ['src/client/', 'src/debug/', 'src/dispatchers/', 'src/server/', 'src/server/supplements/', 'src/server/electron/', 'src/server/trace/']; DEPS['src/service.ts'] = ['src/remote/']; @@ -157,6 +157,10 @@ DEPS['src/cli/'] = ['src/cli/**', 'src/client/**', 'src/install/**', 'src/genera DEPS['src/server/supplements/recorder/recorderApp.ts'] = ['src/common/', 'src/utils/', 'src/server/', 'src/server/chromium/']; DEPS['src/utils/'] = ['src/common/']; +// Trace viewer +DEPS['src/server/trace/recorder/'] = ['src/server/trace/common/', ...DEPS['src/server/']]; +DEPS['src/server/trace/viewer/'] = ['src/server/trace/common/']; + checkDeps().catch(e => { console.error(e && e.stack ? e.stack : e); process.exit(1);