Test Apple Pay on iOS devices
- This feature is currently a Private Beta service and available only under Desktop and Mobile Pro, and Enterprise Pro plans. Contact our Support team or Sales team to enable this feature. For more details, check out our pricing page.
- Setting this feature will lead to an increase in session start-time by 100-180 seconds. Thus, users are expected to use this feature based on their needs.
The Apple Pay feature in iOS devices enables purchases, one-click payments, and provides additional security for financial transactions. Browserstack Automate enables you to test Apple Pay on remote iOS devices.
In this guide you will learn about:
- Supported devices
- Setting the Apple Pay capability
- Using JavaScript executor to confirm the payment
- Limitations with Apple Pay
Supported devices
| Supported Devices | iOS Version |
|---|---|
| iPhone 15 | 17 |
| iPhone 14 | 16 |
| iPhone 14 Pro | 16 |
| iPhone 13 Pro Max | 15 |
| iPhone 13 Pro | 15 |
| iPhone 13 Mini | 15 |
| iPhone 13 | 15 |
| iPhone 11 Pro | 15 |
| iPhone 11 | 15 |
| iPhone XR | 15 |
Set the Apple Pay capability
Use the capability values enableApplePay for W3C protocol and browserstack.enableApplePay for JSON wire protocol in your test scripts.
| Capability | Description |
|---|---|
enableApplePay |
Set this capability to "true" if you want to use Apple Pay in the test. |
nativeWebTap |
Set this capability to "true" if you are unable to get Apple Pay payment screen after clicking the Apple Pay button. |
| Capability | Description |
|---|---|
browserstack.enableApplePay |
Set this capability to "true" if you want to use Apple Pay in the test. |
browserstack.nativeWebTap |
Set this capability to "true" if you are unable to get Apple Pay payment screen after clicking the Apple Pay button. |
Example:
//Java example
DesiredCapabilities capabilities = new DesiredCapabilities();
HashMap<String, Object> browserstackOptions = new HashMap<String, Object>();
browserstackOptions.put("osVersion", "16");
browserstackOptions.put("deviceName", "iPhone 14");
browserstackOptions.put("enableApplePay", "true");
browserstackOptions.put("nativeWebTap", "true");
capabilities.setCapability("bstack:options", browserstackOptions);
var capabilities = {
'bstack:options' : {
"osVersion" : "16",
"deviceName" : "iPhone 14",
"enableApplePay" : "true",
"nativeWebTap" : "true",
}
}
SafariOptions capabilities = new SafariOptions();
Dictionary<string, object> browserstackOptions = new Dictionary<string, object>();
browserstackOptions.Add("osVersion", "16");
browserstackOptions.Add("deviceName", "iPhone 14");
browserstackOptions.Add("enableApplePay", "true");
browserstackOptions.Add("nativeWebTap", "true");
capabilities.AddAdditionalOption("bstack:options", browserstackOptions);
desired_cap = {
'bstack:options' : {
"osVersion" : "16",
"deviceName" : "iPhone 14",
"enableApplePay" : "true",
"nativeWebTap" : "true",
},
}
capabilities = {
'bstack:options' => {
"osVersion" => "16",
"deviceName" => "iPhone 14",
"enableApplePay" => "true",
"nativeWebTap" => "true",
},
}
DesiredCapabilities desiredCapabilities = new DesiredCapabilities();
caps.setCapability("os_version", "16");
caps.setCapability("device", "iPhone 14");
desiredCapabilities.setCapability("browserstack.enableApplePay","true");
desiredCapabilities.setCapability("browserstack.nativeWebTap","true");
var capabilities = {
"os_version" : "16",
"device" : "iPhone 14",
"browserstack.enableApplePay" : "true",
"browserstack.nativeWebTap" : "true",
}
SafariOptions capability = new SafariOptions();
capability.AddAdditionalCapability("os_version", "16");
capability.AddAdditionalCapability("device", "iPhone 14");
capability.AddAdditionalCapability("browserstack.enableApplePay", "true");
capability.AddAdditionalCapability("browserstack.nativeWebTap", "true");
desired_cap = {
"os_version" : "16",
"device" : "iPhone 14",
"browserstack.enableApplePay" : "true"
"browserstack.nativeWebTap" : "true"
}
caps = Selenium::WebDriver::Remote::Capabilities.new
caps["os_version"] = "16"
caps["device"] = "iPhone 14"
caps["browserstack.enableApplePay"] = "true"
caps["browserstack.nativeWebTap"] = "true"
Apple Pay test flow
Your test script must be modified with these custom executors along with the logic to select the UI elements in the webapp that triggers the Apple Pay payment, in the following order.
Trigger the payment workflow that uses Apple Pay as the payment method using your framework specific commands.
Unable to get Apple Pay payment screen after clicking Apple Pay button?
Set nativeWebTap capability to true
Before you click the Apple Pay button, switch to native context using the following code snippet, and wait for a few seconds for the popup to appear.
await browser.url("https://applepaydemo.apple.com/");
await browser.waitUntil(
async () => (await browser.getTitle()).match(/Apple/i),
15000,
"Title didn't match"
);
await driver.switchContext("NATIVE_APP");
const button = await $('[name="Apple Pay"]');
await button.click();
Run the BrowserStack executor for Apple Pay
If you want to add shipping, billing, or contact details, you can use the following JavaScript executor with the applePayDetails action:
driver.execute_script("browserstack_executor: {\"action\":\"applePayDetails\",
\"arguments\": {
\"shippingDetails\" : {
\"firstName\" : \"user input\",
\"lastName\" : \"user input\",
\"street\" : \"user input\",
\"addressLine2\" : \"user input\",
\"postalCode\" : \"user input\",
\"city\" : \"user input\",
\"state\" : \"user input\",
\"zip\" : \"user input\",
\"province\" : \"user input\",
\"islandName\" : \"user input\",
\"country\" : \"user input\"
},
\"billingDetails\" : {
\"firstName\" : \"user input\",
\"lastName\" : \"user input\",
\"street\" : \"user input\",
\"addressLine2\" : \"user input\",
\"postalCode\" : \"user input\",
\"city\" : \"user input\",
\"state\" : \"user input\",
\"zip\" : \"user input\",
\"province\" : \"user input\",
\"islandName\" : \"user input\",
\"country\" : \"user input\"
},
\"contact\" : {
\"email\" : \"user input\",
\"phone\" : \"user input\"
}
}
}”);
After initiating the payment flow from your automation, use the following Javascript executor to confirm the transaction.
driver.execute_script("browserstack_executor:{
\"action\":\"applePay\",
\"arguments\": {
\"confirmPayment\" : \"true\"
}
}”);
Enter the passcode 123456 to complete the payment.
driver.getKeyboard().sendKeys("123456");
Limitations with Apple Pay
On Browserstack remote iOS devices, testing with Apple Pay is limited to the following geographies:
| Geography | Country |
|---|---|
| North America | United States, Canada |
| Europe | France, Ireland, Italy, Spain, United Kingdom, Germany |
| Asia | China Mainland, Hong Kong, Taiwan, Japan, Russia, Singapore |
| Australia | Australia, New Zealand |
Related topics
Check this page for a list of various JavaScript Executors that BrowserStack offers.
We're sorry to hear that. Please share your feedback so we can do better
Contact our Support team for immediate help while we work on improving our docs.
We're continuously improving our docs. We'd love to know what you liked
- RESOURCES
Is this page helping you?
Yes
No
We're sorry to hear that. Please share your feedback so we can do better
Contact our Support team for immediate help while we work on improving our docs.
We're continuously improving our docs. We'd love to know what you liked
Thank you for your valuable feedback!
