@economist/web-apple-pay 1.10.0 → 2.0.0-beta.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +11 -1
- package/dist/index.js +41 -41
- package/dist/src/apple-pay-button.d.ts +13 -16
- package/dist/src/apple-pay-button.js +41 -40
- package/dist/src/apple-pay-button.stories.js +41 -40
- package/dist/src/apple-pay-modal.stories.js +41 -40
- package/dist/src/constants.d.ts +6 -17
- package/dist/src/constants.js +0 -2
- package/dist/src/index.d.ts +1 -1
- package/dist/src/index.js +41 -41
- package/dist/src/utils/applePayExpressEligibility.d.ts +10 -8
- package/dist/src/utils/applePayExpressEligibility.js +2 -2
- package/dist/src/utils/expressCheckoutTracking.d.ts +3 -3
- package/dist/src/utils/expressCheckoutTracking.js +1 -2
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -121,10 +121,19 @@ Consumers should listen for this event and continue payment orchestration.
|
|
|
121
121
|
- `configureApplePay(config)`: sets required runtime config (merchant ID and wallet API base URL, with optional debug bypass).
|
|
122
122
|
- `ApplePayButton`: button component class.
|
|
123
123
|
- `whenReady(): Promise<void>` — resolves when the current render lifecycle completes (available or hidden). Resolves immediately if called before the element is connected.
|
|
124
|
+
- `createIfEnabled(offer, country, entryPoint?)`: returns a configured button or `null`.
|
|
125
|
+
- `DUAL_OFFER_BANNER` (or omitted): always-on after homepage + Safari/Apple eligibility and offer exclusions — no banners Amplitude experiment / `$exposure`.
|
|
126
|
+
- `PAYWALL`: experiment-gated via `apple-pay-express-checkout-on-paywalls` (`treatment` or QA URL).
|
|
127
|
+
- `REGWALL`: inert — always returns `null`.
|
|
124
128
|
- `ApplePayModal`: modal component class.
|
|
125
129
|
- `ensureApplePayLogoSymbol()`: logo symbol injection helper.
|
|
130
|
+
- `APPLE_PAY_EXPRESS_PAYWALLS_EXPERIMENT_KEY`: Amplitude flag key for paywalls experiment gating / `$exposure`.
|
|
126
131
|
- `Offer`: offer contract type used by component props.
|
|
127
132
|
|
|
133
|
+
### Breaking changes
|
|
134
|
+
|
|
135
|
+
- `APPLE_PAY_EXPRESS_EXPERIMENT_KEY` (banners experiment flag) is no longer exported. Use `APPLE_PAY_EXPRESS_PAYWALLS_EXPERIMENT_KEY` for paywalls, or drop the import if you only needed the retired banners key.
|
|
136
|
+
|
|
128
137
|
## Troubleshooting
|
|
129
138
|
|
|
130
139
|
### Button does not appear
|
|
@@ -133,7 +142,8 @@ Check:
|
|
|
133
142
|
|
|
134
143
|
- `configureApplePay(...)` was called before rendering (with a valid `merchantId` and `walletApiBaseUrl`)
|
|
135
144
|
- device/browser supports Apple Pay (Safari on Apple device required)
|
|
136
|
-
-
|
|
145
|
+
- for paywalls: Amplitude treatment (or `?FEATURE_APPLE_PAY_EXPRESS_CHECKOUT`) is satisfied
|
|
146
|
+
- for banners: homepage + Safari/Apple eligibility (and consumer kill switch off)
|
|
137
147
|
- offer variant is not excluded (`bundle`, `insider_print`)
|
|
138
148
|
|
|
139
149
|
### Logged-in checkbox copy looks wrong
|
package/dist/index.js
CHANGED
|
@@ -1310,7 +1310,6 @@ var ApplePayEntryPoint = /* @__PURE__ */ ((ApplePayEntryPoint2) => {
|
|
|
1310
1310
|
ApplePayEntryPoint2["DUAL_OFFER_BANNER"] = "dual_offer_banner";
|
|
1311
1311
|
return ApplePayEntryPoint2;
|
|
1312
1312
|
})(ApplePayEntryPoint || {});
|
|
1313
|
-
var APPLE_PAY_EXPRESS_EXPERIMENT_KEY = "apple-pay-express-checkout-on-banners";
|
|
1314
1313
|
var APPLE_PAY_EXPRESS_PAYWALLS_EXPERIMENT_KEY = "apple-pay-express-checkout-on-paywalls";
|
|
1315
1314
|
var APPLE_PAY_EXPRESS_VARIANTS = {
|
|
1316
1315
|
CONTROL: "control",
|
|
@@ -1354,7 +1353,7 @@ var track = (action, extra) => {
|
|
|
1354
1353
|
...extra
|
|
1355
1354
|
});
|
|
1356
1355
|
};
|
|
1357
|
-
var trackApplePayExperimentExposure = (variant, experimentKey, flagKey
|
|
1356
|
+
var trackApplePayExperimentExposure = (variant, experimentKey, flagKey) => {
|
|
1358
1357
|
const isActiveVariant = variant === APPLE_PAY_EXPRESS_VARIANTS.CONTROL || variant === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
1359
1358
|
if (!isActiveVariant) {
|
|
1360
1359
|
return;
|
|
@@ -2006,14 +2005,14 @@ var getExperimentKeyFromNextData = (flagKey) => {
|
|
|
2006
2005
|
|
|
2007
2006
|
// src/utils/applePayExpressEligibility.ts
|
|
2008
2007
|
var isApplePayExpressHomepage = (pathname = window.location.pathname) => pathname === "/";
|
|
2009
|
-
var
|
|
2008
|
+
var isEligibleForApplePayExpressBanner = () => isApplePayExpressHomepage() && isAppleDeviceOrSafari();
|
|
2010
2009
|
var isEligibleForApplePayExpressPaywallExperiment = () => isAppleDeviceOrSafari();
|
|
2011
2010
|
|
|
2012
2011
|
// src/apple-pay-button.ts
|
|
2013
2012
|
var ENTRY_POINT_CONFIG = {
|
|
2014
2013
|
["dual_offer_banner" /* DUAL_OFFER_BANNER */]: {
|
|
2015
|
-
isEligible:
|
|
2016
|
-
experimentFlagKey
|
|
2014
|
+
isEligible: isEligibleForApplePayExpressBanner
|
|
2015
|
+
// no experimentFlagKey → always-on after eligibility / exclusions
|
|
2017
2016
|
},
|
|
2018
2017
|
["article_paywall" /* PAYWALL */]: {
|
|
2019
2018
|
isEligible: isEligibleForApplePayExpressPaywallExperiment,
|
|
@@ -2021,7 +2020,7 @@ var ENTRY_POINT_CONFIG = {
|
|
|
2021
2020
|
},
|
|
2022
2021
|
["article_regwall" /* REGWALL */]: {
|
|
2023
2022
|
isEligible: () => true,
|
|
2024
|
-
|
|
2023
|
+
enabled: false
|
|
2025
2024
|
}
|
|
2026
2025
|
};
|
|
2027
2026
|
var FEATURE_APPLE_PAY_EXPRESS_CHECKOUT = "FEATURE_APPLE_PAY_EXPRESS_CHECKOUT";
|
|
@@ -2040,27 +2039,24 @@ var ApplePayButton = class _ApplePayButton extends HTMLElement {
|
|
|
2040
2039
|
define(_ApplePayButton.tag, _ApplePayButton);
|
|
2041
2040
|
}
|
|
2042
2041
|
/**
|
|
2043
|
-
* Creates and configures an ApplePayButton when the
|
|
2042
|
+
* Creates and configures an ApplePayButton when the entry point allows it.
|
|
2044
2043
|
*
|
|
2045
|
-
*
|
|
2046
|
-
*
|
|
2047
|
-
* - {@link
|
|
2044
|
+
* - `DUAL_OFFER_BANNER` (or omitted): always-on after eligibility / exclusions —
|
|
2045
|
+
* no banners experiment read and no banners `$exposure`.
|
|
2046
|
+
* - `PAYWALL`: experiment-gated via {@link APPLE_PAY_EXPRESS_PAYWALLS_EXPERIMENT_KEY}
|
|
2047
|
+
* (`treatment` or QA URL param). The host must set up
|
|
2048
|
+
* `window.experimentIntegration` before calling for this entry point.
|
|
2049
|
+
* - `REGWALL`: inert — always returns null.
|
|
2048
2050
|
*
|
|
2049
|
-
*
|
|
2050
|
-
*
|
|
2051
|
-
*
|
|
2052
|
-
*
|
|
2053
|
-
*
|
|
2054
|
-
*
|
|
2055
|
-
* **Transition period:** the legacy `FEATURE_APPLE_PAY_EXPRESS_CHECKOUT` URL param
|
|
2056
|
-
* gate is also evaluated as a fallback until all host apps have integrated
|
|
2057
|
-
* `window.experimentIntegration`. Once all consumers are migrated, the URL param
|
|
2058
|
-
* fallback will be removed.
|
|
2051
|
+
* **PAYWALL only — transition period:** the legacy
|
|
2052
|
+
* `FEATURE_APPLE_PAY_EXPRESS_CHECKOUT` URL param can show the button without
|
|
2053
|
+
* treatment (and without inflating `$exposure`). For banners, the same URL
|
|
2054
|
+
* param / `BYPASS_APPLE_PAY_CHECKS` only bypass **eligibility**, not an
|
|
2055
|
+
* experiment gate.
|
|
2059
2056
|
*
|
|
2060
2057
|
* **Eligibility:**
|
|
2061
|
-
* - `DUAL_OFFER_BANNER` (or omitted): homepage + Safari/iPhone
|
|
2058
|
+
* - `DUAL_OFFER_BANNER` (or omitted): homepage + Safari/iPhone
|
|
2062
2059
|
* - `PAYWALL`: Safari/Apple device only (no homepage) — article paywalls
|
|
2063
|
-
* - `REGWALL`: no host-side placement gate (pre-SMA-3301 article behaviour)
|
|
2064
2060
|
*
|
|
2065
2061
|
* @param offer - The offer to display in the Apple Pay flow.
|
|
2066
2062
|
* @param country - The user's country code.
|
|
@@ -2083,28 +2079,33 @@ var ApplePayButton = class _ApplePayButton extends HTMLElement {
|
|
|
2083
2079
|
}
|
|
2084
2080
|
const { isEligible: eligibilityCheck, experimentFlagKey } = config;
|
|
2085
2081
|
const isEligible = eligibilityCheck();
|
|
2086
|
-
if (
|
|
2082
|
+
if (config.enabled === false) {
|
|
2087
2083
|
return null;
|
|
2088
2084
|
}
|
|
2089
|
-
|
|
2090
|
-
experimentFlagKey
|
|
2091
|
-
);
|
|
2092
|
-
const isExperimentVariant = experimentValue === APPLE_PAY_EXPRESS_VARIANTS.CONTROL || experimentValue === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
2093
|
-
if (isExperimentVariant && isEligible && !bypassApplePayChecks() && !hasUrlParamFlag) {
|
|
2094
|
-
void isApplePayAvailable().then((available) => {
|
|
2095
|
-
if (available) {
|
|
2096
|
-
trackApplePayExperimentExposure(
|
|
2097
|
-
experimentValue,
|
|
2098
|
-
getExperimentKeyFromNextData(experimentFlagKey),
|
|
2099
|
-
experimentFlagKey
|
|
2100
|
-
);
|
|
2101
|
-
}
|
|
2102
|
-
});
|
|
2103
|
-
}
|
|
2104
|
-
const isTreatment = experimentValue === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
2105
|
-
if (!isTreatment && !hasUrlParamFlag) {
|
|
2085
|
+
if (!hasUrlParamFlag && !bypassApplePayChecks() && !isEligible) {
|
|
2106
2086
|
return null;
|
|
2107
2087
|
}
|
|
2088
|
+
if (experimentFlagKey) {
|
|
2089
|
+
const experimentValue = window.experimentIntegration?.getVariant?.(
|
|
2090
|
+
experimentFlagKey
|
|
2091
|
+
);
|
|
2092
|
+
const isExperimentVariant = experimentValue === APPLE_PAY_EXPRESS_VARIANTS.CONTROL || experimentValue === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
2093
|
+
if (isExperimentVariant && isEligible && !bypassApplePayChecks() && !hasUrlParamFlag) {
|
|
2094
|
+
void isApplePayAvailable().then((available) => {
|
|
2095
|
+
if (available) {
|
|
2096
|
+
trackApplePayExperimentExposure(
|
|
2097
|
+
experimentValue,
|
|
2098
|
+
getExperimentKeyFromNextData(experimentFlagKey),
|
|
2099
|
+
experimentFlagKey
|
|
2100
|
+
);
|
|
2101
|
+
}
|
|
2102
|
+
});
|
|
2103
|
+
}
|
|
2104
|
+
const isTreatment = experimentValue === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
2105
|
+
if (!isTreatment && !hasUrlParamFlag) {
|
|
2106
|
+
return null;
|
|
2107
|
+
}
|
|
2108
|
+
}
|
|
2108
2109
|
_ApplePayButton.define();
|
|
2109
2110
|
const button = document.createElement(_ApplePayButton.tag);
|
|
2110
2111
|
button.offer = offer;
|
|
@@ -2417,7 +2418,6 @@ function defineApplePayElements() {
|
|
|
2417
2418
|
}
|
|
2418
2419
|
export {
|
|
2419
2420
|
APPLE_PAY_EXCLUDED_VARIANTS,
|
|
2420
|
-
APPLE_PAY_EXPRESS_EXPERIMENT_KEY,
|
|
2421
2421
|
APPLE_PAY_EXPRESS_PAYWALLS_EXPERIMENT_KEY,
|
|
2422
2422
|
APPLE_PAY_EXPRESS_VARIANTS,
|
|
2423
2423
|
ApplePayButton,
|
|
@@ -6,27 +6,24 @@ export declare class ApplePayButton extends HTMLElement {
|
|
|
6
6
|
static readonly tag = "teg-apple-pay-button";
|
|
7
7
|
static define(): void;
|
|
8
8
|
/**
|
|
9
|
-
* Creates and configures an ApplePayButton when the
|
|
9
|
+
* Creates and configures an ApplePayButton when the entry point allows it.
|
|
10
10
|
*
|
|
11
|
-
*
|
|
12
|
-
*
|
|
13
|
-
* - {@link
|
|
11
|
+
* - `DUAL_OFFER_BANNER` (or omitted): always-on after eligibility / exclusions —
|
|
12
|
+
* no banners experiment read and no banners `$exposure`.
|
|
13
|
+
* - `PAYWALL`: experiment-gated via {@link APPLE_PAY_EXPRESS_PAYWALLS_EXPERIMENT_KEY}
|
|
14
|
+
* (`treatment` or QA URL param). The host must set up
|
|
15
|
+
* `window.experimentIntegration` before calling for this entry point.
|
|
16
|
+
* - `REGWALL`: inert — always returns null.
|
|
14
17
|
*
|
|
15
|
-
*
|
|
16
|
-
*
|
|
17
|
-
*
|
|
18
|
-
*
|
|
19
|
-
*
|
|
20
|
-
*
|
|
21
|
-
* **Transition period:** the legacy `FEATURE_APPLE_PAY_EXPRESS_CHECKOUT` URL param
|
|
22
|
-
* gate is also evaluated as a fallback until all host apps have integrated
|
|
23
|
-
* `window.experimentIntegration`. Once all consumers are migrated, the URL param
|
|
24
|
-
* fallback will be removed.
|
|
18
|
+
* **PAYWALL only — transition period:** the legacy
|
|
19
|
+
* `FEATURE_APPLE_PAY_EXPRESS_CHECKOUT` URL param can show the button without
|
|
20
|
+
* treatment (and without inflating `$exposure`). For banners, the same URL
|
|
21
|
+
* param / `BYPASS_APPLE_PAY_CHECKS` only bypass **eligibility**, not an
|
|
22
|
+
* experiment gate.
|
|
25
23
|
*
|
|
26
24
|
* **Eligibility:**
|
|
27
|
-
* - `DUAL_OFFER_BANNER` (or omitted): homepage + Safari/iPhone
|
|
25
|
+
* - `DUAL_OFFER_BANNER` (or omitted): homepage + Safari/iPhone
|
|
28
26
|
* - `PAYWALL`: Safari/Apple device only (no homepage) — article paywalls
|
|
29
|
-
* - `REGWALL`: no host-side placement gate (pre-SMA-3301 article behaviour)
|
|
30
27
|
*
|
|
31
28
|
* @param offer - The offer to display in the Apple Pay flow.
|
|
32
29
|
* @param country - The user's country code.
|
|
@@ -1299,7 +1299,6 @@ var redirectToCheckoutFallback = (params) => {
|
|
|
1299
1299
|
};
|
|
1300
1300
|
|
|
1301
1301
|
// src/constants.ts
|
|
1302
|
-
var APPLE_PAY_EXPRESS_EXPERIMENT_KEY = "apple-pay-express-checkout-on-banners";
|
|
1303
1302
|
var APPLE_PAY_EXPRESS_PAYWALLS_EXPERIMENT_KEY = "apple-pay-express-checkout-on-paywalls";
|
|
1304
1303
|
var APPLE_PAY_EXPRESS_VARIANTS = {
|
|
1305
1304
|
CONTROL: "control",
|
|
@@ -1343,7 +1342,7 @@ var track = (action, extra) => {
|
|
|
1343
1342
|
...extra
|
|
1344
1343
|
});
|
|
1345
1344
|
};
|
|
1346
|
-
var trackApplePayExperimentExposure = (variant, experimentKey, flagKey
|
|
1345
|
+
var trackApplePayExperimentExposure = (variant, experimentKey, flagKey) => {
|
|
1347
1346
|
const isActiveVariant = variant === APPLE_PAY_EXPRESS_VARIANTS.CONTROL || variant === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
1348
1347
|
if (!isActiveVariant) {
|
|
1349
1348
|
return;
|
|
@@ -1995,14 +1994,14 @@ var getExperimentKeyFromNextData = (flagKey) => {
|
|
|
1995
1994
|
|
|
1996
1995
|
// src/utils/applePayExpressEligibility.ts
|
|
1997
1996
|
var isApplePayExpressHomepage = (pathname = window.location.pathname) => pathname === "/";
|
|
1998
|
-
var
|
|
1997
|
+
var isEligibleForApplePayExpressBanner = () => isApplePayExpressHomepage() && isAppleDeviceOrSafari();
|
|
1999
1998
|
var isEligibleForApplePayExpressPaywallExperiment = () => isAppleDeviceOrSafari();
|
|
2000
1999
|
|
|
2001
2000
|
// src/apple-pay-button.ts
|
|
2002
2001
|
var ENTRY_POINT_CONFIG = {
|
|
2003
2002
|
["dual_offer_banner" /* DUAL_OFFER_BANNER */]: {
|
|
2004
|
-
isEligible:
|
|
2005
|
-
experimentFlagKey
|
|
2003
|
+
isEligible: isEligibleForApplePayExpressBanner
|
|
2004
|
+
// no experimentFlagKey → always-on after eligibility / exclusions
|
|
2006
2005
|
},
|
|
2007
2006
|
["article_paywall" /* PAYWALL */]: {
|
|
2008
2007
|
isEligible: isEligibleForApplePayExpressPaywallExperiment,
|
|
@@ -2010,7 +2009,7 @@ var ENTRY_POINT_CONFIG = {
|
|
|
2010
2009
|
},
|
|
2011
2010
|
["article_regwall" /* REGWALL */]: {
|
|
2012
2011
|
isEligible: () => true,
|
|
2013
|
-
|
|
2012
|
+
enabled: false
|
|
2014
2013
|
}
|
|
2015
2014
|
};
|
|
2016
2015
|
var FEATURE_APPLE_PAY_EXPRESS_CHECKOUT = "FEATURE_APPLE_PAY_EXPRESS_CHECKOUT";
|
|
@@ -2029,27 +2028,24 @@ var ApplePayButton = class _ApplePayButton extends HTMLElement {
|
|
|
2029
2028
|
define(_ApplePayButton.tag, _ApplePayButton);
|
|
2030
2029
|
}
|
|
2031
2030
|
/**
|
|
2032
|
-
* Creates and configures an ApplePayButton when the
|
|
2031
|
+
* Creates and configures an ApplePayButton when the entry point allows it.
|
|
2033
2032
|
*
|
|
2034
|
-
*
|
|
2035
|
-
*
|
|
2036
|
-
* - {@link
|
|
2033
|
+
* - `DUAL_OFFER_BANNER` (or omitted): always-on after eligibility / exclusions —
|
|
2034
|
+
* no banners experiment read and no banners `$exposure`.
|
|
2035
|
+
* - `PAYWALL`: experiment-gated via {@link APPLE_PAY_EXPRESS_PAYWALLS_EXPERIMENT_KEY}
|
|
2036
|
+
* (`treatment` or QA URL param). The host must set up
|
|
2037
|
+
* `window.experimentIntegration` before calling for this entry point.
|
|
2038
|
+
* - `REGWALL`: inert — always returns null.
|
|
2037
2039
|
*
|
|
2038
|
-
*
|
|
2039
|
-
*
|
|
2040
|
-
*
|
|
2041
|
-
*
|
|
2042
|
-
*
|
|
2043
|
-
*
|
|
2044
|
-
* **Transition period:** the legacy `FEATURE_APPLE_PAY_EXPRESS_CHECKOUT` URL param
|
|
2045
|
-
* gate is also evaluated as a fallback until all host apps have integrated
|
|
2046
|
-
* `window.experimentIntegration`. Once all consumers are migrated, the URL param
|
|
2047
|
-
* fallback will be removed.
|
|
2040
|
+
* **PAYWALL only — transition period:** the legacy
|
|
2041
|
+
* `FEATURE_APPLE_PAY_EXPRESS_CHECKOUT` URL param can show the button without
|
|
2042
|
+
* treatment (and without inflating `$exposure`). For banners, the same URL
|
|
2043
|
+
* param / `BYPASS_APPLE_PAY_CHECKS` only bypass **eligibility**, not an
|
|
2044
|
+
* experiment gate.
|
|
2048
2045
|
*
|
|
2049
2046
|
* **Eligibility:**
|
|
2050
|
-
* - `DUAL_OFFER_BANNER` (or omitted): homepage + Safari/iPhone
|
|
2047
|
+
* - `DUAL_OFFER_BANNER` (or omitted): homepage + Safari/iPhone
|
|
2051
2048
|
* - `PAYWALL`: Safari/Apple device only (no homepage) — article paywalls
|
|
2052
|
-
* - `REGWALL`: no host-side placement gate (pre-SMA-3301 article behaviour)
|
|
2053
2049
|
*
|
|
2054
2050
|
* @param offer - The offer to display in the Apple Pay flow.
|
|
2055
2051
|
* @param country - The user's country code.
|
|
@@ -2072,28 +2068,33 @@ var ApplePayButton = class _ApplePayButton extends HTMLElement {
|
|
|
2072
2068
|
}
|
|
2073
2069
|
const { isEligible: eligibilityCheck, experimentFlagKey } = config;
|
|
2074
2070
|
const isEligible = eligibilityCheck();
|
|
2075
|
-
if (
|
|
2071
|
+
if (config.enabled === false) {
|
|
2076
2072
|
return null;
|
|
2077
2073
|
}
|
|
2078
|
-
|
|
2079
|
-
experimentFlagKey
|
|
2080
|
-
);
|
|
2081
|
-
const isExperimentVariant = experimentValue === APPLE_PAY_EXPRESS_VARIANTS.CONTROL || experimentValue === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
2082
|
-
if (isExperimentVariant && isEligible && !bypassApplePayChecks() && !hasUrlParamFlag) {
|
|
2083
|
-
void isApplePayAvailable().then((available) => {
|
|
2084
|
-
if (available) {
|
|
2085
|
-
trackApplePayExperimentExposure(
|
|
2086
|
-
experimentValue,
|
|
2087
|
-
getExperimentKeyFromNextData(experimentFlagKey),
|
|
2088
|
-
experimentFlagKey
|
|
2089
|
-
);
|
|
2090
|
-
}
|
|
2091
|
-
});
|
|
2092
|
-
}
|
|
2093
|
-
const isTreatment = experimentValue === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
2094
|
-
if (!isTreatment && !hasUrlParamFlag) {
|
|
2074
|
+
if (!hasUrlParamFlag && !bypassApplePayChecks() && !isEligible) {
|
|
2095
2075
|
return null;
|
|
2096
2076
|
}
|
|
2077
|
+
if (experimentFlagKey) {
|
|
2078
|
+
const experimentValue = window.experimentIntegration?.getVariant?.(
|
|
2079
|
+
experimentFlagKey
|
|
2080
|
+
);
|
|
2081
|
+
const isExperimentVariant = experimentValue === APPLE_PAY_EXPRESS_VARIANTS.CONTROL || experimentValue === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
2082
|
+
if (isExperimentVariant && isEligible && !bypassApplePayChecks() && !hasUrlParamFlag) {
|
|
2083
|
+
void isApplePayAvailable().then((available) => {
|
|
2084
|
+
if (available) {
|
|
2085
|
+
trackApplePayExperimentExposure(
|
|
2086
|
+
experimentValue,
|
|
2087
|
+
getExperimentKeyFromNextData(experimentFlagKey),
|
|
2088
|
+
experimentFlagKey
|
|
2089
|
+
);
|
|
2090
|
+
}
|
|
2091
|
+
});
|
|
2092
|
+
}
|
|
2093
|
+
const isTreatment = experimentValue === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
2094
|
+
if (!isTreatment && !hasUrlParamFlag) {
|
|
2095
|
+
return null;
|
|
2096
|
+
}
|
|
2097
|
+
}
|
|
2097
2098
|
_ApplePayButton.define();
|
|
2098
2099
|
const button = document.createElement(_ApplePayButton.tag);
|
|
2099
2100
|
button.offer = offer;
|
|
@@ -1307,7 +1307,6 @@ var redirectToCheckoutFallback = (params) => {
|
|
|
1307
1307
|
};
|
|
1308
1308
|
|
|
1309
1309
|
// src/constants.ts
|
|
1310
|
-
var APPLE_PAY_EXPRESS_EXPERIMENT_KEY = "apple-pay-express-checkout-on-banners";
|
|
1311
1310
|
var APPLE_PAY_EXPRESS_PAYWALLS_EXPERIMENT_KEY = "apple-pay-express-checkout-on-paywalls";
|
|
1312
1311
|
var APPLE_PAY_EXPRESS_VARIANTS = {
|
|
1313
1312
|
CONTROL: "control",
|
|
@@ -1351,7 +1350,7 @@ var track = (action, extra) => {
|
|
|
1351
1350
|
...extra
|
|
1352
1351
|
});
|
|
1353
1352
|
};
|
|
1354
|
-
var trackApplePayExperimentExposure = (variant, experimentKey, flagKey
|
|
1353
|
+
var trackApplePayExperimentExposure = (variant, experimentKey, flagKey) => {
|
|
1355
1354
|
const isActiveVariant = variant === APPLE_PAY_EXPRESS_VARIANTS.CONTROL || variant === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
1356
1355
|
if (!isActiveVariant) {
|
|
1357
1356
|
return;
|
|
@@ -2003,14 +2002,14 @@ var getExperimentKeyFromNextData = (flagKey) => {
|
|
|
2003
2002
|
|
|
2004
2003
|
// src/utils/applePayExpressEligibility.ts
|
|
2005
2004
|
var isApplePayExpressHomepage = (pathname = window.location.pathname) => pathname === "/";
|
|
2006
|
-
var
|
|
2005
|
+
var isEligibleForApplePayExpressBanner = () => isApplePayExpressHomepage() && isAppleDeviceOrSafari();
|
|
2007
2006
|
var isEligibleForApplePayExpressPaywallExperiment = () => isAppleDeviceOrSafari();
|
|
2008
2007
|
|
|
2009
2008
|
// src/apple-pay-button.ts
|
|
2010
2009
|
var ENTRY_POINT_CONFIG = {
|
|
2011
2010
|
["dual_offer_banner" /* DUAL_OFFER_BANNER */]: {
|
|
2012
|
-
isEligible:
|
|
2013
|
-
experimentFlagKey
|
|
2011
|
+
isEligible: isEligibleForApplePayExpressBanner
|
|
2012
|
+
// no experimentFlagKey → always-on after eligibility / exclusions
|
|
2014
2013
|
},
|
|
2015
2014
|
["article_paywall" /* PAYWALL */]: {
|
|
2016
2015
|
isEligible: isEligibleForApplePayExpressPaywallExperiment,
|
|
@@ -2018,7 +2017,7 @@ var ENTRY_POINT_CONFIG = {
|
|
|
2018
2017
|
},
|
|
2019
2018
|
["article_regwall" /* REGWALL */]: {
|
|
2020
2019
|
isEligible: () => true,
|
|
2021
|
-
|
|
2020
|
+
enabled: false
|
|
2022
2021
|
}
|
|
2023
2022
|
};
|
|
2024
2023
|
var FEATURE_APPLE_PAY_EXPRESS_CHECKOUT = "FEATURE_APPLE_PAY_EXPRESS_CHECKOUT";
|
|
@@ -2037,27 +2036,24 @@ var ApplePayButton = class _ApplePayButton extends HTMLElement {
|
|
|
2037
2036
|
define(_ApplePayButton.tag, _ApplePayButton);
|
|
2038
2037
|
}
|
|
2039
2038
|
/**
|
|
2040
|
-
* Creates and configures an ApplePayButton when the
|
|
2039
|
+
* Creates and configures an ApplePayButton when the entry point allows it.
|
|
2041
2040
|
*
|
|
2042
|
-
*
|
|
2043
|
-
*
|
|
2044
|
-
* - {@link
|
|
2041
|
+
* - `DUAL_OFFER_BANNER` (or omitted): always-on after eligibility / exclusions —
|
|
2042
|
+
* no banners experiment read and no banners `$exposure`.
|
|
2043
|
+
* - `PAYWALL`: experiment-gated via {@link APPLE_PAY_EXPRESS_PAYWALLS_EXPERIMENT_KEY}
|
|
2044
|
+
* (`treatment` or QA URL param). The host must set up
|
|
2045
|
+
* `window.experimentIntegration` before calling for this entry point.
|
|
2046
|
+
* - `REGWALL`: inert — always returns null.
|
|
2045
2047
|
*
|
|
2046
|
-
*
|
|
2047
|
-
*
|
|
2048
|
-
*
|
|
2049
|
-
*
|
|
2050
|
-
*
|
|
2051
|
-
*
|
|
2052
|
-
* **Transition period:** the legacy `FEATURE_APPLE_PAY_EXPRESS_CHECKOUT` URL param
|
|
2053
|
-
* gate is also evaluated as a fallback until all host apps have integrated
|
|
2054
|
-
* `window.experimentIntegration`. Once all consumers are migrated, the URL param
|
|
2055
|
-
* fallback will be removed.
|
|
2048
|
+
* **PAYWALL only — transition period:** the legacy
|
|
2049
|
+
* `FEATURE_APPLE_PAY_EXPRESS_CHECKOUT` URL param can show the button without
|
|
2050
|
+
* treatment (and without inflating `$exposure`). For banners, the same URL
|
|
2051
|
+
* param / `BYPASS_APPLE_PAY_CHECKS` only bypass **eligibility**, not an
|
|
2052
|
+
* experiment gate.
|
|
2056
2053
|
*
|
|
2057
2054
|
* **Eligibility:**
|
|
2058
|
-
* - `DUAL_OFFER_BANNER` (or omitted): homepage + Safari/iPhone
|
|
2055
|
+
* - `DUAL_OFFER_BANNER` (or omitted): homepage + Safari/iPhone
|
|
2059
2056
|
* - `PAYWALL`: Safari/Apple device only (no homepage) — article paywalls
|
|
2060
|
-
* - `REGWALL`: no host-side placement gate (pre-SMA-3301 article behaviour)
|
|
2061
2057
|
*
|
|
2062
2058
|
* @param offer - The offer to display in the Apple Pay flow.
|
|
2063
2059
|
* @param country - The user's country code.
|
|
@@ -2080,28 +2076,33 @@ var ApplePayButton = class _ApplePayButton extends HTMLElement {
|
|
|
2080
2076
|
}
|
|
2081
2077
|
const { isEligible: eligibilityCheck, experimentFlagKey } = config;
|
|
2082
2078
|
const isEligible = eligibilityCheck();
|
|
2083
|
-
if (
|
|
2079
|
+
if (config.enabled === false) {
|
|
2084
2080
|
return null;
|
|
2085
2081
|
}
|
|
2086
|
-
|
|
2087
|
-
experimentFlagKey
|
|
2088
|
-
);
|
|
2089
|
-
const isExperimentVariant = experimentValue === APPLE_PAY_EXPRESS_VARIANTS.CONTROL || experimentValue === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
2090
|
-
if (isExperimentVariant && isEligible && !bypassApplePayChecks() && !hasUrlParamFlag) {
|
|
2091
|
-
void isApplePayAvailable().then((available) => {
|
|
2092
|
-
if (available) {
|
|
2093
|
-
trackApplePayExperimentExposure(
|
|
2094
|
-
experimentValue,
|
|
2095
|
-
getExperimentKeyFromNextData(experimentFlagKey),
|
|
2096
|
-
experimentFlagKey
|
|
2097
|
-
);
|
|
2098
|
-
}
|
|
2099
|
-
});
|
|
2100
|
-
}
|
|
2101
|
-
const isTreatment = experimentValue === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
2102
|
-
if (!isTreatment && !hasUrlParamFlag) {
|
|
2082
|
+
if (!hasUrlParamFlag && !bypassApplePayChecks() && !isEligible) {
|
|
2103
2083
|
return null;
|
|
2104
2084
|
}
|
|
2085
|
+
if (experimentFlagKey) {
|
|
2086
|
+
const experimentValue = window.experimentIntegration?.getVariant?.(
|
|
2087
|
+
experimentFlagKey
|
|
2088
|
+
);
|
|
2089
|
+
const isExperimentVariant = experimentValue === APPLE_PAY_EXPRESS_VARIANTS.CONTROL || experimentValue === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
2090
|
+
if (isExperimentVariant && isEligible && !bypassApplePayChecks() && !hasUrlParamFlag) {
|
|
2091
|
+
void isApplePayAvailable().then((available) => {
|
|
2092
|
+
if (available) {
|
|
2093
|
+
trackApplePayExperimentExposure(
|
|
2094
|
+
experimentValue,
|
|
2095
|
+
getExperimentKeyFromNextData(experimentFlagKey),
|
|
2096
|
+
experimentFlagKey
|
|
2097
|
+
);
|
|
2098
|
+
}
|
|
2099
|
+
});
|
|
2100
|
+
}
|
|
2101
|
+
const isTreatment = experimentValue === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
2102
|
+
if (!isTreatment && !hasUrlParamFlag) {
|
|
2103
|
+
return null;
|
|
2104
|
+
}
|
|
2105
|
+
}
|
|
2105
2106
|
_ApplePayButton.define();
|
|
2106
2107
|
const button = document.createElement(_ApplePayButton.tag);
|
|
2107
2108
|
button.offer = offer;
|
|
@@ -1299,7 +1299,6 @@ var redirectToCheckoutFallback = (params) => {
|
|
|
1299
1299
|
};
|
|
1300
1300
|
|
|
1301
1301
|
// src/constants.ts
|
|
1302
|
-
var APPLE_PAY_EXPRESS_EXPERIMENT_KEY = "apple-pay-express-checkout-on-banners";
|
|
1303
1302
|
var APPLE_PAY_EXPRESS_PAYWALLS_EXPERIMENT_KEY = "apple-pay-express-checkout-on-paywalls";
|
|
1304
1303
|
var APPLE_PAY_EXPRESS_VARIANTS = {
|
|
1305
1304
|
CONTROL: "control",
|
|
@@ -1343,7 +1342,7 @@ var track = (action, extra) => {
|
|
|
1343
1342
|
...extra
|
|
1344
1343
|
});
|
|
1345
1344
|
};
|
|
1346
|
-
var trackApplePayExperimentExposure = (variant, experimentKey, flagKey
|
|
1345
|
+
var trackApplePayExperimentExposure = (variant, experimentKey, flagKey) => {
|
|
1347
1346
|
const isActiveVariant = variant === APPLE_PAY_EXPRESS_VARIANTS.CONTROL || variant === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
1348
1347
|
if (!isActiveVariant) {
|
|
1349
1348
|
return;
|
|
@@ -1995,14 +1994,14 @@ var getExperimentKeyFromNextData = (flagKey) => {
|
|
|
1995
1994
|
|
|
1996
1995
|
// src/utils/applePayExpressEligibility.ts
|
|
1997
1996
|
var isApplePayExpressHomepage = (pathname = window.location.pathname) => pathname === "/";
|
|
1998
|
-
var
|
|
1997
|
+
var isEligibleForApplePayExpressBanner = () => isApplePayExpressHomepage() && isAppleDeviceOrSafari();
|
|
1999
1998
|
var isEligibleForApplePayExpressPaywallExperiment = () => isAppleDeviceOrSafari();
|
|
2000
1999
|
|
|
2001
2000
|
// src/apple-pay-button.ts
|
|
2002
2001
|
var ENTRY_POINT_CONFIG = {
|
|
2003
2002
|
["dual_offer_banner" /* DUAL_OFFER_BANNER */]: {
|
|
2004
|
-
isEligible:
|
|
2005
|
-
experimentFlagKey
|
|
2003
|
+
isEligible: isEligibleForApplePayExpressBanner
|
|
2004
|
+
// no experimentFlagKey → always-on after eligibility / exclusions
|
|
2006
2005
|
},
|
|
2007
2006
|
["article_paywall" /* PAYWALL */]: {
|
|
2008
2007
|
isEligible: isEligibleForApplePayExpressPaywallExperiment,
|
|
@@ -2010,7 +2009,7 @@ var ENTRY_POINT_CONFIG = {
|
|
|
2010
2009
|
},
|
|
2011
2010
|
["article_regwall" /* REGWALL */]: {
|
|
2012
2011
|
isEligible: () => true,
|
|
2013
|
-
|
|
2012
|
+
enabled: false
|
|
2014
2013
|
}
|
|
2015
2014
|
};
|
|
2016
2015
|
var FEATURE_APPLE_PAY_EXPRESS_CHECKOUT = "FEATURE_APPLE_PAY_EXPRESS_CHECKOUT";
|
|
@@ -2029,27 +2028,24 @@ var ApplePayButton = class _ApplePayButton extends HTMLElement {
|
|
|
2029
2028
|
define(_ApplePayButton.tag, _ApplePayButton);
|
|
2030
2029
|
}
|
|
2031
2030
|
/**
|
|
2032
|
-
* Creates and configures an ApplePayButton when the
|
|
2031
|
+
* Creates and configures an ApplePayButton when the entry point allows it.
|
|
2033
2032
|
*
|
|
2034
|
-
*
|
|
2035
|
-
*
|
|
2036
|
-
* - {@link
|
|
2033
|
+
* - `DUAL_OFFER_BANNER` (or omitted): always-on after eligibility / exclusions —
|
|
2034
|
+
* no banners experiment read and no banners `$exposure`.
|
|
2035
|
+
* - `PAYWALL`: experiment-gated via {@link APPLE_PAY_EXPRESS_PAYWALLS_EXPERIMENT_KEY}
|
|
2036
|
+
* (`treatment` or QA URL param). The host must set up
|
|
2037
|
+
* `window.experimentIntegration` before calling for this entry point.
|
|
2038
|
+
* - `REGWALL`: inert — always returns null.
|
|
2037
2039
|
*
|
|
2038
|
-
*
|
|
2039
|
-
*
|
|
2040
|
-
*
|
|
2041
|
-
*
|
|
2042
|
-
*
|
|
2043
|
-
*
|
|
2044
|
-
* **Transition period:** the legacy `FEATURE_APPLE_PAY_EXPRESS_CHECKOUT` URL param
|
|
2045
|
-
* gate is also evaluated as a fallback until all host apps have integrated
|
|
2046
|
-
* `window.experimentIntegration`. Once all consumers are migrated, the URL param
|
|
2047
|
-
* fallback will be removed.
|
|
2040
|
+
* **PAYWALL only — transition period:** the legacy
|
|
2041
|
+
* `FEATURE_APPLE_PAY_EXPRESS_CHECKOUT` URL param can show the button without
|
|
2042
|
+
* treatment (and without inflating `$exposure`). For banners, the same URL
|
|
2043
|
+
* param / `BYPASS_APPLE_PAY_CHECKS` only bypass **eligibility**, not an
|
|
2044
|
+
* experiment gate.
|
|
2048
2045
|
*
|
|
2049
2046
|
* **Eligibility:**
|
|
2050
|
-
* - `DUAL_OFFER_BANNER` (or omitted): homepage + Safari/iPhone
|
|
2047
|
+
* - `DUAL_OFFER_BANNER` (or omitted): homepage + Safari/iPhone
|
|
2051
2048
|
* - `PAYWALL`: Safari/Apple device only (no homepage) — article paywalls
|
|
2052
|
-
* - `REGWALL`: no host-side placement gate (pre-SMA-3301 article behaviour)
|
|
2053
2049
|
*
|
|
2054
2050
|
* @param offer - The offer to display in the Apple Pay flow.
|
|
2055
2051
|
* @param country - The user's country code.
|
|
@@ -2072,28 +2068,33 @@ var ApplePayButton = class _ApplePayButton extends HTMLElement {
|
|
|
2072
2068
|
}
|
|
2073
2069
|
const { isEligible: eligibilityCheck, experimentFlagKey } = config;
|
|
2074
2070
|
const isEligible = eligibilityCheck();
|
|
2075
|
-
if (
|
|
2071
|
+
if (config.enabled === false) {
|
|
2076
2072
|
return null;
|
|
2077
2073
|
}
|
|
2078
|
-
|
|
2079
|
-
experimentFlagKey
|
|
2080
|
-
);
|
|
2081
|
-
const isExperimentVariant = experimentValue === APPLE_PAY_EXPRESS_VARIANTS.CONTROL || experimentValue === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
2082
|
-
if (isExperimentVariant && isEligible && !bypassApplePayChecks() && !hasUrlParamFlag) {
|
|
2083
|
-
void isApplePayAvailable().then((available) => {
|
|
2084
|
-
if (available) {
|
|
2085
|
-
trackApplePayExperimentExposure(
|
|
2086
|
-
experimentValue,
|
|
2087
|
-
getExperimentKeyFromNextData(experimentFlagKey),
|
|
2088
|
-
experimentFlagKey
|
|
2089
|
-
);
|
|
2090
|
-
}
|
|
2091
|
-
});
|
|
2092
|
-
}
|
|
2093
|
-
const isTreatment = experimentValue === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
2094
|
-
if (!isTreatment && !hasUrlParamFlag) {
|
|
2074
|
+
if (!hasUrlParamFlag && !bypassApplePayChecks() && !isEligible) {
|
|
2095
2075
|
return null;
|
|
2096
2076
|
}
|
|
2077
|
+
if (experimentFlagKey) {
|
|
2078
|
+
const experimentValue = window.experimentIntegration?.getVariant?.(
|
|
2079
|
+
experimentFlagKey
|
|
2080
|
+
);
|
|
2081
|
+
const isExperimentVariant = experimentValue === APPLE_PAY_EXPRESS_VARIANTS.CONTROL || experimentValue === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
2082
|
+
if (isExperimentVariant && isEligible && !bypassApplePayChecks() && !hasUrlParamFlag) {
|
|
2083
|
+
void isApplePayAvailable().then((available) => {
|
|
2084
|
+
if (available) {
|
|
2085
|
+
trackApplePayExperimentExposure(
|
|
2086
|
+
experimentValue,
|
|
2087
|
+
getExperimentKeyFromNextData(experimentFlagKey),
|
|
2088
|
+
experimentFlagKey
|
|
2089
|
+
);
|
|
2090
|
+
}
|
|
2091
|
+
});
|
|
2092
|
+
}
|
|
2093
|
+
const isTreatment = experimentValue === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
2094
|
+
if (!isTreatment && !hasUrlParamFlag) {
|
|
2095
|
+
return null;
|
|
2096
|
+
}
|
|
2097
|
+
}
|
|
2097
2098
|
_ApplePayButton.define();
|
|
2098
2099
|
const button = document.createElement(_ApplePayButton.tag);
|
|
2099
2100
|
button.offer = offer;
|
package/dist/src/constants.d.ts
CHANGED
|
@@ -3,35 +3,24 @@ export declare enum ApplePayEntryPoint {
|
|
|
3
3
|
REGWALL = "article_regwall",
|
|
4
4
|
DUAL_OFFER_BANNER = "dual_offer_banner"
|
|
5
5
|
}
|
|
6
|
-
/**
|
|
7
|
-
* Amplitude experiment key for Apple Pay Express Checkout on homepage banners
|
|
8
|
-
* (dual-offer banner) and article banner regwalls.
|
|
9
|
-
*
|
|
10
|
-
* This package reads the variant for this key internally via
|
|
11
|
-
* `window.experimentIntegration.getVariant()` — set up by the host page
|
|
12
|
-
* before `createIfEnabled` is called.
|
|
13
|
-
*
|
|
14
|
-
* Fail-closed: missing integration, missing key, `control`, or Amplitude fetch
|
|
15
|
-
* failure on the host → button is hidden (unless QA URL param is present).
|
|
16
|
-
*
|
|
17
|
-
* Must match the Feature experiment key in Amplitude and host app constants
|
|
18
|
-
* (Engagement / Insider / Podcasts).
|
|
19
|
-
*/
|
|
20
|
-
export declare const APPLE_PAY_EXPRESS_EXPERIMENT_KEY = "apple-pay-express-checkout-on-banners";
|
|
21
6
|
/**
|
|
22
7
|
* Amplitude experiment key for Apple Pay Express Checkout on article paywalls
|
|
23
8
|
* (`ApplePayEntryPoint.PAYWALL`, e.g. single-offer-paywall / multi-offer paywall).
|
|
24
9
|
*
|
|
25
|
-
*
|
|
10
|
+
* Fail-closed when the variant is missing or not `treatment`; the QA URL param
|
|
11
|
+
* `FEATURE_APPLE_PAY_EXPRESS_CHECKOUT` can show the button without treatment.
|
|
26
12
|
* Eligibility for this flag ignores homepage and requires Safari/Apple device
|
|
27
13
|
* (plus `isApplePayAvailable` before `$exposure`).
|
|
14
|
+
*
|
|
15
|
+
* Must match the Feature experiment key in Amplitude and host app constants
|
|
16
|
+
* (Engagement / Insider / Podcasts) while those still bridge the experiment.
|
|
28
17
|
*/
|
|
29
18
|
export declare const APPLE_PAY_EXPRESS_PAYWALLS_EXPERIMENT_KEY = "apple-pay-express-checkout-on-paywalls";
|
|
30
19
|
/**
|
|
31
20
|
* Known Amplitude experiment flag keys for Apple Pay Express Checkout.
|
|
32
21
|
* Narrowed so callers cannot pass an arbitrary typo'd string.
|
|
33
22
|
*/
|
|
34
|
-
export type ApplePayExperimentFlagKey = typeof
|
|
23
|
+
export type ApplePayExperimentFlagKey = typeof APPLE_PAY_EXPRESS_PAYWALLS_EXPERIMENT_KEY;
|
|
35
24
|
/**
|
|
36
25
|
* Amplitude variant values for the Apple Pay Express Checkout experiment.
|
|
37
26
|
* CONTROL → button hidden (baseline)
|
package/dist/src/constants.js
CHANGED
|
@@ -5,14 +5,12 @@ var ApplePayEntryPoint = /* @__PURE__ */ ((ApplePayEntryPoint2) => {
|
|
|
5
5
|
ApplePayEntryPoint2["DUAL_OFFER_BANNER"] = "dual_offer_banner";
|
|
6
6
|
return ApplePayEntryPoint2;
|
|
7
7
|
})(ApplePayEntryPoint || {});
|
|
8
|
-
var APPLE_PAY_EXPRESS_EXPERIMENT_KEY = "apple-pay-express-checkout-on-banners";
|
|
9
8
|
var APPLE_PAY_EXPRESS_PAYWALLS_EXPERIMENT_KEY = "apple-pay-express-checkout-on-paywalls";
|
|
10
9
|
var APPLE_PAY_EXPRESS_VARIANTS = {
|
|
11
10
|
CONTROL: "control",
|
|
12
11
|
TREATMENT: "treatment"
|
|
13
12
|
};
|
|
14
13
|
export {
|
|
15
|
-
APPLE_PAY_EXPRESS_EXPERIMENT_KEY,
|
|
16
14
|
APPLE_PAY_EXPRESS_PAYWALLS_EXPERIMENT_KEY,
|
|
17
15
|
APPLE_PAY_EXPRESS_VARIANTS,
|
|
18
16
|
ApplePayEntryPoint
|
package/dist/src/index.d.ts
CHANGED
|
@@ -2,7 +2,7 @@ export { ApplePayButton, APPLE_PAY_EXCLUDED_VARIANTS, } from './apple-pay-button
|
|
|
2
2
|
export { ApplePayModal } from './apple-pay-modal';
|
|
3
3
|
export { ensureApplePayLogoSymbol } from './apple-pay-logo';
|
|
4
4
|
export { configureApplePay } from './clients/payment-checkout/config';
|
|
5
|
-
export { ApplePayEntryPoint,
|
|
5
|
+
export { ApplePayEntryPoint, APPLE_PAY_EXPRESS_PAYWALLS_EXPERIMENT_KEY, APPLE_PAY_EXPRESS_VARIANTS, } from './constants';
|
|
6
6
|
export type { ApplePayExperimentFlagKey } from './constants';
|
|
7
7
|
export type { ApplePayRuntimeConfig } from './clients/payment-checkout/config';
|
|
8
8
|
export type { Offer } from './types/offer.types';
|
package/dist/src/index.js
CHANGED
|
@@ -1310,7 +1310,6 @@ var ApplePayEntryPoint = /* @__PURE__ */ ((ApplePayEntryPoint2) => {
|
|
|
1310
1310
|
ApplePayEntryPoint2["DUAL_OFFER_BANNER"] = "dual_offer_banner";
|
|
1311
1311
|
return ApplePayEntryPoint2;
|
|
1312
1312
|
})(ApplePayEntryPoint || {});
|
|
1313
|
-
var APPLE_PAY_EXPRESS_EXPERIMENT_KEY = "apple-pay-express-checkout-on-banners";
|
|
1314
1313
|
var APPLE_PAY_EXPRESS_PAYWALLS_EXPERIMENT_KEY = "apple-pay-express-checkout-on-paywalls";
|
|
1315
1314
|
var APPLE_PAY_EXPRESS_VARIANTS = {
|
|
1316
1315
|
CONTROL: "control",
|
|
@@ -1354,7 +1353,7 @@ var track = (action, extra) => {
|
|
|
1354
1353
|
...extra
|
|
1355
1354
|
});
|
|
1356
1355
|
};
|
|
1357
|
-
var trackApplePayExperimentExposure = (variant, experimentKey, flagKey
|
|
1356
|
+
var trackApplePayExperimentExposure = (variant, experimentKey, flagKey) => {
|
|
1358
1357
|
const isActiveVariant = variant === APPLE_PAY_EXPRESS_VARIANTS.CONTROL || variant === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
1359
1358
|
if (!isActiveVariant) {
|
|
1360
1359
|
return;
|
|
@@ -2006,14 +2005,14 @@ var getExperimentKeyFromNextData = (flagKey) => {
|
|
|
2006
2005
|
|
|
2007
2006
|
// src/utils/applePayExpressEligibility.ts
|
|
2008
2007
|
var isApplePayExpressHomepage = (pathname = window.location.pathname) => pathname === "/";
|
|
2009
|
-
var
|
|
2008
|
+
var isEligibleForApplePayExpressBanner = () => isApplePayExpressHomepage() && isAppleDeviceOrSafari();
|
|
2010
2009
|
var isEligibleForApplePayExpressPaywallExperiment = () => isAppleDeviceOrSafari();
|
|
2011
2010
|
|
|
2012
2011
|
// src/apple-pay-button.ts
|
|
2013
2012
|
var ENTRY_POINT_CONFIG = {
|
|
2014
2013
|
["dual_offer_banner" /* DUAL_OFFER_BANNER */]: {
|
|
2015
|
-
isEligible:
|
|
2016
|
-
experimentFlagKey
|
|
2014
|
+
isEligible: isEligibleForApplePayExpressBanner
|
|
2015
|
+
// no experimentFlagKey → always-on after eligibility / exclusions
|
|
2017
2016
|
},
|
|
2018
2017
|
["article_paywall" /* PAYWALL */]: {
|
|
2019
2018
|
isEligible: isEligibleForApplePayExpressPaywallExperiment,
|
|
@@ -2021,7 +2020,7 @@ var ENTRY_POINT_CONFIG = {
|
|
|
2021
2020
|
},
|
|
2022
2021
|
["article_regwall" /* REGWALL */]: {
|
|
2023
2022
|
isEligible: () => true,
|
|
2024
|
-
|
|
2023
|
+
enabled: false
|
|
2025
2024
|
}
|
|
2026
2025
|
};
|
|
2027
2026
|
var FEATURE_APPLE_PAY_EXPRESS_CHECKOUT = "FEATURE_APPLE_PAY_EXPRESS_CHECKOUT";
|
|
@@ -2040,27 +2039,24 @@ var ApplePayButton = class _ApplePayButton extends HTMLElement {
|
|
|
2040
2039
|
define(_ApplePayButton.tag, _ApplePayButton);
|
|
2041
2040
|
}
|
|
2042
2041
|
/**
|
|
2043
|
-
* Creates and configures an ApplePayButton when the
|
|
2042
|
+
* Creates and configures an ApplePayButton when the entry point allows it.
|
|
2044
2043
|
*
|
|
2045
|
-
*
|
|
2046
|
-
*
|
|
2047
|
-
* - {@link
|
|
2044
|
+
* - `DUAL_OFFER_BANNER` (or omitted): always-on after eligibility / exclusions —
|
|
2045
|
+
* no banners experiment read and no banners `$exposure`.
|
|
2046
|
+
* - `PAYWALL`: experiment-gated via {@link APPLE_PAY_EXPRESS_PAYWALLS_EXPERIMENT_KEY}
|
|
2047
|
+
* (`treatment` or QA URL param). The host must set up
|
|
2048
|
+
* `window.experimentIntegration` before calling for this entry point.
|
|
2049
|
+
* - `REGWALL`: inert — always returns null.
|
|
2048
2050
|
*
|
|
2049
|
-
*
|
|
2050
|
-
*
|
|
2051
|
-
*
|
|
2052
|
-
*
|
|
2053
|
-
*
|
|
2054
|
-
*
|
|
2055
|
-
* **Transition period:** the legacy `FEATURE_APPLE_PAY_EXPRESS_CHECKOUT` URL param
|
|
2056
|
-
* gate is also evaluated as a fallback until all host apps have integrated
|
|
2057
|
-
* `window.experimentIntegration`. Once all consumers are migrated, the URL param
|
|
2058
|
-
* fallback will be removed.
|
|
2051
|
+
* **PAYWALL only — transition period:** the legacy
|
|
2052
|
+
* `FEATURE_APPLE_PAY_EXPRESS_CHECKOUT` URL param can show the button without
|
|
2053
|
+
* treatment (and without inflating `$exposure`). For banners, the same URL
|
|
2054
|
+
* param / `BYPASS_APPLE_PAY_CHECKS` only bypass **eligibility**, not an
|
|
2055
|
+
* experiment gate.
|
|
2059
2056
|
*
|
|
2060
2057
|
* **Eligibility:**
|
|
2061
|
-
* - `DUAL_OFFER_BANNER` (or omitted): homepage + Safari/iPhone
|
|
2058
|
+
* - `DUAL_OFFER_BANNER` (or omitted): homepage + Safari/iPhone
|
|
2062
2059
|
* - `PAYWALL`: Safari/Apple device only (no homepage) — article paywalls
|
|
2063
|
-
* - `REGWALL`: no host-side placement gate (pre-SMA-3301 article behaviour)
|
|
2064
2060
|
*
|
|
2065
2061
|
* @param offer - The offer to display in the Apple Pay flow.
|
|
2066
2062
|
* @param country - The user's country code.
|
|
@@ -2083,28 +2079,33 @@ var ApplePayButton = class _ApplePayButton extends HTMLElement {
|
|
|
2083
2079
|
}
|
|
2084
2080
|
const { isEligible: eligibilityCheck, experimentFlagKey } = config;
|
|
2085
2081
|
const isEligible = eligibilityCheck();
|
|
2086
|
-
if (
|
|
2082
|
+
if (config.enabled === false) {
|
|
2087
2083
|
return null;
|
|
2088
2084
|
}
|
|
2089
|
-
|
|
2090
|
-
experimentFlagKey
|
|
2091
|
-
);
|
|
2092
|
-
const isExperimentVariant = experimentValue === APPLE_PAY_EXPRESS_VARIANTS.CONTROL || experimentValue === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
2093
|
-
if (isExperimentVariant && isEligible && !bypassApplePayChecks() && !hasUrlParamFlag) {
|
|
2094
|
-
void isApplePayAvailable().then((available) => {
|
|
2095
|
-
if (available) {
|
|
2096
|
-
trackApplePayExperimentExposure(
|
|
2097
|
-
experimentValue,
|
|
2098
|
-
getExperimentKeyFromNextData(experimentFlagKey),
|
|
2099
|
-
experimentFlagKey
|
|
2100
|
-
);
|
|
2101
|
-
}
|
|
2102
|
-
});
|
|
2103
|
-
}
|
|
2104
|
-
const isTreatment = experimentValue === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
2105
|
-
if (!isTreatment && !hasUrlParamFlag) {
|
|
2085
|
+
if (!hasUrlParamFlag && !bypassApplePayChecks() && !isEligible) {
|
|
2106
2086
|
return null;
|
|
2107
2087
|
}
|
|
2088
|
+
if (experimentFlagKey) {
|
|
2089
|
+
const experimentValue = window.experimentIntegration?.getVariant?.(
|
|
2090
|
+
experimentFlagKey
|
|
2091
|
+
);
|
|
2092
|
+
const isExperimentVariant = experimentValue === APPLE_PAY_EXPRESS_VARIANTS.CONTROL || experimentValue === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
2093
|
+
if (isExperimentVariant && isEligible && !bypassApplePayChecks() && !hasUrlParamFlag) {
|
|
2094
|
+
void isApplePayAvailable().then((available) => {
|
|
2095
|
+
if (available) {
|
|
2096
|
+
trackApplePayExperimentExposure(
|
|
2097
|
+
experimentValue,
|
|
2098
|
+
getExperimentKeyFromNextData(experimentFlagKey),
|
|
2099
|
+
experimentFlagKey
|
|
2100
|
+
);
|
|
2101
|
+
}
|
|
2102
|
+
});
|
|
2103
|
+
}
|
|
2104
|
+
const isTreatment = experimentValue === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
2105
|
+
if (!isTreatment && !hasUrlParamFlag) {
|
|
2106
|
+
return null;
|
|
2107
|
+
}
|
|
2108
|
+
}
|
|
2108
2109
|
_ApplePayButton.define();
|
|
2109
2110
|
const button = document.createElement(_ApplePayButton.tag);
|
|
2110
2111
|
button.offer = offer;
|
|
@@ -2417,7 +2418,6 @@ function defineApplePayElements() {
|
|
|
2417
2418
|
}
|
|
2418
2419
|
export {
|
|
2419
2420
|
APPLE_PAY_EXCLUDED_VARIANTS,
|
|
2420
|
-
APPLE_PAY_EXPRESS_EXPERIMENT_KEY,
|
|
2421
2421
|
APPLE_PAY_EXPRESS_PAYWALLS_EXPERIMENT_KEY,
|
|
2422
2422
|
APPLE_PAY_EXPRESS_VARIANTS,
|
|
2423
2423
|
ApplePayButton,
|
|
@@ -1,18 +1,20 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* Host-side eligibility for Apple Pay Express
|
|
2
|
+
* Host-side placement eligibility for Apple Pay Express.
|
|
3
3
|
*
|
|
4
|
-
*
|
|
5
|
-
*
|
|
6
|
-
*
|
|
7
|
-
*
|
|
4
|
+
* Used by createIfEnabled after offer exclusions. Enforces placement and
|
|
5
|
+
* device/browser eligibility (homepage + Safari/Apple for banners;
|
|
6
|
+
* Safari/Apple only for paywalls). Banner surfaces are always-on after
|
|
7
|
+
* eligibility; paywalls remain experiment-gated separately. Exposure
|
|
8
|
+
* (paywalls) is further gated on isApplePayAvailable()
|
|
9
|
+
* (BYPASS_APPLE_PAY_CHECKS respected).
|
|
8
10
|
*/
|
|
9
11
|
export declare const isApplePayExpressHomepage: (pathname?: string) => boolean;
|
|
10
12
|
/**
|
|
11
|
-
* Dual-offer homepage
|
|
12
|
-
* Anonymous is assumed because
|
|
13
|
+
* Dual-offer / Free Trial homepage banners: homepage + Safari/iPhone.
|
|
14
|
+
* Anonymous is assumed because these banners are only mounted for
|
|
13
15
|
* anonymous visitors.
|
|
14
16
|
*/
|
|
15
|
-
export declare const
|
|
17
|
+
export declare const isEligibleForApplePayExpressBanner: () => boolean;
|
|
16
18
|
/**
|
|
17
19
|
* Article paywalls (`ApplePayEntryPoint.PAYWALL`): Safari/Apple device only.
|
|
18
20
|
* Homepage targeting does not apply — paywalls render on article pages.
|
|
@@ -7,10 +7,10 @@ var isAppleDeviceOrSafari = () => {
|
|
|
7
7
|
|
|
8
8
|
// src/utils/applePayExpressEligibility.ts
|
|
9
9
|
var isApplePayExpressHomepage = (pathname = window.location.pathname) => pathname === "/";
|
|
10
|
-
var
|
|
10
|
+
var isEligibleForApplePayExpressBanner = () => isApplePayExpressHomepage() && isAppleDeviceOrSafari();
|
|
11
11
|
var isEligibleForApplePayExpressPaywallExperiment = () => isAppleDeviceOrSafari();
|
|
12
12
|
export {
|
|
13
13
|
isApplePayExpressHomepage,
|
|
14
|
-
|
|
14
|
+
isEligibleForApplePayExpressBanner,
|
|
15
15
|
isEligibleForApplePayExpressPaywallExperiment
|
|
16
16
|
};
|
|
@@ -57,10 +57,10 @@ export type ImpressionMetadata = {
|
|
|
57
57
|
* experiment_key from Engagement SSR (__NEXT_DATA__) when present for run
|
|
58
58
|
* attribution.
|
|
59
59
|
*
|
|
60
|
-
* @param flagKey - Amplitude flag_key.
|
|
61
|
-
*
|
|
60
|
+
* @param flagKey - Amplitude flag_key (required). Callers must pass an
|
|
61
|
+
* explicit key such as {@link APPLE_PAY_EXPRESS_PAYWALLS_EXPERIMENT_KEY}.
|
|
62
62
|
*/
|
|
63
|
-
export declare const trackApplePayExperimentExposure: (variant: string, experimentKey
|
|
63
|
+
export declare const trackApplePayExperimentExposure: (variant: string, experimentKey: string | undefined, flagKey: ApplePayExperimentFlagKey) => void;
|
|
64
64
|
/** Wallet button displayed — emits all 5 required analytics dimensions. */
|
|
65
65
|
export declare const trackExpressWalletImpression: (skuId: string, { entryPoint, country }: ImpressionMetadata) => void;
|
|
66
66
|
/** Wallet button clicked */
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
// src/constants.ts
|
|
2
|
-
var APPLE_PAY_EXPRESS_EXPERIMENT_KEY = "apple-pay-express-checkout-on-banners";
|
|
3
2
|
var APPLE_PAY_EXPRESS_VARIANTS = {
|
|
4
3
|
CONTROL: "control",
|
|
5
4
|
TREATMENT: "treatment"
|
|
@@ -42,7 +41,7 @@ var track = (action, extra) => {
|
|
|
42
41
|
...extra
|
|
43
42
|
});
|
|
44
43
|
};
|
|
45
|
-
var trackApplePayExperimentExposure = (variant, experimentKey, flagKey
|
|
44
|
+
var trackApplePayExperimentExposure = (variant, experimentKey, flagKey) => {
|
|
46
45
|
const isActiveVariant = variant === APPLE_PAY_EXPRESS_VARIANTS.CONTROL || variant === APPLE_PAY_EXPRESS_VARIANTS.TREATMENT;
|
|
47
46
|
if (!isActiveVariant) {
|
|
48
47
|
return;
|