fix(web-components): use umbrella Storefront Web Components bundle#385
Closed
paul-phan wants to merge 1 commit into
Closed
fix(web-components): use umbrella Storefront Web Components bundle#385paul-phan wants to merge 1 commit into
paul-phan wants to merge 1 commit into
Conversation
Load the full `web-components.js` umbrella bundle instead of the per-component `web-components/account.js` file. The umbrella bundle registers all Storefront Web Components (`<shopify-account>`, `<shopify-store>`, `<shopify-product>`, `<shopify-context>`, `<shopify-data>`, …) from a single HTTP/2 stream. Currently Pilot only renders `<shopify-account>` so the per-component bundle works, but any custom section or future Pilot feature that adds a sibling component (e.g. `<shopify-store>` for a custom account widget, `<shopify-product>` for a quick-view) silently fails: the tag remains undefined, no error, just a non-functional placeholder. The umbrella bundle is the documented Shopify default and has the same wire cost as a per-component bundle (gzipped diff is negligible) while future-proofing additional component usage.
Member
Author
|
Closing — my premise here was wrong. I verified by fetching both bundles and checking which custom elements they register: The two URLs are NOT an umbrella/per-component pair — they're two different bundles for different feature areas (cart/catalog vs. account). Pilot's current Sorry for the noise on this one. Closing as not-applicable. |
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
1 participant
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.
What
Switch the Storefront Web Components script tag in
app/root.tsxfrom the per-component bundle to the umbrella bundle:Why
The per-component file registers ONLY
<shopify-account>. Pilot today renders only that one component, so it works — but any custom section or future Pilot feature that adds a sibling component (<shopify-store>,<shopify-product>,<shopify-context>,<shopify-data>) silently fails: the tag remains undefined and the browser renders nothing in its slot. There's no console error to point at the cause.This bites anyone trying to:
<shopify-product>quick-view from a custom section<shopify-store store-domain>as a parent context for multiple sub-componentsThe umbrella bundle registers every Storefront Web Component element from a single HTTP/2 stream. Gzipped size delta is negligible.
Reference
Shopify dev docs — Storefront Web Components uses the umbrella bundle in all examples; the per-component file is an advanced opt-in for size-sensitive contexts.
Risk
Minimal. The umbrella bundle is a strict superset — any storefront that worked with the per-component file continues to work, and additional component tags now resolve where they previously didn't.
Verification
<shopify-account>still mounts and signs in / shows account icon correctly.<shopify-context country="US" language="EN"></shopify-context>into a section and confirm it now registers (would have remained undefined before this change).