Support Venmo vault without purchase with a feature flag

package.json

@@ -69,8 +69,8 @@
   "readmeFilename": "README.md",
   "devDependencies": {
     "@bunchtogether/vite-plugin-flow": "^1.0.2",
-    "@krakenjs/grumbler-scripts": "^8.1.5",
     "@krakenjs/eslint-config-grumbler": "8.1.3",
+    "@krakenjs/grumbler-scripts": "^8.1.5",
     "@krakenjs/sync-browser-mocks": "^3.0.0",
     "@percy/cli": "1.28.5",
     "@percy/playwright": "^1.0.4",

src/funding/funding.js

@@ -125,6 +125,7 @@ export function isFundingEligible(
       enableFunding,
       components,
       experiment,
+      flow,
       fundingSource,
       fundingEligibility,
       layout,

src/funding/venmo/config.jsx

@@ -8,7 +8,7 @@ import {
 } from "@paypal/sdk-logos/src";
 import { DISPLAY_ONLY_VALUES, PLATFORM } from "@paypal/sdk-constants/src";
 
-import { BUTTON_COLOR, BUTTON_LAYOUT } from "../../constants";
+import { BUTTON_COLOR, BUTTON_LAYOUT, BUTTON_FLOW } from "../../constants";
 import { DEFAULT_FUNDING_CONFIG, type FundingSourceConfig } from "../common";
 
 import { WalletLabel, Label } from "./template";
@@ -17,9 +17,11 @@ export function getVenmoConfig(): FundingSourceConfig {
   return {
     ...DEFAULT_FUNDING_CONFIG,
 
+    flows: [BUTTON_FLOW.PURCHASE, BUTTON_FLOW.VAULT_WITHOUT_PURCHASE],
+
     layouts: [BUTTON_LAYOUT.HORIZONTAL, BUTTON_LAYOUT.VERTICAL],
 
-    eligible: ({ experiment, shippingChange, displayOnly }) => {
+    eligible: ({ experiment, shippingChange, displayOnly, flow }) => {
       if (experiment && experiment.enableVenmo === false) {
         return false;
       }
@@ -39,6 +41,13 @@ export function getVenmoConfig(): FundingSourceConfig {
         return false;
       }
 
+      if (
+        flow === BUTTON_FLOW.VAULT_WITHOUT_PURCHASE &&
+        experiment?.venmoVaultWithoutPurchase !== true
+      ) {
+        return false;
+      }
+
       return true;
     },
 

src/funding/venmo/config.test.js

@@ -2,6 +2,8 @@
 
 import { describe, expect } from "vitest";
 
+import { BUTTON_FLOW } from "../../constants";
+
 import { getVenmoConfig } from "./config";
 
 describe("Venmo eligibility", () => {
@@ -46,4 +48,25 @@ describe("Venmo eligibility", () => {
 
     expect(isVenmoEligible).toEqual(true);
   });
+
+  test("should not be eligible if flow is VAULT_WITHOUT_PURCHASE and venmoVaultWithoutPurchase is false", () => {
+    const isVenmoEligible = venmoConfig.eligible?.({
+      ...baseEligibilityProps,
+      flow: BUTTON_FLOW.VAULT_WITHOUT_PURCHASE,
+    });
+
+    expect(isVenmoEligible).toEqual(false);
+  });
+
+  test("should be eligible if flow is VAULT_WITHOUT_PURCHASE and venmoVaultWithoutPurchase is true", () => {
+    const isVenmoEligible = venmoConfig.eligible?.({
+      ...baseEligibilityProps,
+      flow: BUTTON_FLOW.VAULT_WITHOUT_PURCHASE,
+      experiment: {
+        venmoVaultWithoutPurchase: true,
+      },
+    });
+
+    expect(isVenmoEligible).toEqual(true);
+  });
 });

src/zoid/buttons/component.jsx

@@ -39,6 +39,7 @@ import {
   getVersion,
   getDisableSetCookie,
   getExperimentation,
+  getFirstRenderExperiments,
   getSDKAttribute,
   getJsSdkLibrary,
 } from "@paypal/sdk-client/src";
@@ -472,12 +473,13 @@ export const getButtonsComponent: () => ButtonsComponent = memoize(() => {
       experiment: {
         type: "object",
         queryParam: true,
-        value: () => {
-          const experiments = getButtonExperiments();
-          return experiments;
-        },
+        value: () => ({
+          ...getButtonExperiments(),
+          ...getFirstRenderExperiments(),
+        }),
       },
-
+      // TODO first-render-experiment-cleanup
+      // verify if this is needed/used now that were putting the first render experiments in experiment param above
       experimentation: {
         type: "object",
         queryParam: true,