wrangler 0.0.0-e3e3243 → 0.0.0-e41c7e41

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (304) hide show
  1. package/Cloudflare_CA.pem +18 -0
  2. package/README.md +47 -14
  3. package/bin/wrangler.js +154 -31
  4. package/kv-asset-handler.js +1 -0
  5. package/miniflare-dist/index.mjs +6258 -21
  6. package/package.json +191 -141
  7. package/src/__tests__/access.test.ts +25 -0
  8. package/src/__tests__/api-dev.test.ts +209 -0
  9. package/src/__tests__/api-devregistry.test.js +56 -0
  10. package/src/__tests__/api.test.ts +80 -0
  11. package/src/__tests__/config-cache-without-cache-dir.test.ts +38 -0
  12. package/src/__tests__/config-cache.test.ts +42 -0
  13. package/src/__tests__/configuration.test.ts +3971 -2810
  14. package/src/__tests__/d1.test.ts +80 -0
  15. package/src/__tests__/delete.test.ts +230 -0
  16. package/src/__tests__/deployments.test.ts +91 -0
  17. package/src/__tests__/dev.test.tsx +1521 -526
  18. package/src/__tests__/dialogs.test.tsx +40 -0
  19. package/src/__tests__/generate.test.ts +235 -0
  20. package/src/__tests__/get-host-from-url.test.ts +16 -0
  21. package/src/__tests__/guess-worker-format.test.ts +74 -57
  22. package/src/__tests__/helpers/cmd-shim.d.ts +6 -6
  23. package/src/__tests__/helpers/mock-account-id.ts +24 -24
  24. package/src/__tests__/helpers/mock-bin.ts +20 -20
  25. package/src/__tests__/helpers/mock-cfetch.ts +219 -93
  26. package/src/__tests__/helpers/mock-console.ts +68 -32
  27. package/src/__tests__/helpers/mock-dialogs.ts +121 -33
  28. package/src/__tests__/helpers/mock-get-zone-from-host.ts +8 -0
  29. package/src/__tests__/helpers/mock-http-server.ts +46 -0
  30. package/src/__tests__/helpers/mock-istty.ts +74 -0
  31. package/src/__tests__/helpers/mock-known-routes.ts +7 -0
  32. package/src/__tests__/helpers/mock-kv.ts +27 -27
  33. package/src/__tests__/helpers/mock-oauth-flow.ts +252 -0
  34. package/src/__tests__/helpers/mock-process.ts +39 -0
  35. package/src/__tests__/helpers/mock-stdin.ts +82 -77
  36. package/src/__tests__/helpers/mock-web-socket.ts +21 -21
  37. package/src/__tests__/helpers/msw/handlers/access.ts +13 -0
  38. package/src/__tests__/helpers/msw/handlers/deployments.ts +59 -0
  39. package/src/__tests__/helpers/msw/handlers/namespaces.ts +104 -0
  40. package/src/__tests__/helpers/msw/handlers/oauth.ts +36 -0
  41. package/src/__tests__/helpers/msw/handlers/r2.ts +80 -0
  42. package/src/__tests__/helpers/msw/handlers/script.ts +75 -0
  43. package/src/__tests__/helpers/msw/handlers/user.ts +63 -0
  44. package/src/__tests__/helpers/msw/handlers/zones.ts +22 -0
  45. package/src/__tests__/helpers/msw/index.ts +21 -0
  46. package/src/__tests__/helpers/run-in-tmp.ts +28 -22
  47. package/src/__tests__/helpers/run-wrangler.ts +8 -8
  48. package/src/__tests__/helpers/worker-scripts/child-wrangler.toml +1 -0
  49. package/src/__tests__/helpers/worker-scripts/hello-world-worker.js +5 -0
  50. package/src/__tests__/helpers/worker-scripts/hello-world-wrangler.toml +1 -0
  51. package/src/__tests__/helpers/worker-scripts/parent-worker.js +8 -0
  52. package/src/__tests__/helpers/worker-scripts/parent-wrangler.toml +5 -0
  53. package/src/__tests__/helpers/write-worker-source.ts +31 -0
  54. package/src/__tests__/helpers/write-wrangler-toml.ts +9 -9
  55. package/src/__tests__/https-options.test.ts +144 -108
  56. package/src/__tests__/index.test.ts +248 -967
  57. package/src/__tests__/init.test.ts +2900 -0
  58. package/src/__tests__/jest.setup.ts +167 -34
  59. package/src/__tests__/kv.test.ts +1661 -1366
  60. package/src/__tests__/logger.test.ts +141 -0
  61. package/src/__tests__/metrics.test.ts +450 -0
  62. package/src/__tests__/middleware.scheduled.test.ts +135 -0
  63. package/src/__tests__/middleware.test.ts +726 -0
  64. package/src/__tests__/package-manager.test.ts +312 -165
  65. package/src/__tests__/pages-deployment-tail.test.ts +820 -0
  66. package/src/__tests__/pages.test.ts +2437 -77
  67. package/src/__tests__/parse.test.ts +253 -245
  68. package/src/__tests__/paths.test.ts +39 -0
  69. package/src/__tests__/publish.test.ts +7569 -3445
  70. package/src/__tests__/pubsub.test.ts +370 -0
  71. package/src/__tests__/queues.test.ts +371 -0
  72. package/src/__tests__/r2.test.ts +388 -193
  73. package/src/__tests__/route.test.ts +22 -22
  74. package/src/__tests__/secret.test.ts +626 -407
  75. package/src/__tests__/tail.test.ts +680 -442
  76. package/src/__tests__/test-old-node-version.js +31 -0
  77. package/src/__tests__/type-generation.test.ts +226 -0
  78. package/src/__tests__/user.test.ts +155 -0
  79. package/src/__tests__/utils-collectKeyValues.test.ts +47 -0
  80. package/src/__tests__/validate-dev-props.test.ts +56 -0
  81. package/src/__tests__/version.test.ts +35 -0
  82. package/src/__tests__/whoami.test.tsx +266 -88
  83. package/src/__tests__/worker-namespace.test.ts +326 -0
  84. package/src/abort.d.ts +3 -0
  85. package/src/api/dev.ts +210 -0
  86. package/src/api/index.ts +2 -0
  87. package/src/bundle-reporter.tsx +68 -0
  88. package/src/bundle.ts +791 -123
  89. package/src/cfetch/index.ts +123 -67
  90. package/src/cfetch/internal.ts +216 -92
  91. package/src/cli.ts +23 -14
  92. package/src/config/README.md +1 -1
  93. package/src/config/config.ts +236 -179
  94. package/src/config/diagnostics.ts +61 -61
  95. package/src/config/environment.ts +506 -316
  96. package/src/config/index.ts +310 -38
  97. package/src/config/validation-helpers.ts +385 -342
  98. package/src/config/validation.ts +1970 -1099
  99. package/src/config-cache.ts +85 -0
  100. package/src/create-worker-preview.ts +240 -124
  101. package/src/create-worker-upload-form.ts +300 -201
  102. package/src/d1/backups.tsx +218 -0
  103. package/src/d1/constants.ts +2 -0
  104. package/src/d1/create.tsx +63 -0
  105. package/src/d1/delete.tsx +56 -0
  106. package/src/d1/execute.tsx +352 -0
  107. package/src/d1/formatTimeAgo.ts +14 -0
  108. package/src/d1/index.ts +99 -0
  109. package/src/d1/list.tsx +48 -0
  110. package/src/d1/migrations.tsx +446 -0
  111. package/src/d1/options.ts +22 -0
  112. package/src/d1/types.tsx +24 -0
  113. package/src/d1/utils.ts +48 -0
  114. package/src/delete.ts +108 -0
  115. package/src/deployments.ts +77 -0
  116. package/src/deprecated/index.ts +438 -0
  117. package/src/dev/dev-vars.ts +39 -0
  118. package/src/dev/dev.tsx +526 -328
  119. package/src/dev/get-local-persistence-path.tsx +31 -0
  120. package/src/dev/local.tsx +867 -213
  121. package/src/dev/remote.tsx +592 -192
  122. package/src/dev/start-server.ts +538 -0
  123. package/src/dev/use-esbuild.ts +184 -84
  124. package/src/dev/validate-dev-props.ts +31 -0
  125. package/src/dev-registry.tsx +201 -0
  126. package/src/dev.tsx +905 -0
  127. package/src/dialogs.tsx +150 -59
  128. package/src/dispatch-namespace.ts +207 -0
  129. package/src/durable.ts +102 -0
  130. package/src/entry.ts +260 -171
  131. package/src/environment-variables.ts +40 -23
  132. package/src/errors.ts +11 -0
  133. package/src/git-client.ts +124 -0
  134. package/src/global-wrangler-config-path.ts +26 -0
  135. package/src/https-options.ts +85 -80
  136. package/src/index.tsx +634 -2341
  137. package/src/init.ts +970 -0
  138. package/src/inspect.ts +707 -557
  139. package/src/intl-polyfill.d.ts +123 -123
  140. package/src/is-ci.ts +14 -0
  141. package/src/is-interactive.ts +16 -0
  142. package/src/kv/helpers.ts +430 -0
  143. package/src/kv/index.ts +596 -0
  144. package/src/logger.ts +92 -0
  145. package/src/metrics/index.ts +5 -0
  146. package/src/metrics/metrics-config.ts +239 -0
  147. package/src/metrics/metrics-dispatcher.ts +96 -0
  148. package/src/metrics/metrics-usage-headers.ts +24 -0
  149. package/src/metrics/send-event.ts +96 -0
  150. package/src/miniflare-cli/assets.ts +215 -0
  151. package/src/miniflare-cli/index.ts +206 -30
  152. package/src/miniflare-cli/request-context.ts +40 -0
  153. package/src/module-collection.ts +222 -213
  154. package/src/open-in-browser.ts +8 -16
  155. package/src/package-manager.ts +183 -90
  156. package/src/pages/build.tsx +270 -0
  157. package/src/pages/constants.ts +18 -0
  158. package/src/pages/deployment-tails.tsx +284 -0
  159. package/src/pages/deployments.tsx +84 -0
  160. package/src/pages/dev.tsx +708 -0
  161. package/src/pages/errors.ts +66 -0
  162. package/src/pages/functions/buildPlugin.ts +107 -0
  163. package/src/pages/functions/buildWorker.ts +166 -0
  164. package/src/pages/functions/filepath-routing.test.ts +234 -0
  165. package/src/pages/functions/filepath-routing.ts +189 -0
  166. package/src/pages/functions/identifiers.ts +78 -0
  167. package/src/pages/functions/routes-consolidation.test.ts +250 -0
  168. package/src/pages/functions/routes-consolidation.ts +73 -0
  169. package/src/pages/functions/routes-transformation.test.ts +282 -0
  170. package/src/pages/functions/routes-transformation.ts +115 -0
  171. package/src/pages/functions/routes-validation.test.ts +403 -0
  172. package/src/pages/functions/routes-validation.ts +202 -0
  173. package/src/pages/functions/routes.ts +151 -0
  174. package/src/pages/functions.tsx +82 -0
  175. package/src/pages/hash.tsx +13 -0
  176. package/src/pages/index.tsx +102 -0
  177. package/src/pages/projects.tsx +169 -0
  178. package/src/pages/prompt-select-project.tsx +31 -0
  179. package/src/pages/publish.tsx +451 -0
  180. package/src/pages/types.ts +41 -0
  181. package/src/pages/upload.tsx +426 -0
  182. package/src/pages/utils.ts +23 -0
  183. package/src/parse.ts +224 -121
  184. package/src/paths.ts +53 -8
  185. package/src/proxy.ts +624 -375
  186. package/src/publish/index.ts +270 -0
  187. package/src/publish/publish.ts +1035 -0
  188. package/src/pubsub/index.ts +286 -0
  189. package/src/pubsub/pubsub-commands.tsx +624 -0
  190. package/src/queues/cli/commands/consumer/add.ts +71 -0
  191. package/src/queues/cli/commands/consumer/index.ts +22 -0
  192. package/src/queues/cli/commands/consumer/remove.ts +38 -0
  193. package/src/queues/cli/commands/create.ts +25 -0
  194. package/src/queues/cli/commands/delete.ts +26 -0
  195. package/src/queues/cli/commands/index.ts +33 -0
  196. package/src/queues/cli/commands/list.ts +25 -0
  197. package/src/queues/client.ts +135 -0
  198. package/src/r2/constants.ts +4 -0
  199. package/src/r2/helpers.ts +131 -0
  200. package/src/r2/index.ts +289 -0
  201. package/src/routes.ts +140 -0
  202. package/src/secret/index.ts +378 -0
  203. package/src/selfsigned.d.ts +23 -23
  204. package/src/sites.tsx +283 -191
  205. package/src/tail/createTail.ts +379 -0
  206. package/src/tail/filters.ts +108 -110
  207. package/src/tail/index.ts +211 -296
  208. package/src/tail/printing.ts +92 -47
  209. package/src/type-generation.ts +173 -0
  210. package/src/update-check.ts +19 -0
  211. package/src/user/access.ts +69 -0
  212. package/src/user/choose-account.tsx +69 -0
  213. package/src/user/env-vars.ts +46 -0
  214. package/src/user/generate-auth-url.ts +33 -0
  215. package/src/user/generate-random-state.ts +16 -0
  216. package/src/user/index.ts +3 -0
  217. package/src/user/user.tsx +1192 -0
  218. package/src/utils/collectKeyValues.ts +14 -0
  219. package/src/whoami.tsx +142 -42
  220. package/src/worker.ts +182 -100
  221. package/src/yargs-types.ts +24 -0
  222. package/src/zones.ts +191 -0
  223. package/templates/__tests__/pages-dev-util.test.ts +128 -0
  224. package/templates/checked-fetch.js +17 -0
  225. package/templates/d1-beta-facade.js +205 -0
  226. package/templates/first-party-worker-module-facade.ts +18 -0
  227. package/templates/format-dev-errors.ts +32 -0
  228. package/templates/gitignore +171 -0
  229. package/templates/init-tests/test-jest-new-worker.js +25 -0
  230. package/templates/init-tests/test-vitest-new-worker.js +26 -0
  231. package/templates/middleware/common.ts +62 -0
  232. package/templates/middleware/loader-modules.ts +84 -0
  233. package/templates/middleware/loader-sw.ts +227 -0
  234. package/templates/middleware/middleware-miniflare3-json-error.ts +20 -0
  235. package/templates/middleware/middleware-pretty-error.ts +40 -0
  236. package/templates/middleware/middleware-scheduled.ts +15 -0
  237. package/templates/new-worker-scheduled.js +17 -0
  238. package/templates/new-worker-scheduled.ts +32 -0
  239. package/templates/new-worker.js +3 -3
  240. package/templates/new-worker.ts +18 -3
  241. package/templates/no-op-worker.js +10 -0
  242. package/templates/pages-dev-pipeline.ts +28 -0
  243. package/templates/pages-dev-util.ts +52 -0
  244. package/templates/pages-shim.ts +9 -0
  245. package/templates/pages-template-plugin.ts +171 -0
  246. package/templates/pages-template-worker.ts +189 -0
  247. package/templates/serve-static-assets.ts +63 -0
  248. package/templates/service-bindings-module-facade.js +54 -0
  249. package/templates/service-bindings-sw-facade.js +42 -0
  250. package/templates/tsconfig.json +96 -95
  251. package/wrangler-dist/cli.d.ts +893 -0
  252. package/wrangler-dist/cli.js +116238 -94482
  253. package/miniflare-dist/index.mjs.map +0 -7
  254. package/pages/functions/buildWorker.ts +0 -62
  255. package/pages/functions/filepath-routing.test.ts +0 -223
  256. package/pages/functions/filepath-routing.ts +0 -181
  257. package/pages/functions/identifiers.ts +0 -78
  258. package/pages/functions/routes.ts +0 -151
  259. package/pages/functions/template-worker.ts +0 -130
  260. package/src/__tests__/helpers/faye-websocket.d.ts +0 -6
  261. package/src/__tests__/logout.test.ts +0 -52
  262. package/src/__tests__/sentry.test.ts +0 -146
  263. package/src/kv.ts +0 -319
  264. package/src/miniflare-cli/enum-keys.ts +0 -17
  265. package/src/pages.tsx +0 -1061
  266. package/src/publish.ts +0 -350
  267. package/src/r2.ts +0 -50
  268. package/src/reporting.ts +0 -131
  269. package/src/user.tsx +0 -1127
  270. package/templates/static-asset-facade.js +0 -47
  271. package/vendor/@cloudflare/kv-asset-handler/CHANGELOG.md +0 -332
  272. package/vendor/@cloudflare/kv-asset-handler/LICENSE_APACHE +0 -176
  273. package/vendor/@cloudflare/kv-asset-handler/LICENSE_MIT +0 -25
  274. package/vendor/@cloudflare/kv-asset-handler/README.md +0 -245
  275. package/vendor/@cloudflare/kv-asset-handler/dist/index.d.ts +0 -32
  276. package/vendor/@cloudflare/kv-asset-handler/dist/index.js +0 -354
  277. package/vendor/@cloudflare/kv-asset-handler/dist/mocks.d.ts +0 -13
  278. package/vendor/@cloudflare/kv-asset-handler/dist/mocks.js +0 -148
  279. package/vendor/@cloudflare/kv-asset-handler/dist/test/getAssetFromKV.d.ts +0 -1
  280. package/vendor/@cloudflare/kv-asset-handler/dist/test/getAssetFromKV.js +0 -436
  281. package/vendor/@cloudflare/kv-asset-handler/dist/test/mapRequestToAsset.d.ts +0 -1
  282. package/vendor/@cloudflare/kv-asset-handler/dist/test/mapRequestToAsset.js +0 -40
  283. package/vendor/@cloudflare/kv-asset-handler/dist/test/serveSinglePageApp.d.ts +0 -1
  284. package/vendor/@cloudflare/kv-asset-handler/dist/test/serveSinglePageApp.js +0 -42
  285. package/vendor/@cloudflare/kv-asset-handler/dist/types.d.ts +0 -26
  286. package/vendor/@cloudflare/kv-asset-handler/dist/types.js +0 -31
  287. package/vendor/@cloudflare/kv-asset-handler/package.json +0 -52
  288. package/vendor/@cloudflare/kv-asset-handler/src/index.ts +0 -296
  289. package/vendor/@cloudflare/kv-asset-handler/src/mocks.ts +0 -136
  290. package/vendor/@cloudflare/kv-asset-handler/src/test/getAssetFromKV.ts +0 -464
  291. package/vendor/@cloudflare/kv-asset-handler/src/test/mapRequestToAsset.ts +0 -33
  292. package/vendor/@cloudflare/kv-asset-handler/src/test/serveSinglePageApp.ts +0 -42
  293. package/vendor/@cloudflare/kv-asset-handler/src/types.ts +0 -39
  294. package/vendor/wrangler-mime/CHANGELOG.md +0 -289
  295. package/vendor/wrangler-mime/LICENSE +0 -21
  296. package/vendor/wrangler-mime/Mime.js +0 -97
  297. package/vendor/wrangler-mime/README.md +0 -187
  298. package/vendor/wrangler-mime/cli.js +0 -46
  299. package/vendor/wrangler-mime/index.js +0 -4
  300. package/vendor/wrangler-mime/lite.js +0 -4
  301. package/vendor/wrangler-mime/package.json +0 -52
  302. package/vendor/wrangler-mime/types/other.js +0 -1
  303. package/vendor/wrangler-mime/types/standard.js +0 -1
  304. package/wrangler-dist/cli.js.map +0 -7
