Web component `ui-modal` in App Bridge doesn't work in RemixJS Shopify Template

Topic summary

A developer encountered an issue implementing the ui-modal web component from App Bridge in a Shopify RemixJS template. After copying the example code from the official documentation, clicking any button under the ui-title-bar caused the entire app to crash.

Resolution:
Another user identified the problem: the web component syntax isn’t compatible with Remix. They recommended using the React-specific Modal component from App Bridge’s React library instead (https://shopify.dev/docs/api/app-bridge-library/react-components/modal-component).

The original poster confirmed this solved their issue, noting they’re still learning Remix. The discussion appears resolved with a working alternative approach.

Summarized with AI on November 5. AI used: claude-sonnet-4-5-20250929.

Cool, thanks for pointing this out! I’m new to Remix, still figuring things out.