-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Added web sender and wired up to example/apollo-client
- Loading branch information
Showing
15 changed files
with
171 additions
and
26 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,15 @@ | ||
| { | ||
| "name": "@envy/web", | ||
| "version": "0.1.0", | ||
| "description": "Node.js Network & Telemetry Viewer", | ||
| "main": "dist/index.js", | ||
| "repository": "https://github.com/FormidableLabs/envy.git", | ||
| "license": "MIT", | ||
| "scripts": { | ||
| "prebuild": "rimraf dist", | ||
| "build": "tsc" | ||
| }, | ||
| "dependencies": { | ||
| "@envy/core": "0.2.0" | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,64 @@ | ||
| import { EventType, HttpRequest } from '@envy/core'; | ||
|
|
||
| function formatHeaders(headers: HeadersInit | Headers | undefined): HttpRequest['requestHeaders'] { | ||
| if (headers) { | ||
| if (Array.isArray(headers)) { | ||
| return headers.reduce<HttpRequest['requestHeaders']>((acc, [key, value]) => { | ||
| acc[key] = value; | ||
| return acc; | ||
| }, {}); | ||
| } else if (headers instanceof Headers) { | ||
| return Object.fromEntries(headers.entries()); | ||
| } else { | ||
| return headers; | ||
| } | ||
| } | ||
|
|
||
| return {}; | ||
| } | ||
|
|
||
| export function fetchRequestToEvent( | ||
| timestamp: number, | ||
| id: string, | ||
| input: RequestInfo | URL, | ||
| init?: RequestInit, | ||
| ): HttpRequest { | ||
| let url: URL; | ||
| if (typeof input === 'string') { | ||
| url = new URL(input); | ||
| } else if (input instanceof Request) { | ||
| url = new URL(input.url); | ||
| } else { | ||
| url = input; | ||
| } | ||
|
|
||
| return { | ||
| id, | ||
| parentId: undefined, | ||
| timestamp, | ||
| type: EventType.HttpRequest, | ||
| method: (init?.method ?? 'GET') as HttpRequest['method'], | ||
| host: url.host, | ||
| port: parseInt(url.port, 10), | ||
| path: url.pathname, | ||
| url: url.toString(), | ||
| requestHeaders: formatHeaders(init?.headers), | ||
| requestBody: init?.body?.toString() ?? undefined, | ||
| }; | ||
| } | ||
|
|
||
| export async function fetchResponseToEvent( | ||
| timestamp: number, | ||
| req: HttpRequest, | ||
| response: Response, | ||
| ): Promise<HttpRequest> { | ||
| return { | ||
| ...req, | ||
| httpVersion: response.type, | ||
| statusCode: response.status, | ||
| statusMessage: response.statusText, | ||
| responseHeaders: formatHeaders(response.headers), | ||
| responseBody: await response.text(), | ||
| duration: timestamp - req.timestamp, | ||
| }; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1 @@ | ||
| export * from './tracing'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,10 @@ | ||
| /* eslint-disable no-console */ | ||
|
|
||
| const { name } = require('../package.json'); | ||
|
|
||
| export default { | ||
| info: (msg: string, ...args: unknown[]) => console.log(`✅ %c${name} ${msg}`, 'color: green', ...args), | ||
| warn: (msg: string, ...args: unknown[]) => console.log(`🚸 %c${name} ${msg}`, 'color: yellow', ...args), | ||
| error: (msg: string, ...args: unknown[]) => console.log(`❌ %c${name} ${msg}`, 'color: red', ...args), | ||
| debug: (msg: string, ...args: unknown[]) => console.log(`🔧 %c$${name} ${msg}`, 'color: cyan', ...args), | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,4 @@ | ||
| export interface Options { | ||
| serviceName: string; | ||
| debug?: boolean; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,43 @@ | ||
| import { DEFAULT_WEB_SOCKET_PORT } from '@envy/core'; | ||
|
|
||
| import { fetchRequestToEvent, fetchResponseToEvent } from './http'; | ||
| import log from './log'; | ||
| import { Options } from './options'; | ||
|
|
||
| export interface TracingOptions extends Options { | ||
| port?: number; | ||
| } | ||
|
|
||
| export function enableTracing(options: TracingOptions) { | ||
| if (typeof window === 'undefined') { | ||
| log.error('Attempted to use @envy/web in a non-browser environment'); | ||
| return; | ||
| } | ||
|
|
||
| if (options.debug) log.info('Starting in debug mode'); | ||
|
|
||
| const wsUri = `ws://127.0.0.1:${options.port ?? DEFAULT_WEB_SOCKET_PORT}/web/${options.serviceName}`; | ||
| const ws = new WebSocket(wsUri); | ||
| ws.onopen = () => { | ||
| if (options.debug) log.info(`Connected to ${wsUri}`); | ||
|
|
||
| const { fetch: originalFetch } = window; | ||
|
|
||
| window.fetch = async (...args) => { | ||
| // TODO: better unique id | ||
| const tsReq = Date.now(); | ||
| const id = `${tsReq}`; | ||
|
|
||
| const reqEvent = fetchRequestToEvent(tsReq, id, ...args); | ||
| ws.send(JSON.stringify(reqEvent)); | ||
|
|
||
| const response = await originalFetch(...args); | ||
| const tsRes = Date.now(); | ||
| const responseClone = response.clone(); | ||
| const resEvent = await fetchResponseToEvent(tsRes, reqEvent, responseClone); | ||
| ws.send(JSON.stringify(resEvent)); | ||
|
|
||
| return response; | ||
| }; | ||
| }; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,9 @@ | ||
| { | ||
| "extends": "../../tsconfig.json", | ||
| "include": ["src/**/*"], | ||
| "exclude": ["**/*.spec.ts"], | ||
| "compilerOptions": { | ||
| "lib": ["ES2022", "DOM", "DOM.Iterable"], | ||
| "outDir": "dist" | ||
| } | ||
| } |