<Button> onPress component open new tab or style a <Link> as a button

Retired Boards Appdev Extensions

Topic summary

Goal: Provide a primary CTA in a Checkout Extension that opens an external experience in a new tab, then returns users to checkout, without losing prominent button styling.

Key constraints:

  • window is not accessible in the Checkout UI worker, so programmatic window.open/onPress isn’t possible.
  • with only a to prop renders as an inline , reducing CTA prominence.

Use cases impacted:

  • Upsells linking to product details without leaving checkout entirely (new tab preferred).
  • Manual payment methods requiring navigation to an external approval portal.

Shopify response:

  • Acknowledged limitation and shared the use case with the product team. No resolution or timeline provided.

Latest workaround/update:

  • supports the same to attribute (e.g., ), allowing link behavior with styling better suited to a CTA than . Documentation link included. This addresses styling, but it’s not confirmed to force a new tab.

Status:

  • Opening a new tab via onPress remains unsupported. Thread remains open; workaround improves CTA styling and linking, but the new-tab requirement is unresolved.
Summarized with AI on December 19. AI used: gpt-5.
5

Also interested in this. Pressable says it’s good for replacing a Link when Link styling isn’t desirable, but then how do we actually link somewhere?

EDIT: lol it’s the exact same attribute, “to”. It can do exactly this and it works, e.g.

<Pressable to={ url }>

Documentation