Skip to content

feat(RN): Wire up accelerated checkouts with protocol events#181

Open
kieran-osgood-shopify wants to merge 1 commit into
kieran-osgood/05-15-feataddfirstprotocoleventfrom
kieran-osgood/rn-protocol/accelerated-button-events
Open

feat(RN): Wire up accelerated checkouts with protocol events#181
kieran-osgood-shopify wants to merge 1 commit into
kieran-osgood/05-15-feataddfirstprotocoleventfrom
kieran-osgood/rn-protocol/accelerated-button-events

Conversation

@kieran-osgood-shopify
Copy link
Copy Markdown
Contributor

@kieran-osgood-shopify kieran-osgood-shopify commented May 21, 2026

Stack Context

This stack is adding Checkout Protocol event support to the React Native wrapper. The parent PR introduces the first protocol event (ec.start) for the imperative present() path; this PR wires the same start event into instance-based accelerated checkout buttons.

What?

  • Adds an events?: ProtocolHandlers prop to AcceleratedCheckoutButtons using computed CheckoutProtocol keys.
  • Routes native component dispatch envelopes to JS handlers for [CheckoutProtocol.start].
  • Connects iOS accelerated checkout buttons to the existing protocol relay.
  • Exposes native supported protocol event constants through constantsToExport and warns if JS/native event lists drift.
  • Adds tests and sample usage in the RN sample cart screen.

Why?

Consumers need to observe checkout protocol events from declarative component instances, not only from ShopifyCheckout.present(). This keeps the public TypeScript interface consistent across both surfaces while intentionally keeping protocol support scoped to CheckoutProtocol.start for this PR.

How to test

  • pnpm --dir platforms/react-native/modules/@shopify/checkout-kit-react-native typecheck
  • pnpm --dir platforms/react-native/sample typecheck
  • pnpm --dir platforms/react-native test -- AcceleratedCheckoutButtons.test.tsx --runInBand
  • pnpm --dir platforms/react-native exec jest --runInBand
  • swift test --package-path platforms/react-native/modules/@shopify/checkout-kit-react-native/ios
  • Manual iOS simulator validation with agent-device: tapped the sample cart Shop Pay accelerated checkout button and confirmed the [CheckoutProtocol.start] handler ran by observing the checkout start event state during validation.

Before you merge

Important

  • I've added tests to support my implementation
  • I have read and agree with the Contribution Guidelines
  • I have read and agree with the Code of Conduct
  • I've updated the relevant platform README (platforms/swift/README.md and/or platforms/android/README.md)

Releasing a new Swift version?
  • I have bumped the version in ShopifyCheckoutKit.podspec
  • I have bumped the version in platforms/swift/Sources/ShopifyCheckoutKit/ShopifyCheckoutKit.swift
  • I have updated platforms/swift/CHANGELOG.md
  • I have updated the SwiftPM/CocoaPods version snippets in platforms/swift/README.md (major version only)
Releasing a new Android version?
  • I have bumped the versionName in platforms/android/lib/build.gradle
  • I have updated platforms/android/CHANGELOG.md
  • I have updated the Gradle/Maven version snippets in platforms/android/README.md

Copy link
Copy Markdown
Contributor Author

kieran-osgood-shopify commented May 21, 2026

Warning

This pull request is not mergeable via GitHub because a downstack PR is open. Once all requirements are satisfied, merge this PR as a stack on Graphite.
Learn more

This stack of pull requests is managed by Graphite. Learn more about stacking.

@github-actions
Copy link
Copy Markdown

github-actions Bot commented May 21, 2026

React Native — Coverage Report

Lines Statements Branches Functions
Coverage: 95%
93.99% (313/333) 88.55% (178/201) 100% (81/81)

@kieran-osgood-shopify kieran-osgood-shopify marked this pull request as ready for review May 21, 2026 11:53
@kieran-osgood-shopify kieran-osgood-shopify requested a review from a team as a code owner May 21, 2026 11:53
]}
cornerRadius={cornerRadius}
events={{
[CheckoutProtocol.start]: checkout => {
Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

still need to work on the key here - if passing a string literal it accept "ec.start" which I'm not sure we want

might be able to make this an enum instead so it has to be a key

@kieran-osgood-shopify kieran-osgood-shopify force-pushed the kieran-osgood/05-15-feataddfirstprotocolevent branch from 9dbe6eb to 9c2bce2 Compare May 21, 2026 13:38
@kieran-osgood-shopify kieran-osgood-shopify force-pushed the kieran-osgood/rn-protocol/accelerated-button-events branch from 7822725 to 34e6ab2 Compare May 21, 2026 13:38
@kieran-osgood-shopify kieran-osgood-shopify changed the title feat: add accelerated checkout protocol events feat(RN): Wire up accelerated checkouts with protocol events May 21, 2026
@kieran-osgood-shopify kieran-osgood-shopify force-pushed the kieran-osgood/05-15-feataddfirstprotocolevent branch from 9c2bce2 to f77c5ca Compare May 21, 2026 14:27
@kieran-osgood-shopify kieran-osgood-shopify force-pushed the kieran-osgood/rn-protocol/accelerated-button-events branch from 34e6ab2 to da83ecb Compare May 21, 2026 14:27
@kieran-osgood-shopify kieran-osgood-shopify force-pushed the kieran-osgood/05-15-feataddfirstprotocolevent branch from f77c5ca to c75d0f4 Compare May 21, 2026 15:08
@kieran-osgood-shopify kieran-osgood-shopify force-pushed the kieran-osgood/rn-protocol/accelerated-button-events branch from da83ecb to 6edc610 Compare May 21, 2026 15:08
@kieran-osgood-shopify kieran-osgood-shopify force-pushed the kieran-osgood/05-15-feataddfirstprotocolevent branch from c75d0f4 to 57db8b8 Compare May 21, 2026 16:11
@kieran-osgood-shopify kieran-osgood-shopify force-pushed the kieran-osgood/rn-protocol/accelerated-button-events branch from 6edc610 to 9b53f42 Compare May 21, 2026 16:11
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant