@paypal/checkout-components 5.0.436 → 5.0.437-alpha-ca07432.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@paypal/checkout-components",
-  "version": "5.0.436",
+  "version": "5.0.437-alpha-ca07432.0",
   "description": "PayPal Checkout components, for integrating checkout products.",
   "main": "index.js",
   "scripts": {

package/src/types.js

@@ -71,6 +71,7 @@ export type Experiment = {|
   isPaylaterCobrandedLabelEnabled?: boolean,
   isPaylaterCobrandedLabelRandomizationEnabled?: boolean,
   isBfcacheEnabled?: boolean,
+  isWebMCPEnabled?: boolean,
 |};
 
 export type Requires = {|

package/src/zoid/buttons/component.jsx

@@ -236,13 +236,17 @@ export const getButtonsComponent: () => ButtonsComponent = memoize(() => {
         fundingSource = `-${props.fundingSource}`;
       }
 
+      const baseIframeAttributes = {
+        allowpaymentrequest: "allowpaymentrequest",
+        scrolling: "no",
+        title: `${FUNDING_BRAND_LABEL.PAYPAL}${fundingSource}`,
+        role: "presentation",
+      };
+
       return {
-        iframe: {
-          allowpaymentrequest: "allowpaymentrequest",
-          scrolling: "no",
-          title: `${FUNDING_BRAND_LABEL.PAYPAL}${fundingSource}`,
-          role: "presentation",
-        },
+        iframe: props.experiment?.isWebMCPEnabled
+          ? { ...baseIframeAttributes, allow: "tools" }
+          : baseIframeAttributes,
       };
     },
 

package/src/zoid/buttons/component.test.js

@@ -56,3 +56,32 @@ describe("getButtonsComponent iframe title", () => {
     );
   });
 });
+
+describe("getButtonsComponent iframe allow attribute", () => {
+  it("does not set allow when the WebMCP first-render experiment flag is absent", () => {
+    getButtonsComponent();
+    const { attributes } = createMock.mock.calls[0][0];
+
+    expect(attributes({ props: {} }).iframe.allow).toBeUndefined();
+  });
+
+  it("does not set allow when the WebMCP first-render experiment flag is disabled", () => {
+    getButtonsComponent();
+    const { attributes } = createMock.mock.calls[0][0];
+
+    expect(
+      attributes({ props: { experiment: { isWebMCPEnabled: false } } }).iframe
+        .allow,
+    ).toBeUndefined();
+  });
+
+  it("sets allow to 'tools' when the WebMCP first-render experiment flag is enabled", () => {
+    getButtonsComponent();
+    const { attributes } = createMock.mock.calls[0][0];
+
+    expect(
+      attributes({ props: { experiment: { isWebMCPEnabled: true } } }).iframe
+        .allow,
+    ).toBe("tools");
+  });
+});