@@ -1,203 +1,603 @@
1
- import assert from "node:assert";
2
1
  import { readFile } from "node:fs/promises";
3
2
  import path from "node:path";
4
- import { useState, useEffect, useRef } from "react";
5
- import { createWorkerPreview } from "../create-worker-preview";
3
+ import React, { useState, useEffect, useRef } from "react";
4
+ import { useErrorHandler } from "react-error-boundary";
5
+ import { printBundleSize } from "../bundle-reporter";
6
+ import {
7
+ createPreviewSession,
8
+ createWorkerPreview,
9
+ } from "../create-worker-preview";
6
10
  import useInspector from "../inspect";
7
- import { usePreviewServer } from "../proxy";
11
+ import { logger } from "../logger";
12
+ import { startPreviewServer, usePreviewServer } from "../proxy";
8
13
  import { syncAssets } from "../sites";
9
- import type { CfPreviewToken } from "../create-worker-preview";
14
+ import {
15
+ ChooseAccount,
16
+ getAccountChoices,
17
+ requireApiToken,
18
+ saveAccountToCache,
19
+ } from "../user";
20
+ import type { Route } from "../config/environment";
21
+ import type {
22
+ CfPreviewToken,
23
+ CfPreviewSession,
24
+ } from "../create-worker-preview";
10
25
  import type { AssetPaths } from "../sites";
