From 6f98b0f08531beef017a507e1c6be17f17be69a9 Mon Sep 17 00:00:00 2001 From: suweinberg Date: Wed, 6 Aug 2025 12:06:33 -0700 Subject: [PATCH] update ites btn label --- src/funding/paylater/config.jsx | 16 ++-- src/ui/buttons/styles/styleUtils.js | 8 +- .../tests/funding/paylater/index.js | 80 +++++++++++++++++-- 3 files changed, 90 insertions(+), 14 deletions(-) diff --git a/src/funding/paylater/config.jsx b/src/funding/paylater/config.jsx index f073aa58a8..a18734badd 100644 --- a/src/funding/paylater/config.jsx +++ b/src/funding/paylater/config.jsx @@ -29,17 +29,21 @@ function getLabelText(fundingEligibility: FundingEligibilityType): ?string { } if ( - paylater?.products?.payIn3?.eligible && - paylater?.products?.payIn3?.variant === "ES" + (paylater?.products?.payIn3?.eligible && + paylater?.products?.payIn3?.variant === "ES") || + (paylater?.products?.paylater?.eligible && + paylater?.products?.paylater?.variant === "ES") ) { - labelText = "Paga en 3 plazos"; + labelText = "Paga a plazos"; } if ( - paylater?.products?.payIn3?.eligible && - paylater?.products?.payIn3?.variant === "IT" + (paylater?.products?.payIn3?.eligible && + paylater?.products?.payIn3?.variant === "IT") || + (paylater?.products?.paylater?.eligible && + paylater?.products?.paylater?.variant === "IT") ) { - labelText = "Paga in 3 rate"; + labelText = "Paga a rate"; } if (paylater?.products?.payIn4?.eligible) { diff --git a/src/ui/buttons/styles/styleUtils.js b/src/ui/buttons/styles/styleUtils.js index c5a6e65b1e..cd1a7c9355 100644 --- a/src/ui/buttons/styles/styleUtils.js +++ b/src/ui/buttons/styles/styleUtils.js @@ -120,7 +120,9 @@ export function getResponsiveStyleVariables({ const shouldResizeLabel = paylater?.products?.paylater?.variant === "DE" || paylater?.products?.payIn3?.variant === "IT" || - paylater?.products?.payIn3?.variant === "ES"; + paylater?.products?.paylater?.variant === "IT" || + paylater?.products?.payIn3?.variant === "ES" || + paylater?.products?.paylater?.variant === "ES"; const textPercPercentage = shouldResizeLabel ? 32 : 36; const labelPercPercentage = shouldResizeLabel ? 32 : 35; @@ -174,7 +176,9 @@ export function getDisableMaxHeightResponsiveStyleVariables({ const shouldResizeLabel = paylater?.products?.paylater?.variant === "DE" || paylater?.products?.payIn3?.variant === "IT" || - paylater?.products?.payIn3?.variant === "ES"; + paylater?.products?.paylater?.variant === "IT" || + paylater?.products?.payIn3?.variant === "ES" || + paylater?.products?.paylater?.variant === "ES"; const labelHeight = getLabelHeight({ height: buttonHeight, diff --git a/test/integration/tests/funding/paylater/index.js b/test/integration/tests/funding/paylater/index.js index 11d4e9f046..3d40968ae3 100644 --- a/test/integration/tests/funding/paylater/index.js +++ b/test/integration/tests/funding/paylater/index.js @@ -154,7 +154,7 @@ describe(`paylater button text`, () => { }); }); - it(`should display Paga in 3 rate label when payIn3 product is eligible and variant is IT`, () => { + it(`should display Paga a rate label when payIn3 product is eligible and variant is IT`, () => { const fundingSource = FUNDING.PAYLATER; mockProp( window.__TEST_FUNDING_ELIGIBILITY__[fundingSource], @@ -179,16 +179,50 @@ describe(`paylater button text`, () => { return button.render("#testContainer").then(() => { assert.equal( getElementRecursive(".paypal-button-text").innerHTML, - "Paga in 3 rate" + "Paga a rate" ); assert.equal( getElementRecursive(".paypal-button").getAttribute("aria-label"), - "Paga in 3 rate" + "Paga a rate" ); }); }); - it(`should display Paga en 3 plazos label when payIn3 product is eligible and variant is ES`, () => { + it(`should display Paga a rate label when paylater product is eligible and variant is IT`, () => { + const fundingSource = FUNDING.PAYLATER; + mockProp( + window.__TEST_FUNDING_ELIGIBILITY__[fundingSource], + "eligible", + true + ); + mockProp(window.__TEST_FUNDING_ELIGIBILITY__[fundingSource], "products", { + paylater: { + eligible: true, + variant: "IT", + }, + }); + + const button = window.paypal.Buttons({ + fundingSource, + }); + + if (!button.isEligible()) { + throw new Error(`Expected paylater to be eligible`); + } + + return button.render("#testContainer").then(() => { + assert.equal( + getElementRecursive(".paypal-button-text").innerHTML, + "Paga a rate" + ); + assert.equal( + getElementRecursive(".paypal-button").getAttribute("aria-label"), + "Paga a rate" + ); + }); + }); + + it(`should display Paga a plazos label when payIn3 product is eligible and variant is ES`, () => { const fundingSource = FUNDING.PAYLATER; mockProp( window.__TEST_FUNDING_ELIGIBILITY__[fundingSource], @@ -213,11 +247,45 @@ describe(`paylater button text`, () => { return button.render("#testContainer").then(() => { assert.equal( getElementRecursive(".paypal-button-text").innerHTML, - "Paga en 3 plazos" + "Paga a plazos" + ); + assert.equal( + getElementRecursive(".paypal-button").getAttribute("aria-label"), + "Paga a plazos" + ); + }); + }); + + it(`should display Paga a plazos label when paylater product is eligible and variant is ES`, () => { + const fundingSource = FUNDING.PAYLATER; + mockProp( + window.__TEST_FUNDING_ELIGIBILITY__[fundingSource], + "eligible", + true + ); + mockProp(window.__TEST_FUNDING_ELIGIBILITY__[fundingSource], "products", { + paylater: { + eligible: true, + variant: "ES", + }, + }); + + const button = window.paypal.Buttons({ + fundingSource, + }); + + if (!button.isEligible()) { + throw new Error(`Expected paylater to be eligible`); + } + + return button.render("#testContainer").then(() => { + assert.equal( + getElementRecursive(".paypal-button-text").innerHTML, + "Paga a plazos" ); assert.equal( getElementRecursive(".paypal-button").getAttribute("aria-label"), - "Paga en 3 plazos" + "Paga a plazos" ); }); });