11import assert from "node:assert" ;
2+ import getPort , { portNumbers } from "get-port" ;
23import colors from "picocolors" ;
4+ import { DEBUG_PATH , DEFAULT_INSPECTOR_PORT } from "./constants" ;
5+ import type { ResolvedPluginConfig } from "./plugin-config" ;
6+ import type { Miniflare } from "miniflare" ;
37import type * as vite from "vite" ;
48
5- export const debuggingPath = "/__debug" ;
9+ /**
10+ * Gets the inspector port option that should be passed to Miniflare based on the user's plugin config
11+ */
12+ export async function getInputInspectorPortOption (
13+ resolvedPluginConfig : ResolvedPluginConfig ,
14+ viteServer : vite . ViteDevServer | vite . PreviewServer ,
15+ miniflare ?: Miniflare
16+ ) {
17+ if (
18+ resolvedPluginConfig . inspectorPort === undefined ||
19+ resolvedPluginConfig . inspectorPort === 0
20+ ) {
21+ const resolvedInspectorPort = await getResolvedInspectorPort (
22+ resolvedPluginConfig ,
23+ miniflare
24+ ) ;
25+
26+ if ( resolvedInspectorPort !== null ) {
27+ // the user is not specifying an inspector port to use and we're already
28+ // using one (this is a server restart) so let's just reuse that
29+ return resolvedInspectorPort ;
30+ }
31+ }
32+
33+ const inputInspectorPort =
34+ resolvedPluginConfig . inspectorPort ??
35+ ( await getFirstAvailablePort ( DEFAULT_INSPECTOR_PORT ) ) ;
36+
37+ if (
38+ resolvedPluginConfig . inspectorPort === undefined &&
39+ inputInspectorPort !== DEFAULT_INSPECTOR_PORT
40+ ) {
41+ viteServer . config . logger . warn (
42+ colors . dim (
43+ `Default inspector port ${ DEFAULT_INSPECTOR_PORT } ${ inputInspectorPort }
44+ )
45+ ) ;
46+ }
47+
48+ return inputInspectorPort ;
49+ }
650
751/**
8- * Modifies the url printing logic to also include a url that developers can use to open devtools to debug their Worker(s)
9- *
10- * @param server a vite server (dev or preview)
52+ * Gets the resolved inspector port provided by Miniflare
53+ */
54+ export async function getResolvedInspectorPort (
55+ resolvedPluginConfig : ResolvedPluginConfig ,
56+ miniflare : Miniflare | undefined
57+ ) {
58+ if ( miniflare && resolvedPluginConfig . inspectorPort !== false ) {
59+ const miniflareInspectorUrl = await miniflare . getInspectorURL ( ) ;
60+
61+ return Number . parseInt ( miniflareInspectorUrl . port ) ;
62+ }
63+
64+ return null ;
65+ }
66+
67+ function getFirstAvailablePort ( start : number ) {
68+ return getPort ( { port : portNumbers ( start , 65535 ) } ) ;
69+ }
70+
71+ /**
72+ * Modifies the URL printing logic to also include a URL that developers can use to open DevTools to debug their Worker(s)
1173 */
1274export function addDebugToVitePrintUrls (
1375 server : vite . ViteDevServer | vite . PreviewServer
@@ -28,34 +90,30 @@ export function addDebugToVitePrintUrls(
2890 )
2991 ) ;
3092 server . config . logger . info (
31- ` ${ colors . green ( "➜" ) } ${ colors . bold ( "Debug" ) } ${ colorDebugUrl ( `${ protocol } ${ hostname } ${ port } ${ debuggingPath } ) }
93+ ` ${ colors . green ( "➜" ) } ${ colors . bold ( "Debug" ) } ${ colorDebugUrl ( `${ protocol } ${ hostname } ${ port } ${ DEBUG_PATH } ) }
3294 ) ;
3395 }
3496 } ;
3597}
3698
3799/**
38- * Generate an HTML text that comprises of a single script that:
39- * - redirects the page to the devtools for the debugging of the first available worker
40- * - opens tags to the devtools for all the remaining workers if any
41- *
42- * Note: this works based on the miniflare inspector proxy logic (where workers are available via
43- * paths comprised of their names)
100+ * Generate HTML that comprises a single script that:
101+ * - redirects the page to the DevTools for debugging the first available Worker
102+ * - opens tabs to the DevTools for all the remaining workers if any
44103 *
45- * @param workerNames the names of all the available workers
46- * @param inspectorPort the inspector port that miniflare is using
47- * @returns the generated html
104+ * Note: this works based on the Miniflare inspector proxy logic (where Workers are available via
105+ * their names)
48106 */
49107export function getDebugPathHtml ( workerNames : string [ ] , inspectorPort : number ) {
50108 // this function should always be called only when there is at least one worker to debug
51109 assert ( workerNames . length >= 1 , "no workers present to debug" ) ;
52110
53111 const workerDevtoolsUrls = workerNames . map ( ( workerName ) => {
54- const localHost = `localhost:${ inspectorPort } ${ workerName } ;
112+ const localhost = `localhost:${ inspectorPort } ${ workerName } ;
55113 const searchParams = new URLSearchParams ( {
56114 theme : "systemPreferred" ,
57115 debugger : "true" ,
58- ws : localHost ,
116+ ws : localhost ,
59117 domain : workerName ,
60118 } ) ;
61119 const devtoolsFrontendUrl = `https://devtools.devprod.cloudflare.dev/js_app?${ searchParams } ;
0 commit comments