11
- import type { CfModule, CfWorkerInit, CfScriptFormat } from "../worker";
26
+ import type { ChooseAccountItem } from "../user";
27
+ import type {
28
+ CfModule,
29
+ CfWorkerInit,
30
+ CfScriptFormat,
31
+ CfAccount,
32
+ CfWorkerContext,
33
+ } from "../worker";
12
34
  import type { EsbuildBundle } from "./use-esbuild";
13
35
 
14
- export function Remote(props: {
15
- name: string | undefined;
16
- bundle: EsbuildBundle | undefined;
17
- format: CfScriptFormat | undefined;
18
- public: undefined | string;
19
- assetPaths: undefined | AssetPaths;
20
- port: number;
21
- ip: string;
22
- localProtocol: "https" | "http";
23
- inspectorPort: number;
24
- accountId: undefined | string;
25
- apiToken: undefined | string;
26
- bindings: CfWorkerInit["bindings"];
27
- compatibilityDate: string | undefined;
28
- compatibilityFlags: undefined | string[];
29
- usageModel: undefined | "bundled" | "unbound";
30
- env: string | undefined;
31
- legacyEnv: boolean | undefined;
32
- zone: { id: string; host: string } | undefined;
36
+ interface RemoteProps {
37
+ name: string | undefined;
38
+ bundle: EsbuildBundle | undefined;
39
+ format: CfScriptFormat | undefined;
40
+ isWorkersSite: boolean;
41
+ assetPaths: AssetPaths | undefined;
42
+ port: number;
43
+ ip: string;
44
+ localProtocol: "https" | "http";
45
+ inspect: boolean;
46
+ inspectorPort: number;
47
+ accountId: string | undefined;
48
+ bindings: CfWorkerInit["bindings"];
49
+ compatibilityDate: string;
50
+ compatibilityFlags: string[] | undefined;
51
+ usageModel: "bundled" | "unbound" | undefined;
52
+ env: string | undefined;
53
+ legacyEnv: boolean | undefined;
54
+ zone: string | undefined;
55
+ host: string | undefined;
56
+ routes: Route[] | undefined;
57
+ onReady?: ((ip: string, port: number) => void) | undefined;
58
+ sourceMapPath: string | undefined;
59
+ sendMetrics: boolean | undefined;
60
+ }
61
+
62
+ export function Remote(props: RemoteProps) {
63
+ const [accountId, setAccountId] = useState(props.accountId);
64
+ const accountChoicesRef = useRef<Promise<ChooseAccountItem[]>>();
65
+ const [accountChoices, setAccountChoices] = useState<ChooseAccountItem[]>();
66
+
67
+ const previewToken = useWorker({
68
+ name: props.name,
69
+ bundle: props.bundle,
70
+ format: props.format,
71
+ modules: props.bundle ? props.bundle.modules : [],
72
+ accountId,
73
+ bindings: props.bindings,
74
+ assetPaths: props.assetPaths,
75
+ isWorkersSite: props.isWorkersSite,
76
+ compatibilityDate: props.compatibilityDate,
77
+ compatibilityFlags: props.compatibilityFlags,
78
+ usageModel: props.usageModel,
79
+ env: props.env,
80
+ legacyEnv: props.legacyEnv,
81
+ zone: props.zone,
82
+ host: props.host,
83
+ routes: props.routes,
84
+ onReady: props.onReady,
85
+ sendMetrics: props.sendMetrics,
86
+ port: props.port,
87
+ });
88
+
89
+ usePreviewServer({
90
+ previewToken,
91
+ assetDirectory: props.isWorkersSite
92
+ ? undefined
93
+ : props.assetPaths?.assetDirectory,
94
+ localProtocol: props.localProtocol,
95
+ localPort: props.port,
96
+ ip: props.ip,
97
+ });
98
+
99
+ useInspector({
100
+ inspectorUrl:
101
+ props.inspect && previewToken
102
+ ? previewToken.inspectorUrl.href
103
+ : undefined,
104
+ port: props.inspectorPort,
105
+ logToTerminal: true,
106
+ sourceMapPath: props.sourceMapPath,
107
+ host: previewToken?.host,
108
+ });
109
+
110
+ const errorHandler = useErrorHandler();
111
+
112
+ // This effect handles the async step of fetching the available accounts for the current user.
113
+ // If only one account is available then it is just used by calling `setAccountId()`.
114
+ useEffect(() => {
115
+ if (
116
+ accountChoicesRef.current !== undefined ||
117
+ props.accountId !== undefined
118
+ ) {
119
+ return;
120
+ }
121
+ accountChoicesRef.current = getAccountChoices();
122
+ accountChoicesRef.current.then(
123
+ (accounts) => {
124
+ if (accounts.length === 1) {
125
+ saveAccountToCache({
126
+ id: accounts[0].id,
127
+ name: accounts[0].name,
128
+ });
129
+ setAccountId(accounts[0].id);
130
+ } else {
131
+ setAccountChoices(accounts);
132
+ }
133
+ },
134
+ (err) => {
135
+ errorHandler(err);
136
+ }
137
+ );
138
+ });
139
+
140
+ // If we have not already chosen an account and there are multiple accounts available
141
+ // allow the users to select one.
142
+ return accountId === undefined && accountChoices !== undefined ? (
143
+ <ChooseAccount
144
+ accounts={accountChoices}
145
+ onSelect={(selectedAccount) => {
146
+ saveAccountToCache(selectedAccount);
147
+ setAccountId(selectedAccount.id);
148
+ }}
149
+ onError={(err) => errorHandler(err)}
150
+ ></ChooseAccount>
151
+ ) : null;
152
+ }
153
+
154
+ interface RemoteWorkerProps {
155
+ name: string | undefined;
156
+ bundle: EsbuildBundle | undefined;
157
+ format: CfScriptFormat | undefined;
158
+ modules: CfModule[];
159
+ accountId: string | undefined;
160
+ bindings: CfWorkerInit["bindings"];
161
+ assetPaths: AssetPaths | undefined;
162
+ isWorkersSite: boolean;
163
+ compatibilityDate: string | undefined;
164
+ compatibilityFlags: string[] | undefined;
165
+ usageModel: "bundled" | "unbound" | undefined;
166
+ env: string | undefined;
167
+ legacyEnv: boolean | undefined;
168
+ zone: string | undefined;
169
+ host: string | undefined;
170
+ routes: Route[] | undefined;
171
+ onReady: ((ip: string, port: number) => void) | undefined;
172
+ sendMetrics: boolean | undefined;
173
+ port: number;
174
+ }
175
+
176
+ export function useWorker(
177
+ props: RemoteWorkerProps
178
+ ): CfPreviewToken | undefined {
179
+ const [session, setSession] = useState<CfPreviewSession | undefined>();
180
+ const [token, setToken] = useState<CfPreviewToken | undefined>();
181
+ const [restartCounter, setRestartCounter] = useState<number>(0);
182
+ // This is the most reliable way to detect whether
183
+ // something's "happened" in our system; We make a ref and
184
+ // mark it once we log our initial message. Refs are vars!
185
+ const startedRef = useRef(false);
186
+ // functions must be destructured before use inside a useEffect, otherwise the entire props object has to be added to the dependency array
187
+ const { onReady } = props;
188
+ // This effect sets up the preview session
189
+ useEffect(() => {
190
+ const abortController = new AbortController();
191
+ async function start() {
192
+ if (props.accountId === undefined) {
193
+ return;
194
+ }
195
+ const { workerAccount, workerContext } = getWorkerAccountAndContext({
196
+ accountId: props.accountId,
197
+ env: props.env,
198
+ legacyEnv: props.legacyEnv,
199
+ zone: props.zone,
200
+ host: props.host,
201
+ routes: props.routes,
202
+ sendMetrics: props.sendMetrics,
203
+ });
204
+
205
+ setSession(
206
+ await createPreviewSession(
207
+ workerAccount,
208
+ workerContext,
209
+ abortController.signal
210
+ )
211
+ );
212
+ }
213
+ start().catch((err) => {
214
+ // instead of logging the raw API error to the user,
215
+ // give them friendly instructions
216
+ // for error 10063 (workers.dev subdomain required)
217
+ if (err.code === 10063) {
218
+ const errorMessage =
219
+ "Error: You need to register a workers.dev subdomain before running the dev command in remote mode";
220
+ const solutionMessage =
221
+ "You can either enable local mode by pressing l, or register a workers.dev subdomain here:";
222
+ const onboardingLink = `https://dash.cloudflare.com/${props.accountId}/workers/onboarding`;
223
+ logger.error(`${errorMessage}\n${solutionMessage}\n${onboardingLink}`);
224
+ }
225
+ // we want to log the error, but not end the process
226
+ // since it could recover after the developer fixes whatever's wrong
227
+ else if ((err as { code: string }).code !== "ABORT_ERR") {
228
+ logger.error("Error while creating remote dev session:", err);
229
+ }
230
+ });
231
+
232
+ return () => {
233
+ abortController.abort();
234
+ };
235
+ }, [
236
+ props.accountId,
237
+ props.env,
238
+ props.host,
239
+ props.legacyEnv,
240
+ props.routes,
241
+ props.zone,
242
+ props.sendMetrics,
243
+ restartCounter,
244
+ ]);
245
+
246
+ // This effect uses the session to upload the worker and create a preview
247
+ useEffect(() => {
248
+ const abortController = new AbortController();
249
+ async function start() {
250
+ if (props.accountId === undefined) {
251
+ return;
252
+ }
253
+ if (session === undefined) {
254
+ return;
255
+ }
256
+ setToken(undefined); // reset token in case we're re-running
257
+
258
+ if (!props.bundle || !props.format) return;
259
+
260
+ if (!startedRef.current) {
261
+ startedRef.current = true;
262
+ } else {
263
+ logger.log("⎔ Detected changes, restarted server.");
264
+ }
265
+
266
+ const init = await createRemoteWorkerInit({
267
+ bundle: props.bundle,
268
+ modules: props.modules,
269
+ accountId: props.accountId,
270
+ name: props.name,
271
+ legacyEnv: props.legacyEnv,
272
+ env: props.env,
273
+ isWorkersSite: props.isWorkersSite,
274
+ assetPaths: props.assetPaths,
275
+ format: props.format,
276
+ bindings: props.bindings,
277
+ compatibilityDate: props.compatibilityDate,
278
+ compatibilityFlags: props.compatibilityFlags,
279
+ usageModel: props.usageModel,
280
+ });
281
+
282
+ const { workerAccount, workerContext } = getWorkerAccountAndContext({
283
+ accountId: props.accountId,
284
+ env: props.env,
285
+ legacyEnv: props.legacyEnv,
286
+ zone: props.zone,
287
+ host: props.host,
288
+ routes: props.routes,
289
+ sendMetrics: props.sendMetrics,
290
+ });
291
+
292
+ const workerPreviewToken = await createWorkerPreview(
293
+ init,
294
+ workerAccount,
295
+ workerContext,
296
+ session,
297
+ abortController.signal
298
+ );
299
+
300
+ setToken(workerPreviewToken);
301
+
302
+ // TODO: Once we get service bindings working in the
303
+ // edge preview server, we can define remote dev service bindings
304
+ // and you can uncomment this code.
305
+ // https://github.com/cloudflare/wrangler2/issues/1182
306
+
307
+ /*
308
+ if (name) {
309
+ await registerWorker(name, {
310
+ mode: "remote",
311
+ // upstream protocol is always https (https://github.com/cloudflare/wrangler2/issues/583)
312
+ protocol: "https",
313
+ port: undefined,
314
+ host: workerPreviewToken.host,
315
+ headers: {
316
+ "cf-workers-preview-token": workerPreviewToken.value,
317
+ host: workerPreviewToken.host,
318
+ },
319
+ });
320
+ }
321
+ */
322
+ onReady?.(props.host || "localhost", props.port);
323
+ }
324
+ start().catch((err) => {
325
+ // we want to log the error, but not end the process
326
+ // since it could recover after the developer fixes whatever's wrong
327
+ if ((err as { code: string }).code !== "ABORT_ERR") {
328
+ // instead of logging the raw API error to the user,
329
+ // give them friendly instructions
330
+ // for error 10063 (workers.dev subdomain required)
331
+ if (err.code === 10063) {
332
+ const errorMessage =
333
+ "Error: You need to register a workers.dev subdomain before running the dev command in remote mode";
334
+ const solutionMessage =
335
+ "You can either enable local mode by pressing l, or register a workers.dev subdomain here:";
336
+ const onboardingLink = `https://dash.cloudflare.com/${props.accountId}/workers/onboarding`;
337
+ logger.error(
338
+ `${errorMessage}\n${solutionMessage}\n${onboardingLink}`
339
+ );
340
+ } else if (err.code === 10049) {
341
+ logger.log("Preview token expired, fetching a new one");
342
+ // code 10049 happens when the preview token expires
343
+ // since we want a new preview token when this happens,
344
+ // lets increment the counter, and trigger a rerun of
345
+ // the useEffect above
346
+ setRestartCounter((prevCount) => prevCount + 1);
347
+ } else {
348
+ logger.error("Error on remote worker:", err);
349
+ }
350
+ }
351
+ });
352
+
353
+ return () => {
354
+ abortController.abort();
355
+ };
356
+ }, [
357
+ props.name,
358
+ props.bundle,
359
+ props.format,
360
+ props.accountId,
361
+ props.assetPaths,
362
+ props.isWorkersSite,
363
+ props.compatibilityDate,
364
+ props.compatibilityFlags,
365
+ props.usageModel,
366
+ props.bindings,
367
+ props.modules,
368
+ props.env,
369
+ props.legacyEnv,
370
+ props.zone,
371
+ props.host,
372
+ props.routes,
373
+ session,
374
+ onReady,
375
+ props.sendMetrics,
376
+ props.port,
377
+ ]);
378
+
379
+ return token;
380
+ }
381
+
382
+ export async function startRemoteServer(props: RemoteProps) {
383
+ let accountId = props.accountId;
384
+ if (accountId === undefined) {
385
+ const accountChoices = await getAccountChoices();
386
+ if (accountChoices.length === 1) {
387
+ saveAccountToCache({
388
+ id: accountChoices[0].id,
389
+ name: accountChoices[0].name,
390
+ });
391
+ accountId = accountChoices[0].id;
392
+ } else {
393
+ throw logger.error(
394
+ "In a non-interactive environment, it is mandatory to specify an account ID, either by assigning its value to CLOUDFLARE_ACCOUNT_ID, or as `account_id` in your `wrangler.toml` file."
395
+ );
396
+ }
397
+ }
398
+
399
+ const previewToken = await getRemotePreviewToken({
400
+ ...props,
401
+ accountId: accountId,
402
+ });
403
+
404
+ if (previewToken === undefined) {
405
+ throw logger.error("Failed to get a previewToken");
406
+ }
407
+ // start our proxy server
408
+ const previewServer = await startPreviewServer({
409
+ previewToken,
410
+ assetDirectory: props.isWorkersSite
411
+ ? undefined
412
+ : props.assetPaths?.assetDirectory,
413
+ localProtocol: props.localProtocol,
414
+ localPort: props.port,
415
+ ip: props.ip,
416
+ onReady: props.onReady,
417
+ });
418
+ if (!previewServer) {
419
+ throw logger.error("Failed to start remote server");
420
+ }
421
+ return { stop: previewServer.stop };
422
+ }
423
+
424
+ /**
425
+ * getRemotePreviewToken is a react-free version of `useWorker`.
426
+ * It returns a preview token, which we then use in our proxy server
427
+ */
428
+ export async function getRemotePreviewToken(props: RemoteProps) {
429
+ //setup the preview session
430
+ async function start() {
431
+ if (props.accountId === undefined) {
432
+ throw logger.error("no accountId provided");
433
+ }
434
+ const abortController = new AbortController();
435
+ const { workerAccount, workerContext } = getWorkerAccountAndContext({
436
+ accountId: props.accountId,
437
+ env: props.env,
438
+ legacyEnv: props.legacyEnv,
439
+ zone: props.zone,
440
+ host: props.host,
441
+ routes: props.routes,
442
+ sendMetrics: props.sendMetrics,
443
+ });
444
+ const session = await createPreviewSession(
445
+ workerAccount,
446
+ workerContext,
447
+ abortController.signal
448
+ );
449
+ //use the session to upload the worker, and create a preview
450
+
451
+ if (session === undefined) {
452
+ throw logger.error("Failed to start a session");
453
+ }
454
+ if (!props.bundle || !props.format) return;
455
+
456
+ const init = await createRemoteWorkerInit({
457
+ bundle: props.bundle,
458
+ modules: props.bundle ? props.bundle.modules : [],
459
+ accountId: props.accountId,
460
+ name: props.name,
461
+ legacyEnv: props.legacyEnv,
462
+ env: props.env,
463
+ isWorkersSite: props.isWorkersSite,
464
+ assetPaths: props.assetPaths,
465
+ format: props.format,
466
+ bindings: props.bindings,
467
+ compatibilityDate: props.compatibilityDate,
468
+ compatibilityFlags: props.compatibilityFlags,
469
+ usageModel: props.usageModel,
470
+ });
471
+ const workerPreviewToken = await createWorkerPreview(
472
+ init,
473
+ workerAccount,
474
+ workerContext,
475
+ session,
476
+ abortController.signal
477
+ );
478
+ return workerPreviewToken;
479
+ }
480
+ return start().catch((err) => {
481
+ if ((err as { code?: string })?.code !== "ABORT_ERR") {
482
+ // instead of logging the raw API error to the user,
483
+ // give them friendly instructions
484
+ // for error 10063 (workers.dev subdomain required)
485
+ if (err?.code === 10063) {
486
+ const errorMessage =
487
+ "Error: You need to register a workers.dev subdomain before running the dev command in remote mode";
488
+ const solutionMessage =
489
+ "You can either enable local mode by pressing l, or register a workers.dev subdomain here:";
490
+ const onboardingLink = `https://dash.cloudflare.com/${props.accountId}/workers/onboarding`;
491
+ logger.error(`${errorMessage}\n${solutionMessage}\n${onboardingLink}`);
492
+ } else if (err?.code === 10049) {
493
+ // code 10049 happens when the preview token expires
494
+ logger.log("Preview token expired, restart server to fetch a new one");
495
+ } else {
496
+ logger.error("Error on remote worker:", err);
497
+ }
498
+ }
499
+ });
500
+ }
501
+
502
+ async function createRemoteWorkerInit(props: {
503
+ bundle: EsbuildBundle;
504
+ modules: CfModule[];
505
+ accountId: string;
506
+ name: string | undefined;
507
+ legacyEnv: boolean | undefined;
508
+ env: string | undefined;
509
+ isWorkersSite: boolean;
510
+ assetPaths: AssetPaths | undefined;
511
+ format: CfScriptFormat;
512
+ bindings: CfWorkerInit["bindings"];
513
+ compatibilityDate: string | undefined;
514
+ compatibilityFlags: string[] | undefined;
515
+ usageModel: "bundled" | "unbound" | undefined;
33
516
  }) {
34
- assert(props.accountId, "accountId is required");
35
- assert(props.apiToken, "apiToken is required");
36
- const previewToken = useWorker({
37
- name: props.name,
38
- bundle: props.bundle,
39
- format: props.format,
40
- modules: props.bundle ? props.bundle.modules : [],
41
- accountId: props.accountId,
42
- apiToken: props.apiToken,
43
- bindings: props.bindings,
44
- assetPaths: props.assetPaths,
45
- port: props.port,
46
- compatibilityDate: props.compatibilityDate,
47
- compatibilityFlags: props.compatibilityFlags,
48
- usageModel: props.usageModel,
49
- env: props.env,
50
- legacyEnv: props.legacyEnv,
51
- zone: props.zone,
52
- });
53
-
54
- usePreviewServer({
55
- previewToken,
56
- publicRoot: props.public,
57
- localProtocol: props.localProtocol,
58
- localPort: props.port,
59
- ip: props.ip,
60
- });
61
-
62
- useInspector({
63
- inspectorUrl: previewToken ? previewToken.inspectorUrl.href : undefined,
64
- port: props.inspectorPort,
65
- logToTerminal: true,
66
- });
67
- return null;
517
+ const content = await readFile(props.bundle.path, "utf-8");
518
+
519
+ // TODO: For Dev we could show the reporter message in the interactive box.
520
+ void printBundleSize(
521
+ { name: path.basename(props.bundle.path), content: content },
522
+ props.modules
523
+ );
524
+
525
+ const assets = await syncAssets(
526
+ props.accountId,
527
+ // When we're using the newer service environments, we wouldn't
528
+ // have added the env name on to the script name. However, we must
529
+ // include it in the kv namespace name regardless (since there's no
530
+ // concept of service environments for kv namespaces yet).
531
+ props.name + (!props.legacyEnv && props.env ? `-${props.env}` : ""),
532
+ props.isWorkersSite ? props.assetPaths : undefined,
533
+ true,
534
+ false
535
+ ); // TODO: cancellable?
536
+
537
+ const init: CfWorkerInit = {
538
+ name: props.name,
539
+ main: {
540
+ name: path.basename(props.bundle.path),
541
+ type: props.format === "modules" ? "esm" : "commonjs",
542
+ content,
543
+ },
544
+ modules: props.modules.concat(
545
+ assets.manifest
546
+ ? {
547
+ name: "__STATIC_CONTENT_MANIFEST",
548
+ content: JSON.stringify(assets.manifest),
549
+ type: "text",
550
+ }
551
+ : []
552
+ ),
553
+ bindings: {
554
+ ...props.bindings,
555
+ kv_namespaces: (props.bindings.kv_namespaces || []).concat(
556
+ assets.namespace
557
+ ? { binding: "__STATIC_CONTENT", id: assets.namespace }
558
+ : []
559
+ ),
560
+ text_blobs: {
561
+ ...props.bindings.text_blobs,
562
+ ...(assets.manifest &&
563
+ props.format === "service-worker" && {
564
+ __STATIC_CONTENT_MANIFEST: "__STATIC_CONTENT_MANIFEST",
565
+ }),
566
+ },
567
+ },
568
+ migrations: undefined, // no migrations in dev
569
+ compatibility_date: props.compatibilityDate,
570
+ compatibility_flags: props.compatibilityFlags,
571
+ usage_model: props.usageModel,
572
+ keepVars: true,
573
+ logpush: false,
574
+ };
575
+
576
+ return init;
68
577
  }
69
578
 
70
- export function useWorker(props: {
71
- name: string | undefined;
72
- bundle: EsbuildBundle | undefined;
73
- format: CfScriptFormat | undefined;
74
- modules: CfModule[];
75
- accountId: string;
76
- apiToken: string;
77
- bindings: CfWorkerInit["bindings"];
78
- assetPaths: undefined | AssetPaths;
79
- port: number;
80
- compatibilityDate: string | undefined;
81
- compatibilityFlags: string[] | undefined;
82
- usageModel: undefined | "bundled" | "unbound";
83
- env: string | undefined;
84
- legacyEnv: boolean | undefined;
85
- zone: { id: string; host: string } | undefined;
86
- }): CfPreviewToken | undefined {
87
- const {
88
- name,
89
- bundle,
90
- format,
91
- modules,
92
- accountId,
93
- apiToken,
94
- bindings,
95
- assetPaths,
96
- compatibilityDate,
97
- compatibilityFlags,
98
- usageModel,
99
- port,
100
- } = props;
101
- const [token, setToken] = useState<CfPreviewToken | undefined>();
102
-
103
- // This is the most reliable way to detect whether
104
- // something's "happened" in our system; We make a ref and
105
- // mark it once we log our initial message. Refs are vars!
106
- const startedRef = useRef(false);
107
-
108
- useEffect(() => {
109
- async function start() {
110
- setToken(undefined); // reset token in case we're re-running
111
-
112
- if (!bundle || !format) return;
113
-
114
- if (!startedRef.current) {
115
- startedRef.current = true;
116
- } else {
117
- console.log("⎔ Detected changes, restarted server.");
118
- }
119
-
120
- const assets = await syncAssets(
121
- accountId,
122
- // When we're using the newer service environments, we wouldn't
123
- // have added the env name on to the script name. However, we must
124
- // include it in the kv namespace name regardless (since there's no
125
- // concept of service environments for kv namespaces yet).
126
- name + (!props.legacyEnv && props.env ? `-${props.env}` : ""),
127
- assetPaths,
128
- true
129
- ); // TODO: cancellable?
130
-
131
- const content = await readFile(bundle.path, "utf-8");
132
-
133
- const init: CfWorkerInit = {
134
- name,
135
- main: {
136
- name: path.basename(bundle.path),
137
- type: format === "modules" ? "esm" : "commonjs",
138
- content,
139
- },
140
- modules: modules.concat(
141
- assets.manifest
142
- ? {
143
- name: "__STATIC_CONTENT_MANIFEST",
144
- content: JSON.stringify(assets.manifest),
145
- type: "text",
146
- }
147
- : []
148
- ),
149
- bindings: {
150
- ...bindings,
151
- kv_namespaces: (bindings.kv_namespaces || []).concat(
152
- assets.namespace
153
- ? { binding: "__STATIC_CONTENT", id: assets.namespace }
154
- : []
155
- ),
156
- text_blobs: {
157
- ...bindings.text_blobs,
158
- ...(assets.manifest &&
159
- format === "service-worker" && {
160
- __STATIC_CONTENT_MANIFEST: "__STATIC_CONTENT_MANIFEST",
161
- }),
162
- },
163
- },
164
- migrations: undefined, // no migrations in dev
165
- compatibility_date: compatibilityDate,
166
- compatibility_flags: compatibilityFlags,
167
- usage_model: usageModel,
168
- };
169
- setToken(
170
- await createWorkerPreview(
171
- init,
172
- {
173
- accountId,
174
- apiToken,
175
- },
176
- { env: props.env, legacyEnv: props.legacyEnv, zone: props.zone }
177
- )
178
- );
179
- }
180
- start().catch((err) => {
181
- // we want to log the error, but not end the process
182
- // since it could recover after the developer fixes whatever's wrong
183
- console.error("remote worker:", err);
184
- });
185
- }, [
186
- name,
187
- bundle,
188
- format,
189
- accountId,
190
- apiToken,
191
- port,
192
- assetPaths,
193
- compatibilityDate,
194
- compatibilityFlags,
195
- usageModel,
196
- bindings,
197
- modules,
198
- props.env,
199
- props.legacyEnv,
200
- props.zone,
201
- ]);
202
- return token;
579
+ function getWorkerAccountAndContext(props: {
580
+ accountId: string;
581
+ env?: string;
582
+ legacyEnv?: boolean;
583
+ zone?: string;
584
+ host?: string;
585
+ routes: Route[] | undefined;
586
+ sendMetrics?: boolean;
587
+ }): { workerAccount: CfAccount; workerContext: CfWorkerContext } {
588
+ const workerAccount: CfAccount = {
589
+ accountId: props.accountId,
590
+ apiToken: requireApiToken(),
591
+ };
592
+
593
+ const workerContext: CfWorkerContext = {
594
+ env: props.env,
595
+ legacyEnv: props.legacyEnv,
596
+ zone: props.zone,
597
+ host: props.host,
598
+ routes: props.routes,
599
+ sendMetrics: props.sendMetrics,
600
+ };
601
+
602
+ return { workerAccount, workerContext };
203
603
  }