Testing Apple Pay Locally

Prerequisites

• Access to dashboard.stripe.com for the contributions account(s)
• Safari on Mac running macOS Sierra or later.
• An iPhone (not an iPad; Safari doesn't support them yet) with a card in its Wallet paired to your Mac with Handoff, or a Mac with TouchID. Instructions on how to set this up can be found on Apple's Support website. If you don't have an iPhone with apple pay enabled yourself, see this document for information about the test phone

Steps

• Install ngrok (brew install ngrok). Apex One Security Software may quarantine the binary, use its Console to Restore the ngrok binary)
• In support-frontend/support-frontend, run yarn build-prod (make sure you are not already running support-frontend)
• Run ./devrun.sh
• In a new tab run ngrok http 9210
• Go to the https://<ngrok generated sub domain>.ngrok-free.app address in Safari. This is where you will be testing that apple pay works.
• Disable CORs in the browser (Develop -> Disable Cross-Origin Restrictions)
• In another window go to https://dashboard.stripe.com/settings/payments/apple_pay
• Make sure you select the correct account in the account selector in the top left of the screen
• Go to Settings->Payment Methods -> Apple Pay
• Click + Add new domain
• Add the ngrok domain the site is hosted on (.ngrok.io)
• Click Download verification file... ('apple-developer-merchantid-domain-association')
• Use to replace file in location 'support-frontend/support-frontend/public/.well-known/apple-developer-merchantid-domain-association'
• Click Add, you should see this file being checked successfully (200) within the ngrok tab
• Go back to your Safari tab with your local version of support frontend hosted on it
• Click Single Contribution
• You should see Apple Pay

You can make a payment in this test mode and your card will not be charged, don’t worry!