Repository navigation
fix(ui): use feature detection for crypto.randomUUID to support HTTP deployments - #1868
Merged
EItanya merged 5 commits intoMay 27, 2026
Merged
Conversation
…deployments crypto.randomUUID() requires a Secure Context (HTTPS or localhost). Deployments served over plain HTTP crash on /agents/new with "Uncaught TypeError: crypto.randomUUID is not a function". Add a generateId() utility that detects crypto.randomUUID availability at runtime and falls back to the uuid package (already a dependency) when unavailable. Replace all 8 crypto.randomUUID() call sites. Signed-off-by: wsszh <[email protected]> Signed-off-by: sup <[email protected]>
Contributor
There was a problem hiding this comment.
Pull request overview
Fixes a runtime crash on HTTP deployments where crypto.randomUUID() is unavailable outside Secure Contexts. Adds a generateId() helper with feature detection that falls back to the uuid package, and replaces all call sites.
Changes:
- Add
generateId()utility inui/src/lib/utils.tswith runtime feature detection anduuidv4 fallback. - Replace all 8
crypto.randomUUID()call sites in 4 files withgenerateId().
Reviewed changes
Copilot reviewed 5 out of 5 changed files in this pull request and generated no comments.
Show a summary per file
| File | Description |
|---|---|
ui/src/lib/utils.ts |
Adds generateId() helper and imports uuidv4 fallback. |
ui/src/lib/promptSourceRow.ts |
Switches to generateId() for prompt source row ids. |
ui/src/lib/openClawSandboxForm.ts |
Switches to generateId() for sandbox channel row ids. |
ui/src/components/prompts/FragmentEntriesEditor.tsx |
Switches 4 call sites to generateId() for fragment row ids. |
ui/src/app/agents/new/page.tsx |
Switches 2 call sites to generateId() for prompt source row ids. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
peterj
approved these changes
May 14, 2026
Charlesthebird
added a commit
that referenced
this pull request
Sep 17, 2026
`crypto.randomUUID` was fixed once in #1868 and came back when the interface was rewritten and the file holding the helper went with it. A note in a file is lost the same way twice, so the rule states it where a rewrite cannot drop it, and names the helper to use instead. `navigator.clipboard` is listed for the same reason: bare, it fails silently rather than loudly. Signed-off-by: Nicholas Bucher <[email protected]>
This was referenced Sep 17, 2026
krisztianfekete
pushed a commit
to krisztianfekete/kagent
that referenced
this pull request
Sep 17, 2026
…ries (kagent-dev#2865) --- *🤖 written by Claude (start)* ## Changelog The UI now works when served over plain http from anything but localhost, and one component throwing no longer blanks the page. ## Testing 1. `cd ui && yarn dev --host`, then open the printed **Network** URL — a LAN IP, not localhost, so not a secure context. 2. `/schedules/new` loads and takes input. On `main` it throws `crypto.randomUUID is not a function` at mount and stays blank. 3. Share a conversation and press **Copy link**. The button reports whether it worked; on `main` it silently does nothing here. 4. Put `crypto.randomUUID()` back in `ScheduledRunForm.tsx` and reload. The error renders inside the shell, nav usable, stack behind **Error details**. ## Additional Notes This reinstates kagent-dev#1868, which fixed the same crash in May. That fix lived in `ui/src/lib/utils.ts` and went with the interface rewrite. The lint rule is the part meant to outlast the next one. `randomId()` returns a v4 UUID because the control plane validates some of these ids as UUIDs. It uses `crypto.getRandomValues`, which carries no secure-context condition. The clipboard fallback answers the document's own `copy` event, as antd does. antd's `copyable` UI is not used: it reports a copy whatever `copy()` returns. Not covered: a module that throws while being evaluated. `main.tsx` never runs, so no boundary exists yet. --- *🤖 written by Claude (end)* --------- Signed-off-by: Nicholas Bucher <[email protected]>
Charlesthebird
added a commit
that referenced
this pull request
Sep 21, 2026
--- *🤖 written by Claude (start)* ## Changelog Copy buttons work on deployments served over plain http, and say so when a copy fails. ## Testing 1. `cd ui && npm run dev`, then open the app on a LAN IP rather than localhost — that origin is not a secure context, so `navigator.clipboard` is undefined. 2. Expand a tool result and press copy. The tick appears and the clipboard holds the result; before, nothing happened and nothing was said. 3. Copy a code block, the LLM-call JSON, and a share link. Each reports its outcome. ## Additional Notes This is the other half of #1868, which fixed `crypto.randomUUID` for these deployments and left the clipboard alone. That fix is already here and needs no change. `copyText` answers the document's own `copy` event rather than selecting a borrowed textarea. Nothing needs focus, so it also works inside a dialog that traps it — the share dialog's old fallback appended its textarea to `document.body` and copied nothing there while reporting success. Success is the event having fired, not what `execCommand` returns: it returns true for copying nothing. --- *🤖 written by Claude (end)* Signed-off-by: Nicholas Bucher <[email protected]> Co-authored-by: Eitan Yarmush <[email protected]>
alexdarbyshire
pushed a commit
to alexdarbyshire/kagent
that referenced
this pull request
Oct 5, 2026
…ries (kagent-dev#2865) Signed-off-by: alexdarbyshire <[email protected]> --- *🤖 written by Claude (start)* ## Changelog The UI now works when served over plain http from anything but localhost, and one component throwing no longer blanks the page. ## Testing 1. `cd ui && yarn dev --host`, then open the printed **Network** URL — a LAN IP, not localhost, so not a secure context. 2. `/schedules/new` loads and takes input. On `main` it throws `crypto.randomUUID is not a function` at mount and stays blank. 3. Share a conversation and press **Copy link**. The button reports whether it worked; on `main` it silently does nothing here. 4. Put `crypto.randomUUID()` back in `ScheduledRunForm.tsx` and reload. The error renders inside the shell, nav usable, stack behind **Error details**. ## Additional Notes This reinstates kagent-dev#1868, which fixed the same crash in May. That fix lived in `ui/src/lib/utils.ts` and went with the interface rewrite. The lint rule is the part meant to outlast the next one. `randomId()` returns a v4 UUID because the control plane validates some of these ids as UUIDs. It uses `crypto.getRandomValues`, which carries no secure-context condition. The clipboard fallback answers the document's own `copy` event, as antd does. antd's `copyable` UI is not used: it reports a copy whatever `copy()` returns. Not covered: a module that throws while being evaluated. `main.tsx` never runs, so no boundary exists yet. --- *🤖 written by Claude (end)* --------- Signed-off-by: Nicholas Bucher <[email protected]>
This file contains hidden or 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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
crypto.randomUUID()which requires a Secure Context (HTTPS or localhost). Deployments served over plain HTTP crash on/agents/newwithUncaught TypeError: crypto.randomUUID is not a function.generateId()utility inui/src/lib/utils.tsthat detectscrypto.randomUUIDavailability at runtime and falls back to theuuidpackage (already a dependency, v14) when unavailable.crypto.randomUUID()call sites across 4 source files.Changes
ui/src/lib/utils.tsgenerateId()with runtime feature detectionui/src/lib/promptSourceRow.tscrypto.randomUUID()→generateId()ui/src/lib/openClawSandboxForm.tscrypto.randomUUID()→generateId()ui/src/components/prompts/FragmentEntriesEditor.tsxcrypto.randomUUID()→generateId()ui/src/app/agents/new/page.tsxcrypto.randomUUID()→generateId()Context
crypto.randomUUID()is a Web Crypto API gated behind Secure Context. Any deployment accessed viahttp://(common in internal/dev clusters without TLS termination) crashes when rendering the agent creation form. Theuuidnpm package (v14, already inpackage.json) usescrypto.getRandomValues()which works in all contexts.The fix uses runtime feature detection (
typeof crypto.randomUUID === "function") so it works with the pre-built Docker image regardless of deployment configuration — no Helm or environment variable changes needed.ui/public/mockServiceWorker.jsalso callscrypto.randomUUID()but is auto-generated by MSW and runs in a Service Worker context (always secure), so it is not modified.Test plan
cd ui && npm run buildpassescd ui && npm run lintpasses/agents/new→ "Skip wizard" → form loads without crashcrypto.randomUUID()grep -r 'crypto.randomUUID' ui/src/returns onlyutils.tsfeature-detection branch (andmockServiceWorker.js)