feat(app): add PWA support with service worker and update prompt#32162
Open
shoootyou wants to merge 1 commit into
Open
feat(app): add PWA support with service worker and update prompt#32162shoootyou wants to merge 1 commit into
shoootyou wants to merge 1 commit into
Conversation
…navigation fallback) Add Progressive Web App support to the browser app: - vite-plugin-pwa with registerType "prompt" so stale service workers self-heal only when the user accepts the update prompt - PwaUpdatePrompt: an idiomatic SolidJS JSX banner that surfaces a dismissible reload prompt when a new service worker is waiting; correctly unwraps the useRegisterSW Signal tuples. Its decision logic is extracted into a pure, zero-UI-import module (pwa-update.ts) and unit-tested directly, following the repo's established pattern (e.g. updater-action.ts) instead of rendering a component in bun test - navigateFallbackAllowlist as a shared, test-asserted source of truth for the SPA routes that receive the offline app-shell fallback (/, /new-session, /:dir/session/:id?, bare /:dir with /doc excluded) - enrich the shared canonical site.webmanifest (packages/ui) with installable PWA fields (id/start_url/scope, any+maskable icons, theme_color, screenshots) so packages/app keeps symlinking it — preserving the DRY favicon/manifest pipeline shared across app/web/console/enterprise Co-authored-by: yui-soul <yui-soul@users.noreply.github.com>
4 tasks
Contributor
|
The following comment was made by an LLM, it may be inaccurate: Potential Related PRs Found:
The PR supersedes #31279 (which is closed), so that's not a duplicate concern. The current PR is the clean re-implementation addressing multiple related issues (#19174, #19119, #27933, #27931, #30405, #19301). |
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.
Supersedes #31279 (closed). That branch predates the v1.17.x rework of the app build/serving layer and no longer applies/builds against current
dev, so this is a clean re-implementation rebased ondev, at parity with #31279.Issue for this PR
Closes #19174
Closes #19119
Closes #27933
Addresses #27931
Addresses #30405
Addresses #19301
Note: #30405 is also addressed by the open PR #30399 — both add
crossorigin="use-credentials"to the manifest link. Happy to drop that change if #30399 merges first.Type of change
What does this PR do?
The web UI had no service worker, so every reload re-fetched all assets and the app couldn't be installed as a PWA.
Service worker — adds
vite-plugin-pwawithregisterType: 'prompt'and Workbox precaching for the static shell (JS, CSS, fonts, icons). Only explicit SPA routes (/,/new-session,/:dir,/:dir/session/:id?) receive the navigation fallback via a sharednavigateFallbackAllowlist(extracted tosrc/pwa.ts); all other paths pass to the network. SW disabled in dev to preserve Vite HMR.Update prompt —
PwaUpdatePromptshows a non-blocking banner when a new SW is waiting. Reload activates it; Dismiss defers it. Update logic lives in a purepwa-update.tscontroller (unit-tested without rendering). Mounted outsideAppBaseProvidersso it survives ErrorBoundary and connection errors.Manifest fixes — adds
id,scope,start_url,description, andscreenshots; fixestheme_colorfrom#ffffffto#F8F7F7; separatemaskableandanyicon entries per Chrome/Lighthouse guidance. Fields live in the canonicalpackages/ui/src/assets/favicon/site.webmanifest(shared via symlink) so app/web/console/enterprise stay DRY.iOS — adds
apple-mobile-web-app-capable, status bar style, andapple-touch-iconlinks for iPad (152×152, 167×167) alongside the existing 180×180.Cache-Control —
Cache-Control: immutableon/assets/*in_headers,no-cacheon root-level assets.Proxy fix —
crossorigin="use-credentials"on the manifest link (same fix as #30399).How did you verify your code works?
bun testinpackages/apppasses (PWA allowlist, manifest field, and update-controller tests).bun run buildinpackages/app— emits prompt-modesw.jswith the allowlist; manifest, icons, and_headersresolve; built index.html carries thecrossoriginmanifest link + apple-mobile meta tags.bun typecheckclean.Checklist