From 8bcc6b31bb547047a860dd2c6ad6939033849537 Mon Sep 17 00:00:00 2001 From: Guilherme Pressutto Date: Tue, 1 Oct 2024 16:32:45 -0300 Subject: [PATCH 01/28] Using Floating Labels with Stripe Appearance API (#9498) --- changelog/add-stripe-floating-labels | 4 + client/checkout/api/test/index.test.js | 1 + client/checkout/blocks/payment-elements.js | 2 +- client/checkout/upe-styles/index.js | 66 +++++++++++----- client/checkout/upe-styles/test/index.js | 1 + client/checkout/upe-styles/upe-styles.js | 1 + client/checkout/upe-styles/utils.js | 76 +++++++++++++++++++ .../woopay-express-checkout-button.test.js | 1 + 8 files changed, 130 insertions(+), 22 deletions(-) create mode 100644 changelog/add-stripe-floating-labels diff --git a/changelog/add-stripe-floating-labels b/changelog/add-stripe-floating-labels new file mode 100644 index 00000000000..c82d0361748 --- /dev/null +++ b/changelog/add-stripe-floating-labels @@ -0,0 +1,4 @@ +Significance: minor +Type: add + +Using Floating Labels with Stripe Appearance API for Blocks Checkout diff --git a/client/checkout/api/test/index.test.js b/client/checkout/api/test/index.test.js index dd291f4f8a7..7fe7e8c3f70 100644 --- a/client/checkout/api/test/index.test.js +++ b/client/checkout/api/test/index.test.js @@ -50,6 +50,7 @@ const mockAppearance = { fontFamily: undefined, fontSizeBase: undefined, }, + labels: 'above', }; describe( 'WCPayAPI', () => { diff --git a/client/checkout/blocks/payment-elements.js b/client/checkout/blocks/payment-elements.js index 84ac4be9393..7359b89a162 100644 --- a/client/checkout/blocks/payment-elements.js +++ b/client/checkout/blocks/payment-elements.js @@ -36,7 +36,7 @@ const PaymentElements = ( { api, ...props } ) => { useEffect( () => { async function generateUPEAppearance() { // Generate UPE input styles. - let upeAppearance = getAppearance( 'blocks_checkout' ); + let upeAppearance = getAppearance( 'blocks_checkout', false, true ); upeAppearance = await api.saveUPEAppearance( upeAppearance, 'blocks_checkout' diff --git a/client/checkout/upe-styles/index.js b/client/checkout/upe-styles/index.js index 73f84596924..3636c4cbbe2 100644 --- a/client/checkout/upe-styles/index.js +++ b/client/checkout/upe-styles/index.js @@ -8,6 +8,7 @@ import { dashedToCamelCase, isColorLight, getBackgroundColor, + handleAppearanceForFloatingLabel, } from './utils.js'; export const appearanceSelectors = { @@ -15,6 +16,7 @@ export const appearanceSelectors = { hiddenContainer: '#wcpay-hidden-div', hiddenInput: '#wcpay-hidden-input', hiddenInvalidInput: '#wcpay-hidden-invalid-input', + hiddenValidActiveLabel: '#wcpay-hidden-valid-active-label', }, classicCheckout: { appendTarget: '.woocommerce-billing-fields__field-wrapper', @@ -40,16 +42,15 @@ export const appearanceSelectors = { linkSelectors: [ 'a' ], }, blocksCheckout: { - appendTarget: '#billing.wc-block-components-address-form', - upeThemeInputSelector: '#billing-first_name', - upeThemeLabelSelector: - '.wc-block-components-checkout-step__description', + appendTarget: '#contact-fields', + upeThemeInputSelector: '.wc-block-components-text-input #email', + upeThemeLabelSelector: '.wc-block-components-text-input label', rowElement: 'div', - validClasses: [ 'wc-block-components-text-input' ], + validClasses: [ 'wc-block-components-text-input', 'is-active' ], invalidClasses: [ 'wc-block-components-text-input', 'has-error' ], alternateSelectors: { - appendTarget: '#shipping.wc-block-components-address-form', - upeThemeInputSelector: '#shipping-first_name', + appendTarget: '#billing.wc-block-components-address-form', + upeThemeInputSelector: '#billing-first_name', upeThemeLabelSelector: '.wc-block-components-checkout-step__description', }, @@ -326,6 +327,13 @@ const hiddenElementsForUPE = { selectors.hiddenInput ); + // Clone & append target label to hidden valid row. + this.appendClone( + hiddenValidRow, + selectors.upeThemeLabelSelector, + selectors.hiddenValidActiveLabel + ); + // Clone & append target input to hidden invalid row. this.appendClone( hiddenInvalidRow, @@ -489,24 +497,40 @@ export const getAppearance = ( elementsLocation, forWooPay = false ) => { fontSizeBase: labelRules.fontSize, }; - const appearance = { + const isFloatingLabel = elementsLocation === 'blocks_checkout'; + + let appearance = { variables: globalRules, theme: isColorLight( backgroundColor ) ? 'stripe' : 'night', - rules: { - '.Input': inputRules, - '.Input--invalid': inputInvalidRules, - '.Label': labelRules, - '.Block': blockRules, - '.Tab': tabRules, - '.Tab:hover': tabHoverRules, - '.Tab--selected': selectedTabRules, - '.TabIcon:hover': tabIconHoverRules, - '.TabIcon--selected': selectedTabIconRules, - '.Text': labelRules, - '.Text--redirect': labelRules, - }, + labels: isFloatingLabel ? 'floating' : 'above', + // We need to clone the object to avoid modifying other rules when updating the appearance for floating labels. + rules: JSON.parse( + JSON.stringify( { + '.Input': inputRules, + '.Input--invalid': inputInvalidRules, + '.Label': labelRules, + '.Block': blockRules, + '.Tab': tabRules, + '.Tab:hover': tabHoverRules, + '.Tab--selected': selectedTabRules, + '.TabIcon:hover': tabIconHoverRules, + '.TabIcon--selected': selectedTabIconRules, + '.Text': labelRules, + '.Text--redirect': labelRules, + } ) + ), }; + if ( isFloatingLabel ) { + appearance = handleAppearanceForFloatingLabel( + appearance, + getFieldStyles( + selectors.hiddenValidActiveLabel, + '.Label--floating' + ) + ); + } + if ( forWooPay ) { appearance.rules = { ...appearance.rules, diff --git a/client/checkout/upe-styles/test/index.js b/client/checkout/upe-styles/test/index.js index fc63030ddb0..bc79053555a 100644 --- a/client/checkout/upe-styles/test/index.js +++ b/client/checkout/upe-styles/test/index.js @@ -223,6 +223,7 @@ describe( 'Getting styles for automated theming', () => { padding: '10px', }, }, + labels: 'above', } ); } ); diff --git a/client/checkout/upe-styles/upe-styles.js b/client/checkout/upe-styles/upe-styles.js index 98c54f50b34..ffc27cee0d2 100644 --- a/client/checkout/upe-styles/upe-styles.js +++ b/client/checkout/upe-styles/upe-styles.js @@ -93,6 +93,7 @@ const restrictedTabIconSelectedProperties = [ 'color' ]; export const upeRestrictedProperties = { '.Label': upeSupportedProperties[ '.Label' ], + '.Label--floating': [ ...upeSupportedProperties[ '.Label' ], 'transform' ], '.Input': [ ...upeSupportedProperties[ '.Input' ], 'outlineColor', diff --git a/client/checkout/upe-styles/utils.js b/client/checkout/upe-styles/utils.js index d8d5cbfe81a..5db80b42a19 100644 --- a/client/checkout/upe-styles/utils.js +++ b/client/checkout/upe-styles/utils.js @@ -138,3 +138,79 @@ export const getBackgroundColor = ( selectors ) => { export const isColorLight = ( color ) => { return tinycolor( color ).getBrightness() > 125; }; + +/** + * Modifies the appearance object to include styles for floating label. + * + * @param {Object} appearance object to modify. + * @param {Object} floatingLabelStyles Floating label styles. + * @return {Object} Modified appearance object. + */ +export const handleAppearanceForFloatingLabel = ( + appearance, + floatingLabelStyles +) => { + // Add floating label styles. + appearance.rules[ '.Label--floating' ] = floatingLabelStyles; + + // Update line-height for floating label to account for scaling. + if ( + appearance.rules[ '.Label--floating' ].transform && + appearance.rules[ '.Label--floating' ].transform !== 'none' + ) { + // Extract the scaling factors from the matrix + const transformMatrix = + appearance.rules[ '.Label--floating' ].transform; + const matrixValues = transformMatrix.match( /matrix\((.+)\)/ ); + if ( matrixValues && matrixValues[ 1 ] ) { + const splitMatrixValues = matrixValues[ 1 ].split( ', ' ); + const scaleX = parseFloat( splitMatrixValues[ 0 ] ); + const scaleY = parseFloat( splitMatrixValues[ 3 ] ); + const scale = ( scaleX + scaleY ) / 2; + + const lineHeight = parseFloat( + appearance.rules[ '.Label--floating' ].lineHeight + ); + const newLineHeight = Math.floor( lineHeight * scale ); + appearance.rules[ + '.Label--floating' + ].lineHeight = `${ newLineHeight }px`; + appearance.rules[ + '.Label--floating' + ].fontSize = `${ newLineHeight }px`; + } + delete appearance.rules[ '.Label--floating' ].transform; + } + + // Subtract the label's lineHeight from padding-top to account for floating label height. + // Minus 4px which is a constant value added by stripe to the padding-top. + // Minus 1px for each vertical padding to account for the unpredictable input height + // (see https://github.com/Automattic/woocommerce-payments/issues/9476#issuecomment-2374766540). + // When the result is less than 0, it will automatically use 0. + if ( appearance.rules[ '.Input' ].paddingTop ) { + appearance.rules[ + '.Input' + // eslint-disable-next-line max-len + ].paddingTop = `calc(${ appearance.rules[ '.Input' ].paddingTop } - ${ appearance.rules[ '.Label--floating' ].lineHeight } - 4px - 1px)`; + } + if ( appearance.rules[ '.Input' ].paddingBottom ) { + const originalPaddingBottom = parseFloat( + appearance.rules[ '.Input' ].paddingBottom + ); + appearance.rules[ + '.Input' + // eslint-disable-next-line max-len + ].paddingBottom = `${ originalPaddingBottom - 1 }px`; + + const originalLabelMarginTop = + appearance.rules[ '.Label' ].marginTop ?? '0'; + appearance.rules[ '.Label' ].marginTop = `${ Math.floor( + ( originalPaddingBottom - 1 ) / 3 + ) }px`; + appearance.rules[ + '.Label--floating' + ].marginTop = originalLabelMarginTop; + } + + return appearance; +}; diff --git a/client/checkout/woopay/express-button/test/woopay-express-checkout-button.test.js b/client/checkout/woopay/express-button/test/woopay-express-checkout-button.test.js index d31f4e19151..90b35164fe8 100644 --- a/client/checkout/woopay/express-button/test/woopay-express-checkout-button.test.js +++ b/client/checkout/woopay/express-button/test/woopay-express-checkout-button.test.js @@ -98,6 +98,7 @@ describe( 'WoopayExpressCheckoutButton', () => { fontFamily: undefined, fontSizeBase: undefined, }, + labels: 'above', }; beforeEach( () => { From 74392070d351020828efeb4431d713f14bedca4c Mon Sep 17 00:00:00 2001 From: Alfredo Sumaran Date: Tue, 1 Oct 2024 23:56:21 -0500 Subject: [PATCH 02/28] Stop enqueuing woopay-express-button.css to prevent 404 errors (#9509) --- changelog/as-fix-unnecessary-css-import | 4 ++++ includes/class-wc-payments-woopay-button-handler.php | 6 ------ 2 files changed, 4 insertions(+), 6 deletions(-) create mode 100644 changelog/as-fix-unnecessary-css-import diff --git a/changelog/as-fix-unnecessary-css-import b/changelog/as-fix-unnecessary-css-import new file mode 100644 index 00000000000..e6fdf701c72 --- /dev/null +++ b/changelog/as-fix-unnecessary-css-import @@ -0,0 +1,4 @@ +Significance: minor +Type: fix + +Stop enqueuing woopay-express-button.css to prevent 404 errors diff --git a/includes/class-wc-payments-woopay-button-handler.php b/includes/class-wc-payments-woopay-button-handler.php index 391358f97ec..a5cdac1d16b 100644 --- a/includes/class-wc-payments-woopay-button-handler.php +++ b/includes/class-wc-payments-woopay-button-handler.php @@ -170,12 +170,6 @@ public function scripts() { } WC_Payments::register_script_with_dependencies( 'WCPAY_WOOPAY_EXPRESS_BUTTON', 'dist/woopay-express-button' ); - WC_Payments_Utils::enqueue_style( - 'WCPAY_WOOPAY_EXPRESS_BUTTON', - plugins_url( 'dist/woopay-express-button.css', WCPAY_PLUGIN_FILE ), - [], - WC_Payments::get_file_version( 'dist/woopay-express-button.css' ) - ); $wcpay_config = rawurlencode( wp_json_encode( WC_Payments::get_wc_payments_checkout()->get_payment_fields_js_config() ) ); From 5faa312e8074b8116b318527eaf5789a90b13bd4 Mon Sep 17 00:00:00 2001 From: Rua Haszard Date: Wed, 2 Oct 2024 18:02:15 +1300 Subject: [PATCH 03/28] add default (= null) for classNames prop so it's optional for `WizardTaskItem` and `CollapsibleBody` (#9157) Co-authored-by: Rua Haszard Co-authored-by: Eric Jinks <3147296+Jinksi@users.noreply.github.com> --- .../fix-9142-classname-optional-default-null | 4 ++++ ...{collapsible-body.js => collapsible-body.tsx} | 5 ++++- .../wizard/{task-item.js => task-item.tsx} | 16 ++++++++++++++-- .../wizard/{task-item.js => task-item.tsx} | 14 +++++++++++--- client/vat/form/tasks/company-data-task.tsx | 3 +-- client/vat/form/tasks/vat-number-task.tsx | 3 +-- 6 files changed, 35 insertions(+), 10 deletions(-) create mode 100644 changelog/fix-9142-classname-optional-default-null rename client/additional-methods-setup/wizard/{collapsible-body.js => collapsible-body.tsx} (80%) rename client/additional-methods-setup/wizard/{task-item.js => task-item.tsx} (82%) rename client/multi-currency-setup/wizard/{task-item.js => task-item.tsx} (86%) diff --git a/changelog/fix-9142-classname-optional-default-null b/changelog/fix-9142-classname-optional-default-null new file mode 100644 index 00000000000..bfcb783f576 --- /dev/null +++ b/changelog/fix-9142-classname-optional-default-null @@ -0,0 +1,4 @@ +Significance: patch +Type: dev + +Migrate WizardTaskItem and CollapsibleBody components to TypeScript, making the className prop optional. diff --git a/client/additional-methods-setup/wizard/collapsible-body.js b/client/additional-methods-setup/wizard/collapsible-body.tsx similarity index 80% rename from client/additional-methods-setup/wizard/collapsible-body.js rename to client/additional-methods-setup/wizard/collapsible-body.tsx index 2d95556b6ce..df92339fb34 100644 --- a/client/additional-methods-setup/wizard/collapsible-body.js +++ b/client/additional-methods-setup/wizard/collapsible-body.tsx @@ -10,7 +10,10 @@ import classNames from 'classnames'; import WizardTaskContext from './task/context'; import './collapsible-body.scss'; -const CollapsibleBody = ( { className, ...restProps } ) => { +const CollapsibleBody: React.FC< React.HTMLAttributes< HTMLDivElement > > = ( { + className, + ...restProps +} ) => { const { isActive } = useContext( WizardTaskContext ); return ( diff --git a/client/additional-methods-setup/wizard/task-item.js b/client/additional-methods-setup/wizard/task-item.tsx similarity index 82% rename from client/additional-methods-setup/wizard/task-item.js rename to client/additional-methods-setup/wizard/task-item.tsx index 943ac88760e..f1c7ba4177e 100644 --- a/client/additional-methods-setup/wizard/task-item.js +++ b/client/additional-methods-setup/wizard/task-item.tsx @@ -11,7 +11,19 @@ import { Icon, check } from '@wordpress/icons'; import WizardTaskContext from './task/context'; import './task-item.scss'; -const WizardTaskItem = ( { children, title, index, className } ) => { +interface WizardTaskItemProps { + children: React.ReactNode; + title: string; + index: number; + className?: string; +} + +const WizardTaskItem: React.FC< WizardTaskItemProps > = ( { + children, + title, + index, + className, +} ) => { const { isCompleted, isActive } = useContext( WizardTaskContext ); return ( @@ -26,7 +38,7 @@ const WizardTaskItem = ( { children, title, index, className } ) => { className="wcpay-wizard-task__headline" // tabindex with value `-1` is necessary to programmatically set the focus // on an element that is not interactive. - tabIndex="-1" + tabIndex={ -1 } >
diff --git a/client/multi-currency-setup/wizard/task-item.js b/client/multi-currency-setup/wizard/task-item.tsx similarity index 86% rename from client/multi-currency-setup/wizard/task-item.js rename to client/multi-currency-setup/wizard/task-item.tsx index 02a4c081feb..93711e4c80f 100644 --- a/client/multi-currency-setup/wizard/task-item.js +++ b/client/multi-currency-setup/wizard/task-item.tsx @@ -11,12 +11,20 @@ import { Icon, check } from '@wordpress/icons'; import WizardTaskContext from '../../additional-methods-setup/wizard/task/context'; import './task-item.scss'; -const WizardTaskItem = ( { +interface WizardTaskItemProps { + children: React.ReactNode; + title: string; + index: number; + visibleDescription: string; + className?: string; +} + +const WizardTaskItem: React.FC< WizardTaskItemProps > = ( { children, title, index, - className, visibleDescription, + className, } ) => { const { isCompleted, isActive } = useContext( WizardTaskContext ); @@ -32,7 +40,7 @@ const WizardTaskItem = ( { className="wcpay-wizard-task__headline" // tabindex with value `-1` is necessary to programmatically set the focus // on an element that is not interactive. - tabIndex="-1" + tabIndex={ -1 } >
diff --git a/client/vat/form/tasks/company-data-task.tsx b/client/vat/form/tasks/company-data-task.tsx index 223c35d309d..d2cac07cc67 100644 --- a/client/vat/form/tasks/company-data-task.tsx +++ b/client/vat/form/tasks/company-data-task.tsx @@ -96,9 +96,8 @@ export const CompanyDataTask = ( { 'Confirm your business details', 'woocommerce-payments' ) } - className={ null } > - +

{ __( @@ -168,7 +167,7 @@ export const VatNumberTask = ( { ) }

- + Date: Thu, 3 Oct 2024 07:23:38 -0300 Subject: [PATCH 04/28] Rendering Test Model badge only for Credit Card (#9514) Co-authored-by: Samir Merchant --- changelog/fix-test-mode-badge-credit-card | 4 ++++ client/checkout/blocks/payment-method-label.js | 4 +++- 2 files changed, 7 insertions(+), 1 deletion(-) create mode 100644 changelog/fix-test-mode-badge-credit-card diff --git a/changelog/fix-test-mode-badge-credit-card b/changelog/fix-test-mode-badge-credit-card new file mode 100644 index 00000000000..dfb2537989d --- /dev/null +++ b/changelog/fix-test-mode-badge-credit-card @@ -0,0 +1,4 @@ +Significance: patch +Type: fix + +Rendering Test Model badge only for Credit Card diff --git a/client/checkout/blocks/payment-method-label.js b/client/checkout/blocks/payment-method-label.js index ddb1506e5a9..e63009d691d 100644 --- a/client/checkout/blocks/payment-method-label.js +++ b/client/checkout/blocks/payment-method-label.js @@ -36,13 +36,15 @@ export default ( { window.wcBlocksCheckoutData?.storeCountry || 'US'; + const isCreditCard = upeName === 'card'; + return ( <>
{ upeConfig.title } - { isTestMode && ( + { isCreditCard && isTestMode && ( { __( 'Test Mode', 'woocommerce-payments' ) } From c4ad4d740606cd068c612b239880771563579272 Mon Sep 17 00:00:00 2001 From: Francesco Date: Thu, 3 Oct 2024 12:44:10 +0200 Subject: [PATCH 05/28] fix: prevent multiple initializations of `WC_Payments` (#9516) --- changelog/fix-multiple-instances-of-wc-payments-in-tests | 4 ++++ includes/class-wc-payments.php | 6 ++++++ 2 files changed, 10 insertions(+) create mode 100644 changelog/fix-multiple-instances-of-wc-payments-in-tests diff --git a/changelog/fix-multiple-instances-of-wc-payments-in-tests b/changelog/fix-multiple-instances-of-wc-payments-in-tests new file mode 100644 index 00000000000..aa57d16233a --- /dev/null +++ b/changelog/fix-multiple-instances-of-wc-payments-in-tests @@ -0,0 +1,4 @@ +Significance: patch +Type: dev + +fix: prevent multiple instances of WC_Payments_Apple_Pay_Registration diff --git a/includes/class-wc-payments.php b/includes/class-wc-payments.php index 2fd925090a6..42923e906d5 100644 --- a/includes/class-wc-payments.php +++ b/includes/class-wc-payments.php @@ -303,6 +303,12 @@ class WC_Payments { * Entry point to the initialization logic. */ public static function init() { + // in TeamCity tests, there might be multiple instances of WC_Payments initialized. + // This prevents the hooks from being registered multiple times, which can cause issues. + if ( defined( 'WCPAY_VERSION_NUMBER' ) ) { + return; + } + define( 'WCPAY_VERSION_NUMBER', self::get_plugin_headers()['Version'] ); include_once __DIR__ . '/class-wc-payments-utils.php'; From 1fbf7fb6b9a48fd0a8581daca51308b86673f5c0 Mon Sep 17 00:00:00 2001 From: Francesco Date: Thu, 3 Oct 2024 13:59:28 +0200 Subject: [PATCH 06/28] fix: e2e tests save settings button (#9506) --- changelog/fix-e2e-save-settings-button-disabled | 5 +++++ tests/e2e/utils/flows.js | 11 ++++++++++- 2 files changed, 15 insertions(+), 1 deletion(-) create mode 100644 changelog/fix-e2e-save-settings-button-disabled diff --git a/changelog/fix-e2e-save-settings-button-disabled b/changelog/fix-e2e-save-settings-button-disabled new file mode 100644 index 00000000000..8e93eb9a0e8 --- /dev/null +++ b/changelog/fix-e2e-save-settings-button-disabled @@ -0,0 +1,5 @@ +Significance: patch +Type: dev +Comment: fix: e2e tests w/ save settings button disabled. + + diff --git a/tests/e2e/utils/flows.js b/tests/e2e/utils/flows.js index 267e680302b..8ceda112015 100644 --- a/tests/e2e/utils/flows.js +++ b/tests/e2e/utils/flows.js @@ -693,9 +693,18 @@ export const merchantWCP = { }, wcpSettingsSaveChanges: async () => { + const saveSettingsButtonSelector = '.save-settings-section button'; + const saveSettingsButton = await page.$( saveSettingsButtonSelector ); + const buttonStatus = await ( + await saveSettingsButton.getProperty( 'disabled' ) + ).jsonValue(); + if ( buttonStatus === true ) { + return; + } + const snackbarSettingsSaved = '.components-snackbar'; - await expect( page ).toClick( '.save-settings-section button' ); + await expect( page ).toClick( saveSettingsButtonSelector ); await expect( page ).toMatchElement( snackbarSettingsSaved, { text: 'Settings saved.', timeout: 60000, From 82e8dcb7cd90165c647ec780cee08609a854878d Mon Sep 17 00:00:00 2001 From: Leonardo Lopes de Albuquerque Date: Thu, 3 Oct 2024 13:25:11 -0300 Subject: [PATCH 07/28] Fixed the utils path for getAppearanceType (#9489) --- changelog/fix-wrong-utils-path | 4 ++++ client/checkout/woopay/email-input-iframe.js | 4 ++-- 2 files changed, 6 insertions(+), 2 deletions(-) create mode 100644 changelog/fix-wrong-utils-path diff --git a/changelog/fix-wrong-utils-path b/changelog/fix-wrong-utils-path new file mode 100644 index 00000000000..aaf2afcc9a2 --- /dev/null +++ b/changelog/fix-wrong-utils-path @@ -0,0 +1,4 @@ +Significance: patch +Type: dev + +Fixed wrong utils path that would prevent checkout with WooPay OTP diff --git a/client/checkout/woopay/email-input-iframe.js b/client/checkout/woopay/email-input-iframe.js index df410850621..83a4f196924 100644 --- a/client/checkout/woopay/email-input-iframe.js +++ b/client/checkout/woopay/email-input-iframe.js @@ -9,12 +9,12 @@ import { buildAjaxURL } from 'utils/express-checkout'; import { getAppearance } from 'checkout/upe-styles'; import { getTargetElement, - getAppearanceType, validateEmail, appendRedirectionParams, shouldSkipWooPay, deleteSkipWooPayCookie, -} from './utils'; +} from 'wcpay/checkout/woopay/utils'; +import { getAppearanceType } from 'wcpay/checkout/utils'; export const handleWooPayEmailInput = async ( field, From 49103232e9aeaa1800d987032d652a216e087a80 Mon Sep 17 00:00:00 2001 From: Guilherme Pressutto Date: Thu, 3 Oct 2024 19:12:02 -0300 Subject: [PATCH 08/28] Converting text color rgba to hex to prevent Stripe warning (#9511) --- changelog/fix-convert-rgba-text-color | 4 ++++ client/checkout/upe-styles/index.js | 9 +++++--- client/checkout/upe-styles/test/utils.js | 26 ++++++++++++++++++++++++ client/checkout/upe-styles/utils.js | 20 ++++++++++++++++++ 4 files changed, 56 insertions(+), 3 deletions(-) create mode 100644 changelog/fix-convert-rgba-text-color diff --git a/changelog/fix-convert-rgba-text-color b/changelog/fix-convert-rgba-text-color new file mode 100644 index 00000000000..3c5b8f8c52e --- /dev/null +++ b/changelog/fix-convert-rgba-text-color @@ -0,0 +1,4 @@ +Significance: patch +Type: fix + +Converting text color rgba to hex to prevent Stripe warning diff --git a/client/checkout/upe-styles/index.js b/client/checkout/upe-styles/index.js index 3636c4cbbe2..de2c41e93aa 100644 --- a/client/checkout/upe-styles/index.js +++ b/client/checkout/upe-styles/index.js @@ -8,6 +8,7 @@ import { dashedToCamelCase, isColorLight, getBackgroundColor, + maybeConvertRGBAtoRGB, handleAppearanceForFloatingLabel, } from './utils.js'; @@ -387,9 +388,11 @@ export const getFieldStyles = ( for ( let i = 0; i < styles.length; i++ ) { const camelCase = dashedToCamelCase( styles[ i ] ); if ( validProperties.includes( camelCase ) ) { - filteredStyles[ camelCase ] = styles.getPropertyValue( - styles[ i ] - ); + let propertyValue = styles.getPropertyValue( styles[ i ] ); + if ( camelCase === 'color' ) { + propertyValue = maybeConvertRGBAtoRGB( propertyValue ); + } + filteredStyles[ camelCase ] = propertyValue; } } diff --git a/client/checkout/upe-styles/test/utils.js b/client/checkout/upe-styles/test/utils.js index c8b8398f3cf..83784c9ee13 100644 --- a/client/checkout/upe-styles/test/utils.js +++ b/client/checkout/upe-styles/test/utils.js @@ -111,4 +111,30 @@ describe( 'UPE Utilities to generate UPE styles', () => { expect( upeUtils.isColorLight( darkGrey ) ).toEqual( false ); expect( upeUtils.isColorLight( lightGrey ) ).toEqual( true ); } ); + + test( 'maybeConvertRGBAtoRGB returns valid colors', () => { + const hex = '#ffffff'; + const color = 'red'; + const rgb = 'rgb(1, 2, 3)'; + const rgbNoSpaces = 'rgb(1,2,3)'; + const rgba = 'rgba(1, 2, 3, 1)'; + const rgbaNoSpaces = 'rgba(1,2,3,1)'; + const shadow = 'rgb(1,2,3) 0px 1px 1px 0px'; + const shadowTransparent = 'rgba(1,2,3,1) 0px 1px 1px 0px'; + const pixel = '0px'; + + expect( upeUtils.maybeConvertRGBAtoRGB( hex ) ).toEqual( hex ); + expect( upeUtils.maybeConvertRGBAtoRGB( color ) ).toEqual( color ); + expect( upeUtils.maybeConvertRGBAtoRGB( rgb ) ).toEqual( rgb ); + expect( upeUtils.maybeConvertRGBAtoRGB( rgbNoSpaces ) ).toEqual( + rgbNoSpaces + ); + expect( upeUtils.maybeConvertRGBAtoRGB( rgba ) ).toEqual( rgb ); + expect( upeUtils.maybeConvertRGBAtoRGB( rgbaNoSpaces ) ).toEqual( rgb ); + expect( upeUtils.maybeConvertRGBAtoRGB( shadow ) ).toEqual( shadow ); + expect( upeUtils.maybeConvertRGBAtoRGB( shadowTransparent ) ).toEqual( + shadowTransparent + ); + expect( upeUtils.maybeConvertRGBAtoRGB( pixel ) ).toEqual( pixel ); + } ); } ); diff --git a/client/checkout/upe-styles/utils.js b/client/checkout/upe-styles/utils.js index 5db80b42a19..7546a899653 100644 --- a/client/checkout/upe-styles/utils.js +++ b/client/checkout/upe-styles/utils.js @@ -139,6 +139,26 @@ export const isColorLight = ( color ) => { return tinycolor( color ).getBrightness() > 125; }; +/** + * Converts rgba to rgb format, since Stripe Appearances API does not accept rgba format for text color. + * + * @param {string} color CSS color value. + * @return {string} Accepted CSS color value. + */ +export const maybeConvertRGBAtoRGB = ( color ) => { + const colorParts = color.match( + /^rgba\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(0?(\.\d+)?|1?(\.0+)?)\s*\)$/ + ); + if ( colorParts ) { + const alpha = colorParts[ 4 ] || 1; + const newColorParts = colorParts.slice( 1, 4 ).map( ( part ) => { + return Math.round( part * alpha + 255 * ( 1 - alpha ) ); + } ); + color = `rgb(${ newColorParts.join( ', ' ) })`; + } + return color; +}; + /** * Modifies the appearance object to include styles for floating label. * From 60bc470c763518cfd377cce00183ce88a17b3c38 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?C=C3=A9sar=20Costa?= <10233985+cesarcosta99@users.noreply.github.com> Date: Tue, 8 Oct 2024 10:27:24 -0300 Subject: [PATCH 09/28] Bump WC tested up to version to 9.3.3 (#9536) --- changelog/dev-bump-wc-tested-up-to-version | 4 ++++ woocommerce-payments.php | 2 +- 2 files changed, 5 insertions(+), 1 deletion(-) create mode 100644 changelog/dev-bump-wc-tested-up-to-version diff --git a/changelog/dev-bump-wc-tested-up-to-version b/changelog/dev-bump-wc-tested-up-to-version new file mode 100644 index 00000000000..fc508162aec --- /dev/null +++ b/changelog/dev-bump-wc-tested-up-to-version @@ -0,0 +1,4 @@ +Significance: patch +Type: dev + +Bump WC tested up to version to 9.3.3. diff --git a/woocommerce-payments.php b/woocommerce-payments.php index aac2cbc0ad0..3d40bbd15a5 100644 --- a/woocommerce-payments.php +++ b/woocommerce-payments.php @@ -8,7 +8,7 @@ * Text Domain: woocommerce-payments * Domain Path: /languages * WC requires at least: 7.6 - * WC tested up to: 9.3.1 + * WC tested up to: 9.3.3 * Requires at least: 6.0 * Requires PHP: 7.3 * Version: 8.3.0 From 965dbfe2f4fa57697b233aa671ffdbb06c3f7c01 Mon Sep 17 00:00:00 2001 From: Alex Florisca Date: Wed, 9 Oct 2024 15:14:54 +0100 Subject: [PATCH 10/28] Add style support for the WooPay button (#9473) --- changelog/add-support-for-woo-button-controls | 4 ++++ .../express-button/woopay-express-checkout-payment-method.js | 1 + 2 files changed, 5 insertions(+) create mode 100644 changelog/add-support-for-woo-button-controls diff --git a/changelog/add-support-for-woo-button-controls b/changelog/add-support-for-woo-button-controls new file mode 100644 index 00000000000..4e46b384b5d --- /dev/null +++ b/changelog/add-support-for-woo-button-controls @@ -0,0 +1,4 @@ +Significance: minor +Type: update + +Add support for the style controls for the WooPay button diff --git a/client/checkout/woopay/express-button/woopay-express-checkout-payment-method.js b/client/checkout/woopay/express-button/woopay-express-checkout-payment-method.js index c5c8ef71d49..1ce64ed6d02 100644 --- a/client/checkout/woopay/express-button/woopay-express-checkout-payment-method.js +++ b/client/checkout/woopay/express-button/woopay-express-checkout-payment-method.js @@ -67,6 +67,7 @@ const wooPayExpressCheckoutPaymentMethod = () => ( { paymentMethodId: PAYMENT_METHOD_NAME_WOOPAY_EXPRESS_CHECKOUT, supports: { features: getConfig( 'features' ), + style: [ 'height', 'borderRadius' ], }, } ); From 2bdb6db9f6c18a67dd421b7ec5784a9ae25f7ada Mon Sep 17 00:00:00 2001 From: Vlad Olaru Date: Thu, 10 Oct 2024 15:24:23 +0300 Subject: [PATCH 11/28] Make experiment Payments task onboarding flow treatment final (#9541) --- .../update-9540-payment-task-onboarding-flow | 4 ++++ client/overview/task-list/tasks.tsx | 4 +++- includes/class-wc-payment-gateway-wcpay.php | 8 ++++---- includes/class-wc-payments-account.php | 15 ++------------- includes/class-wc-payments-utils.php | 19 ------------------- tests/unit/test-class-wc-payments-account.php | 4 ++-- 6 files changed, 15 insertions(+), 39 deletions(-) create mode 100644 changelog/update-9540-payment-task-onboarding-flow diff --git a/changelog/update-9540-payment-task-onboarding-flow b/changelog/update-9540-payment-task-onboarding-flow new file mode 100644 index 00000000000..c4674a67377 --- /dev/null +++ b/changelog/update-9540-payment-task-onboarding-flow @@ -0,0 +1,4 @@ +Significance: patch +Type: update + +Payments task onboarding flows skip the Connect page. diff --git a/client/overview/task-list/tasks.tsx b/client/overview/task-list/tasks.tsx index 7781cb6ff6f..c26370c3607 100644 --- a/client/overview/task-list/tasks.tsx +++ b/client/overview/task-list/tasks.tsx @@ -89,7 +89,9 @@ export const getTasks = ( { ! isPoInProgress; const isGoLiveTaskVisible = - isInTestModeOnboarding( false ) && showGoLiveTask; + wcpaySettings.isAccountConnected && + isInTestModeOnboarding( false ) && + showGoLiveTask; return [ isUpdateDetailsTaskVisible && diff --git a/includes/class-wc-payment-gateway-wcpay.php b/includes/class-wc-payment-gateway-wcpay.php index b7a694e88a5..615ea55a284 100644 --- a/includes/class-wc-payment-gateway-wcpay.php +++ b/includes/class-wc-payment-gateway-wcpay.php @@ -767,12 +767,12 @@ public function get_setup_help_text() { * @return string Connection URL. */ public function get_connection_url() { - $account_data = $this->account->get_cached_account_data(); - - // The onboarding is finished if account_id is set. `Set up` will be shown instead of `Connect`. - if ( isset( $account_data['account_id'] ) ) { + // If we have an account, `Set up` will be shown instead of `Connect`. + if ( $this->is_connected() ) { return ''; } + + // Note: Payments Task is not a very accurate from value, but it is the best we can do, for now. return html_entity_decode( WC_Payments_Account::get_connect_url( WC_Payments_Onboarding_Service::FROM_WCADMIN_PAYMENTS_TASK ) ); } diff --git a/includes/class-wc-payments-account.php b/includes/class-wc-payments-account.php index b2ebc33b7d3..c24cf574978 100644 --- a/includes/class-wc-payments-account.php +++ b/includes/class-wc-payments-account.php @@ -958,11 +958,8 @@ public function maybe_redirect_from_connect_page(): bool { $from = WC_Payments_Onboarding_Service::get_from(); // If the user came from the core Payments task list item, - // we run an experiment to skip the Connect page - // and go directly to the Jetpack connection flow and/or onboarding wizard. - if ( WC_Payments_Onboarding_Service::FROM_WCADMIN_PAYMENTS_TASK === $from - && WC_Payments_Utils::is_in_core_payments_task_onboarding_flow_treatment_mode() ) { - + // skip the Connect page and go directly to the Jetpack connection flow and/or onboarding wizard. + if ( WC_Payments_Onboarding_Service::FROM_WCADMIN_PAYMENTS_TASK === $from ) { // We use a connect link to allow our logic to determine what comes next: // the Jetpack connection setup and/or onboarding wizard (MOX). $this->redirect_service->redirect_to_wcpay_connect( @@ -1344,14 +1341,6 @@ public function maybe_handle_onboarding() { ], true ) - /** - * We are running an experiment to skip the Connect page for Payments Task flows. - * Only redirect to the Connect page if the user is not in the experiment's treatment mode. - * - * @see self::maybe_redirect_from_connect_page() - */ - || ( WC_Payments_Onboarding_Service::FROM_WCADMIN_PAYMENTS_TASK === $from - && ! WC_Payments_Utils::is_in_core_payments_task_onboarding_flow_treatment_mode() ) // This is a weird case, but it is best to handle it. || ( WC_Payments_Onboarding_Service::FROM_ONBOARDING_WIZARD === $from && ! $this->has_working_jetpack_connection() ) ) { diff --git a/includes/class-wc-payments-utils.php b/includes/class-wc-payments-utils.php index b70e02b0986..755901e15ca 100644 --- a/includes/class-wc-payments-utils.php +++ b/includes/class-wc-payments-utils.php @@ -910,25 +910,6 @@ public static function get_last_refund_from_order_id( $order_id ) { return null; } - /** - * Check to see if the current user is in Core Payments task onboarding flow experiment treatment mode. - * - * @return bool - */ - public static function is_in_core_payments_task_onboarding_flow_treatment_mode(): bool { - if ( ! isset( $_COOKIE['tk_ai'] ) ) { - return false; - } - - $abtest = new \WCPay\Experimental_Abtest( - sanitize_text_field( wp_unslash( $_COOKIE['tk_ai'] ) ), - 'woocommerce', - 'yes' === get_option( 'woocommerce_allow_tracking', 'no' ) - ); - - return 'treatment' === $abtest->get_variation( 'woopayments_core_payments_task_onboarding_flow_2024_v1' ); - } - /** * Helper function to check whether to show default new onboarding flow or as an exception disable it (if specific constant is set) . * diff --git a/tests/unit/test-class-wc-payments-account.php b/tests/unit/test-class-wc-payments-account.php index 990242ec57b..54ae7dede7e 100644 --- a/tests/unit/test-class-wc-payments-account.php +++ b/tests/unit/test-class-wc-payments-account.php @@ -431,7 +431,7 @@ public function provider_onboarding_known_froms() { false, true, false, - 'connect_page', + 'start_jetpack_connection', ], 'From Woo Payments task - Jetpack connection, Stripe not connected' => [ WC_Payments_Onboarding_Service::FROM_WCADMIN_PAYMENTS_TASK, @@ -439,7 +439,7 @@ public function provider_onboarding_known_froms() { true, false, false, - 'connect_page', + 'onboarding_wizard', ], 'From Woo Payments task - Jetpack connection, Stripe connected' => [ WC_Payments_Onboarding_Service::FROM_WCADMIN_PAYMENTS_TASK, From 77fd16b38861eb5189109868cc6f4118a8e91657 Mon Sep 17 00:00:00 2001 From: Vlad Olaru Date: Fri, 11 Oct 2024 11:39:46 +0300 Subject: [PATCH 12/28] Fix WooPay auto enable for new accounts (#9549) --- changelog/fix-9548-woopay-auto-enable | 4 + ...wc-rest-payments-onboarding-controller.php | 3 - includes/class-wc-payments-account.php | 12 +- .../class-wc-payments-onboarding-service.php | 19 ++- ...wc-rest-payments-onboarding-controller.php | 4 - ...t-class-wc-payments-onboarding-service.php | 116 ++++++++++++++++++ 6 files changed, 142 insertions(+), 16 deletions(-) create mode 100644 changelog/fix-9548-woopay-auto-enable diff --git a/changelog/fix-9548-woopay-auto-enable b/changelog/fix-9548-woopay-auto-enable new file mode 100644 index 00000000000..dbbf05c6bea --- /dev/null +++ b/changelog/fix-9548-woopay-auto-enable @@ -0,0 +1,4 @@ +Significance: patch +Type: fix + +Auto-enabled WooPay for new accounts. diff --git a/includes/admin/class-wc-rest-payments-onboarding-controller.php b/includes/admin/class-wc-rest-payments-onboarding-controller.php index 3124e67d61a..7a75d3d8de1 100644 --- a/includes/admin/class-wc-rest-payments-onboarding-controller.php +++ b/includes/admin/class-wc-rest-payments-onboarding-controller.php @@ -211,9 +211,6 @@ public function get_embedded_kyc_session( WP_REST_Request $request ) { $account_session['locale'] = get_user_locale(); } - // Set the onboarding in progress option. - $this->onboarding_service->set_embedded_kyc_in_progress(); - return rest_ensure_response( $account_session ); } diff --git a/includes/class-wc-payments-account.php b/includes/class-wc-payments-account.php index c24cf574978..f50acfc5b35 100644 --- a/includes/class-wc-payments-account.php +++ b/includes/class-wc-payments-account.php @@ -28,6 +28,7 @@ class WC_Payments_Account { const ONBOARDING_DISABLED_TRANSIENT = 'wcpay_on_boarding_disabled'; const ONBOARDING_STARTED_TRANSIENT = 'wcpay_on_boarding_started'; const ONBOARDING_STATE_TRANSIENT = 'wcpay_stripe_onboarding_state'; + const WOOPAY_ENABLED_BY_DEFAULT_TRANSIENT = 'woopay_enabled_by_default'; const EMBEDDED_KYC_IN_PROGRESS_OPTION = 'wcpay_onboarding_embedded_kyc_in_progress'; const ERROR_MESSAGE_TRANSIENT = 'wcpay_error_message'; const INSTANT_DEPOSITS_REMINDER_ACTION = 'wcpay_instant_deposit_reminder'; @@ -1607,7 +1608,7 @@ private function cleanup_on_account_reset() { delete_transient( self::ONBOARDING_STATE_TRANSIENT ); delete_transient( self::ONBOARDING_STARTED_TRANSIENT ); delete_option( self::EMBEDDED_KYC_IN_PROGRESS_OPTION ); - delete_transient( 'woopay_enabled_by_default' ); + delete_transient( self::WOOPAY_ENABLED_BY_DEFAULT_TRANSIENT ); // Clear the cache to avoid stale data. $this->clear_cache(); @@ -1899,7 +1900,8 @@ private function init_stripe_onboarding( string $setup_mode, string $wcpay_conne // Clean up any existing onboarding state. delete_transient( self::ONBOARDING_STATE_TRANSIENT ); - delete_option( self::EMBEDDED_KYC_IN_PROGRESS_OPTION ); + // Clear the embedded KYC in progress option, since the onboarding flow is now complete. + $this->onboarding_service->clear_embedded_kyc_in_progress(); return add_query_arg( [ 'wcpay-connection-success' => '1' ], @@ -1909,7 +1911,7 @@ private function init_stripe_onboarding( string $setup_mode, string $wcpay_conne // We have an account that needs to be verified (has a URL to redirect the merchant to). // Store the relevant onboarding data. - set_transient( 'woopay_enabled_by_default', isset( $onboarding_data['woopay_enabled_by_default'] ) ?? false, DAY_IN_SECONDS ); + set_transient( self::WOOPAY_ENABLED_BY_DEFAULT_TRANSIENT, filter_var( $onboarding_data['woopay_enabled_by_default'] ?? false, FILTER_VALIDATE_BOOLEAN ), DAY_IN_SECONDS ); // Save the onboarding state for a day. // This is used to verify the state when finalizing the onboarding and connecting the account. // On finalizing the onboarding, the transient gets deleted. @@ -1926,9 +1928,9 @@ public function maybe_activate_woopay() { return; } - if ( get_transient( 'woopay_enabled_by_default' ) ) { + if ( get_transient( self::WOOPAY_ENABLED_BY_DEFAULT_TRANSIENT ) ) { WC_Payments::get_gateway()->update_is_woopay_enabled( true ); - delete_transient( 'woopay_enabled_by_default' ); + delete_transient( self::WOOPAY_ENABLED_BY_DEFAULT_TRANSIENT ); } } diff --git a/includes/class-wc-payments-onboarding-service.php b/includes/class-wc-payments-onboarding-service.php index 8bf8f686255..e817e344e60 100644 --- a/includes/class-wc-payments-onboarding-service.php +++ b/includes/class-wc-payments-onboarding-service.php @@ -160,12 +160,13 @@ function () use ( $locale ) { * * @return array Session data. * - * @throws API_Exception + * @throws API_Exception|Exception */ public function create_embedded_kyc_session( array $self_assessment_data, bool $progressive = false ): array { if ( ! $this->payments_api_client->is_server_connected() ) { return []; } + $setup_mode = WC_Payments::mode()->is_live() ? 'live' : 'test'; // Make sure the onboarding test mode DB flag is set. @@ -193,6 +194,16 @@ public function create_embedded_kyc_session( array $self_assessment_data, bool $ return []; } + // Set the embedded KYC in progress flag. + $this->set_embedded_kyc_in_progress(); + + // Remember if we should enable WooPay by default. + set_transient( + WC_Payments_Account::WOOPAY_ENABLED_BY_DEFAULT_TRANSIENT, + filter_var( $account_session['woopay_enabled_by_default'] ?? false, FILTER_VALIDATE_BOOLEAN ), + DAY_IN_SECONDS + ); + return [ 'clientSecret' => $account_session['client_secret'] ?? '', 'expiresAt' => $account_session['expires_at'] ?? 0, @@ -230,7 +241,7 @@ public function finalize_embedded_kyc( string $locale, string $source, array $ac throw new API_Exception( __( 'Failed to finalize onboarding session.', 'woocommerce-payments' ), 'wcpay-onboarding-finalize-error', 400 ); } - // Clear the onboarding in progress option, since the onboarding flow is now complete. + // Clear the embedded KYC in progress option, since the onboarding flow is now complete. $this->clear_embedded_kyc_in_progress(); return [ @@ -322,7 +333,7 @@ public function add_admin_body_classes( string $classes = '' ): string { } /** - * Get account data for onboarding from self assestment data. + * Get account data for onboarding from self assessment data. * * @param string $setup_mode Setup mode. * @param array $self_assessment_data Self assessment data. @@ -424,7 +435,7 @@ public function get_onboarding_user_data(): array { * @return bool True if embedded KYC is in progress, false otherwise. */ public function is_embedded_kyc_in_progress(): bool { - return in_array( get_option( WC_Payments_Account::EMBEDDED_KYC_IN_PROGRESS_OPTION, 'no' ), [ 'yes', '1' ], true ); + return filter_var( get_option( WC_Payments_Account::EMBEDDED_KYC_IN_PROGRESS_OPTION, 'no' ), FILTER_VALIDATE_BOOLEAN ); } /** diff --git a/tests/unit/admin/test-class-wc-rest-payments-onboarding-controller.php b/tests/unit/admin/test-class-wc-rest-payments-onboarding-controller.php index 07a00a2b690..0e0b125c4ff 100644 --- a/tests/unit/admin/test-class-wc-rest-payments-onboarding-controller.php +++ b/tests/unit/admin/test-class-wc-rest-payments-onboarding-controller.php @@ -158,10 +158,6 @@ public function test_get_embedded_kyc_session() { $kyc_session ); - $this->mock_onboarding_service - ->expects( $this->once() ) - ->method( 'set_embedded_kyc_in_progress' ); - $request = new WP_REST_Request( 'GET' ); $request->set_query_params( [ diff --git a/tests/unit/test-class-wc-payments-onboarding-service.php b/tests/unit/test-class-wc-payments-onboarding-service.php index a8d9686f763..d65bb02653d 100644 --- a/tests/unit/test-class-wc-payments-onboarding-service.php +++ b/tests/unit/test-class-wc-payments-onboarding-service.php @@ -8,6 +8,7 @@ use PHPUnit\Framework\MockObject\MockObject; use WCPay\Constants\Country_Code; use WCPay\Database_Cache; +use WCPay\Exceptions\API_Exception; /** * WC_Payments_Onboarding_Service unit tests. @@ -148,6 +149,121 @@ public function test_filters_registered_properly() { $this->assertNotFalse( has_filter( 'admin_body_class', [ $this->onboarding_service, 'add_admin_body_classes' ] ) ); } + public function test_create_embedded_kyc_session() { + // Arrange. + $this->mock_api_client + ->method( 'is_server_connected' ) + ->willReturn( true ); + + $expected_account_session = [ + 'client_secret' => 'secret', + 'expires_at' => time() + 3600, + 'account_id' => 'acc_123', + 'is_live' => true, + 'account_created' => true, + 'publishable_key' => 'pk_test_123', + 'woopay_enabled_by_default' => true, + ]; + + $this->mock_api_client + ->method( 'initialize_onboarding_embedded_kyc' ) + ->willReturn( $expected_account_session ); + + $this->onboarding_service->clear_embedded_kyc_in_progress(); + + delete_transient( WC_Payments_Account::WOOPAY_ENABLED_BY_DEFAULT_TRANSIENT ); + + // Act. + $result = $this->onboarding_service->create_embedded_kyc_session( [], false ); + + // Assert. + $this->assertEquals( $expected_account_session['client_secret'], $result['clientSecret'] ); + $this->assertEquals( $expected_account_session['expires_at'], $result['expiresAt'] ); + $this->assertEquals( $expected_account_session['account_id'], $result['accountId'] ); + $this->assertEquals( $expected_account_session['is_live'], $result['isLive'] ); + $this->assertEquals( $expected_account_session['account_created'], $result['accountCreated'] ); + $this->assertEquals( $expected_account_session['publishable_key'], $result['publishableKey'] ); + + $this->assertTrue( $this->onboarding_service->is_embedded_kyc_in_progress() ); + $this->assertTrue( get_transient( WC_Payments_Account::WOOPAY_ENABLED_BY_DEFAULT_TRANSIENT ) ); + } + + public function test_create_embedded_kyc_session_no_wpcom_connection() { + // Arrange. + $this->mock_api_client + ->method( 'is_server_connected' ) + ->willReturn( false ); + + // Act. + $result = $this->onboarding_service->create_embedded_kyc_session( [], false ); + + // Assert. + $this->assertEmpty( $result ); + } + + public function test_finalize_embedded_kyc() { + // Arrange. + $this->mock_api_client + ->method( 'is_server_connected' ) + ->willReturn( true ); + + $expected_result = [ + 'success' => true, + 'account_id' => 'acc_id', + 'details_submitted' => true, + 'mode' => 'test', + 'promotion_id' => 'promotion_id', + ]; + $this->mock_api_client + ->method( 'finalize_onboarding_embedded_kyc' ) + ->willReturn( $expected_result ); + + $this->onboarding_service->set_embedded_kyc_in_progress(); + + // Act. + $result = $this->onboarding_service->finalize_embedded_kyc( 'en_US', 'source', [] ); + + // Assert. + $this->assertEquals( $expected_result['success'], $result['success'] ); + $this->assertEquals( $expected_result['account_id'], $result['account_id'] ); + $this->assertEquals( $expected_result['details_submitted'], $result['details_submitted'] ); + $this->assertEquals( $expected_result['mode'], $result['mode'] ); + $this->assertEquals( $expected_result['promotion_id'], $result['promotion_id'] ); + + $this->assertFalse( $this->onboarding_service->is_embedded_kyc_in_progress() ); + } + + public function test_finalize_embedded_kyc_no_wpcom_connection() { + // Arrange. + $this->mock_api_client + ->method( 'is_server_connected' ) + ->willReturn( false ); + + // Act. + $result = $this->onboarding_service->finalize_embedded_kyc( 'en_US', 'source', [] ); + + // Assert. + $this->assertEquals( [ 'success' => false ], $result ); + } + + public function test_finalize_embedded_kyc_no_success() { + // Arrange. + $this->mock_api_client + ->method( 'is_server_connected' ) + ->willReturn( true ); + + $this->mock_api_client + ->method( 'finalize_onboarding_embedded_kyc' ) + ->willReturn( [ 'success' => false ] ); + + // Assert. + $this->expectException( API_Exception::class ); + $this->expectExceptionMessage( 'Failed to finalize onboarding session.' ); + + // Act. + $this->onboarding_service->finalize_embedded_kyc( 'en_US', 'source', [] ); + } + public function test_get_cached_business_types_with_no_server_connection() { $this->mock_api_client ->expects( $this->once() ) From 350e67f22a746dd6d0387a55494a6df7e8993ad6 Mon Sep 17 00:00:00 2001 From: Francesco Date: Tue, 15 Oct 2024 11:26:12 +0200 Subject: [PATCH 13/28] fix: add GH action SVN dependency (#9555) --- bin/run-ci-tests-check-coverage.bash | 5 +++++ bin/run-ci-tests.bash | 7 +++++++ changelog/fix-add-svn-script | 5 +++++ 3 files changed, 17 insertions(+) create mode 100644 changelog/fix-add-svn-script diff --git a/bin/run-ci-tests-check-coverage.bash b/bin/run-ci-tests-check-coverage.bash index c14ce1aa913..ce76fb789b7 100644 --- a/bin/run-ci-tests-check-coverage.bash +++ b/bin/run-ci-tests-check-coverage.bash @@ -17,6 +17,11 @@ else fi composer self-update && composer install --no-progress +# SVN is needed when installing WP. +if ! [ -x "$(command -v svn)" ]; then + echo 'Installing SVN...' + sudo apt-get install -y subversion +fi sudo systemctl start mysql.service bash bin/install-wp-tests.sh woocommerce_test root root localhost $WP_VERSION $WC_VERSION false echo 'Running the tests...' diff --git a/bin/run-ci-tests.bash b/bin/run-ci-tests.bash index 8102c8202ad..53fb0bb1522 100644 --- a/bin/run-ci-tests.bash +++ b/bin/run-ci-tests.bash @@ -10,6 +10,13 @@ WCPAY_DIR="$GITHUB_WORKSPACE" echo 'Updating composer version & Install dependencies...' composer self-update && composer install --no-progress +# SVN is needed when installing WP. +if ! [ -x "$(command -v svn)" ]; then + echo 'Installing SVN...' + sudo apt-get install -y subversion +fi + +# SVN is needed when installing WP. echo 'Starting MySQL service...' sudo systemctl start mysql.service diff --git a/changelog/fix-add-svn-script b/changelog/fix-add-svn-script new file mode 100644 index 00000000000..7da3bf73cf3 --- /dev/null +++ b/changelog/fix-add-svn-script @@ -0,0 +1,5 @@ +Significance: patch +Type: dev +Comment: fix: add GH action SVN dependency + + From cb04ee2f9ba4205d0410e7ec72dfd293f05c914e Mon Sep 17 00:00:00 2001 From: Daniel Guerra <15204776+danielmx-dev@users.noreply.github.com> Date: Tue, 15 Oct 2024 18:50:44 +0300 Subject: [PATCH 14/28] Ignore Playwright setup errors for newer runner images (#9557) --- .github/actions/e2e/env-setup/action.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/actions/e2e/env-setup/action.yml b/.github/actions/e2e/env-setup/action.yml index 8a1e99507b2..9b4e1e20f78 100644 --- a/.github/actions/e2e/env-setup/action.yml +++ b/.github/actions/e2e/env-setup/action.yml @@ -66,7 +66,7 @@ runs: shell: bash run : | echo "::group::Kill webserver running on port 8084" - sudo fuser -k -n tcp 8084 + sudo fuser -k -n tcp 8084 || true echo "::endgroup::" # Prepare test environment From 3a0ed1048e95e32284c75bedb0402e18afe4718e Mon Sep 17 00:00:00 2001 From: Daniel Guerra <15204776+danielmx-dev@users.noreply.github.com> Date: Tue, 15 Oct 2024 20:26:29 +0300 Subject: [PATCH 15/28] Add: Test Mode badge to Classic Checkout, Pay for Order, and Add Payment Method (#9495) Co-authored-by: Timur Karimov Co-authored-by: frosso --- .../add-test-mode-badge-classic-checkout | 4 ++ client/checkout/classic/style.scss | 51 ++++++++++++++++++- client/checkout/utils/test/upe.test.js | 2 +- client/checkout/utils/upe.js | 2 +- includes/class-wc-payment-gateway-wcpay.php | 20 ++++++++ 5 files changed, 76 insertions(+), 3 deletions(-) create mode 100644 changelog/add-test-mode-badge-classic-checkout diff --git a/changelog/add-test-mode-badge-classic-checkout b/changelog/add-test-mode-badge-classic-checkout new file mode 100644 index 00000000000..7bc0f1ad648 --- /dev/null +++ b/changelog/add-test-mode-badge-classic-checkout @@ -0,0 +1,4 @@ +Significance: minor +Type: add + +Add test mode badge to classic checkout and add payment method. diff --git a/client/checkout/classic/style.scss b/client/checkout/classic/style.scss index c25d285d212..aa8df8b1676 100644 --- a/client/checkout/classic/style.scss +++ b/client/checkout/classic/style.scss @@ -31,13 +31,62 @@ } #payment .payment_methods { - li label img { + li[class*='payment_method_woocommerce_payments'] > label > img { float: right; border: 0; padding: 0; height: 24px !important; max-height: 24px !important; } + + li.payment_method_woocommerce_payments { + display: grid; + grid-template-columns: 0fr 0fr 1fr; + grid-template-rows: max-content; + + > input[name='payment_method'] { + align-self: center; + } + > label { + grid-column: 3; + display: grid; + grid-template-columns: 0fr auto; + grid-template-rows: max-content; + grid-gap: 0; + margin-bottom: 0; + + > .label-title-container { + grid-area: 1 / 2 / 2 / 3; + } + + .payment-method-title { + margin-right: 8px; + } + + .test-mode.badge { + display: inline-block; + background-color: #fff2d7; + border-radius: 4px; + padding: 4px 6px; + font-size: 12px; + font-weight: 400; + line-height: 16px; + color: #4d3716; + vertical-align: middle; + } + + img { + float: none; + grid-area: 1 / 4 / 2 / 5; + align-self: baseline; + justify-self: end; + margin-left: 1em; + } + } + > div.payment_box { + grid-area: 2 / 1 / 3 / 4; + } + } } li.wc_payment_method:has( .input-radio:not( :checked ) diff --git a/client/checkout/utils/test/upe.test.js b/client/checkout/utils/test/upe.test.js index fb9f961d18f..3b868dc0d49 100644 --- a/client/checkout/utils/test/upe.test.js +++ b/client/checkout/utils/test/upe.test.js @@ -239,7 +239,7 @@ describe( 'UPE checkout utils', () => { togglePaymentMethodForCountry( upeElement ); - expect( upeElement.style.display ).toBe( 'block' ); + expect( upeElement.style.display ).toBe( '' ); } ); it( 'should hide payment method if country is not supported', () => { diff --git a/client/checkout/utils/upe.js b/client/checkout/utils/upe.js index c0ce9209cab..ba4dd5a11f5 100644 --- a/client/checkout/utils/upe.js +++ b/client/checkout/utils/upe.js @@ -345,7 +345,7 @@ export const togglePaymentMethodForCountry = ( upeElement ) => { '.payment_method_woocommerce_payments_' + paymentMethodType ); if ( supportedCountries.includes( billingCountry ) ) { - upeContainer.style.display = 'block'; + upeContainer.style.removeProperty( 'display' ); } else { upeContainer.style.display = 'none'; // if the toggled off payment method was selected, we need to fall back to credit card diff --git a/includes/class-wc-payment-gateway-wcpay.php b/includes/class-wc-payment-gateway-wcpay.php index 615ea55a284..136a8eaa4b6 100644 --- a/includes/class-wc-payment-gateway-wcpay.php +++ b/includes/class-wc-payment-gateway-wcpay.php @@ -572,6 +572,26 @@ public function init_hooks() { $this->maybe_init_subscriptions_hooks(); } + /** + * Returns the gateway title + * + * @return string + * */ + public function get_title() { + $title = parent::get_title(); + + if ( Payment_Method::CARD === $this->stripe_id && ( is_checkout() || is_add_payment_method_page() ) ) { + if ( WC_Payments::mode()->is_test() ) { + $test_mode_badge = '' . __( 'Test Mode', 'woocommerce-payments' ) . ''; + } else { + $test_mode_badge = ''; + } + return '
 ' . $title . '' . $test_mode_badge . '
'; + } + + return $title; + } + /** * Updates icon and title using the account country. * This method runs on init is not in the controller because get_account_country might From 043655c2ad10dca398b33d19cb63413dac29a78c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?C=C3=A9sar=20Costa?= <10233985+cesarcosta99@users.noreply.github.com> Date: Wed, 16 Oct 2024 14:46:17 -0300 Subject: [PATCH 16/28] Ensure Stripe is loaded correctly when checking payment method availability (#9523) --- changelog/fix-9518-apple-pay-button-on-blocks-checkout | 4 ++++ .../express-checkout/utils/checkPaymentMethodIsAvailable.js | 2 +- 2 files changed, 5 insertions(+), 1 deletion(-) create mode 100644 changelog/fix-9518-apple-pay-button-on-blocks-checkout diff --git a/changelog/fix-9518-apple-pay-button-on-blocks-checkout b/changelog/fix-9518-apple-pay-button-on-blocks-checkout new file mode 100644 index 00000000000..ec6970b90e3 --- /dev/null +++ b/changelog/fix-9518-apple-pay-button-on-blocks-checkout @@ -0,0 +1,4 @@ +Significance: patch +Type: fix + +Load Stripe with merchant account's key when checking payment method availability. diff --git a/client/express-checkout/utils/checkPaymentMethodIsAvailable.js b/client/express-checkout/utils/checkPaymentMethodIsAvailable.js index 0792974909b..29f809b731d 100644 --- a/client/express-checkout/utils/checkPaymentMethodIsAvailable.js +++ b/client/express-checkout/utils/checkPaymentMethodIsAvailable.js @@ -42,7 +42,7 @@ export const checkPaymentMethodIsAvailable = memoize( root.render( Date: Thu, 17 Oct 2024 11:37:24 +0200 Subject: [PATCH 17/28] Use official `phpmyadmin` Docker Hub container image (#9569) --- changelog/dev-use-official-docker-hub-phpmyadmin-image | 4 ++++ docker-compose.yml | 2 +- 2 files changed, 5 insertions(+), 1 deletion(-) create mode 100644 changelog/dev-use-official-docker-hub-phpmyadmin-image diff --git a/changelog/dev-use-official-docker-hub-phpmyadmin-image b/changelog/dev-use-official-docker-hub-phpmyadmin-image new file mode 100644 index 00000000000..240b76dd52b --- /dev/null +++ b/changelog/dev-use-official-docker-hub-phpmyadmin-image @@ -0,0 +1,4 @@ +Significance: patch +Type: dev + +Use official `phpmyadmin` Docker Hub container image diff --git a/docker-compose.yml b/docker-compose.yml index 8c35b58b439..00096003a25 100755 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -42,7 +42,7 @@ services: - ./docker/data:/var/lib/mysql phpMyAdmin: container_name: woocommerce_payments_phpmyadmin - image: phpmyadmin/phpmyadmin:latest + image: phpmyadmin:latest ports: - "8083:80" env_file: From 1a2152293765ac04a62b96c94b147d9b005905b0 Mon Sep 17 00:00:00 2001 From: Zvonimir Maglica Date: Thu, 17 Oct 2024 14:46:09 +0200 Subject: [PATCH 18/28] Prevent payment method deletion in local environment when using Stripe production account (#9566) --- ...-on-prod-when-user-is-deleted-on-localhost | 4 +++ includes/class-wc-payments-token-service.php | 34 ++++++++++++++----- 2 files changed, 29 insertions(+), 9 deletions(-) create mode 100644 changelog/fix-5384-prevent-pm-detach-on-prod-when-user-is-deleted-on-localhost diff --git a/changelog/fix-5384-prevent-pm-detach-on-prod-when-user-is-deleted-on-localhost b/changelog/fix-5384-prevent-pm-detach-on-prod-when-user-is-deleted-on-localhost new file mode 100644 index 00000000000..a39adc06bb1 --- /dev/null +++ b/changelog/fix-5384-prevent-pm-detach-on-prod-when-user-is-deleted-on-localhost @@ -0,0 +1,4 @@ +Significance: patch +Type: fix + +Prevented detaching payment methods from live Stripe accounts when working in non-production environments. diff --git a/includes/class-wc-payments-token-service.php b/includes/class-wc-payments-token-service.php index 0eb810bce75..166ef6c9685 100644 --- a/includes/class-wc-payments-token-service.php +++ b/includes/class-wc-payments-token-service.php @@ -280,18 +280,34 @@ private function is_payment_method_enabled( $payment_method ) { * Delete token from Stripe. * * @param string $token_id Token ID. - * @param WC_Payment_Token $token Token object. + * @param WC_Payment_Token $token Token object. + * + * @throws Exception */ public function woocommerce_payment_token_deleted( $token_id, $token ) { - if ( in_array( $token->get_gateway_id(), self::REUSABLE_GATEWAYS_BY_PAYMENT_METHOD, true ) ) { - try { - $this->payments_api_client->detach_payment_method( $token->get_token() ); - // Clear cached payment methods. - $this->customer_service->clear_cached_payment_methods_for_user( $token->get_user_id() ); - } catch ( Exception $e ) { - Logger::log( 'Error detaching payment method:' . $e->getMessage() ); - } + // If it's not reusable payment method, we don't need to perform any additional checks. + if ( ! in_array( $token->get_gateway_id(), self::REUSABLE_GATEWAYS_BY_PAYMENT_METHOD, true ) ) { + return; + } + // First check if it's live mode. + // Second check if it's admin. + // Third check if it's not production environment. + // When all conditions are met, we don't want to delete the payment method from Stripe. + // This is to avoid detaching the payment method from the live stripe account on non production environments. + if ( + WC_Payments::mode()->is_live() && + is_admin() && + 'production' !== wp_get_environment_type() + ) { + return; + } + try { + $this->payments_api_client->detach_payment_method( $token->get_token() ); + // Clear cached payment methods. + $this->customer_service->clear_cached_payment_methods_for_user( $token->get_user_id() ); + } catch ( Exception $e ) { + Logger::log( 'Error detaching payment method:' . $e->getMessage() ); } } From b6fc858d6558c3b96bdc60e70da2785c50648d3a Mon Sep 17 00:00:00 2001 From: Daniel Guerra <15204776+danielmx-dev@users.noreply.github.com> Date: Thu, 17 Oct 2024 18:00:27 +0300 Subject: [PATCH 19/28] Fix E2E tests by disabling AppArmor restrictions (#9568) Co-authored-by: Achyuth Ajoy --- .github/actions/e2e/env-setup/action.yml | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/.github/actions/e2e/env-setup/action.yml b/.github/actions/e2e/env-setup/action.yml index 9b4e1e20f78..e1dbd310239 100644 --- a/.github/actions/e2e/env-setup/action.yml +++ b/.github/actions/e2e/env-setup/action.yml @@ -76,3 +76,11 @@ runs: echo "::group::Setup E2E test environment" npm run test:e2e-setup echo "::endgroup::" + + # Disable restrictions that prevent chromium from running properly. See: https://chromium.googlesource.com/chromium/src/+/main/docs/security/apparmor-userns-restrictions.md + - name: Disable AppArmor User Namespace Restrictions + shell: bash + run: | + echo "::group::Disable AppArmor User Namespace Restrictions" + sudo sysctl --ignore --write kernel.apparmor_restrict_unprivileged_userns=0 + echo "::endgroup::" From b4599f0ae81f8d28f87d7d030f2ee3ecb54385dc Mon Sep 17 00:00:00 2001 From: Malith Senaweera <6216000+malithsen@users.noreply.github.com> Date: Thu, 17 Oct 2024 12:29:24 -0500 Subject: [PATCH 20/28] Collect border styles from the primary container element (#9508) --- changelog/fix-woopay-theming-border-styles | 4 ++++ client/checkout/api/test/index.test.js | 1 + client/checkout/upe-styles/index.js | 11 +++++++++++ client/checkout/upe-styles/test/index.js | 3 +++ client/checkout/upe-styles/upe-styles.js | 2 ++ .../test/woopay-express-checkout-button.test.js | 1 + 6 files changed, 22 insertions(+) create mode 100644 changelog/fix-woopay-theming-border-styles diff --git a/changelog/fix-woopay-theming-border-styles b/changelog/fix-woopay-theming-border-styles new file mode 100644 index 00000000000..c3b92530afe --- /dev/null +++ b/changelog/fix-woopay-theming-border-styles @@ -0,0 +1,4 @@ +Significance: patch +Type: fix + +Pass container styling data to WooPay diff --git a/client/checkout/api/test/index.test.js b/client/checkout/api/test/index.test.js index 7fe7e8c3f70..06fbf00765b 100644 --- a/client/checkout/api/test/index.test.js +++ b/client/checkout/api/test/index.test.js @@ -42,6 +42,7 @@ const mockAppearance = { '.Heading': {}, '.Button': {}, '.Link': {}, + '.Container': {}, }, theme: 'stripe', variables: { diff --git a/client/checkout/upe-styles/index.js b/client/checkout/upe-styles/index.js index de2c41e93aa..cc6a64deebb 100644 --- a/client/checkout/upe-styles/index.js +++ b/client/checkout/upe-styles/index.js @@ -65,6 +65,9 @@ export const appearanceSelectors = { headingSelectors: [ 'h1', 'h2', 'h3', 'h4', 'h5', 'h6' ], buttonSelectors: [ '.wc-block-components-checkout-place-order-button' ], linkSelectors: [ 'a' ], + containerSelectors: [ + '.wp-block-woocommerce-checkout-order-summary-block', + ], }, bnplProductPage: { appendTarget: '.product .cart .quantity', @@ -101,6 +104,7 @@ export const appearanceSelectors = { headingSelectors: [ 'h1', 'h2', 'h3', 'h4', 'h5', 'h6' ], buttonSelectors: [ '.checkout-button' ], linkSelectors: [ 'a' ], + containerSelectors: [ '.shop_table' ], }, bnplCartBlock: { appendTarget: '.wc-block-cart .wc-block-components-quantity-selector', @@ -123,6 +127,7 @@ export const appearanceSelectors = { headingSelectors: [ 'h1', 'h2', 'h3', 'h4', 'h5', 'h6' ], buttonSelectors: [ '.wc-block-cart__submit-button' ], linkSelectors: [ 'a' ], + containerSelectors: [ '.wp-block-woocommerce-cart-line-items-block' ], }, wooPayClassicCheckout: { appendTarget: '.woocommerce-billing-fields__field-wrapper', @@ -144,6 +149,7 @@ export const appearanceSelectors = { headingSelectors: [ 'h1', 'h2', 'h3', 'h4', 'h5', 'h6' ], buttonSelectors: [ '#place_order' ], linkSelectors: [ 'a' ], + containerSelectors: [ '.woocommerce-checkout-review-order-table' ], }, /** @@ -493,6 +499,10 @@ export const getAppearance = ( elementsLocation, forWooPay = false ) => { ); const buttonRules = getFieldStyles( selectors.buttonSelectors, '.Input' ); const linkRules = getFieldStyles( selectors.linkSelectors, '.Label' ); + const containerRules = getFieldStyles( + selectors.containerSelectors, + '.Container' + ); const globalRules = { colorBackground: backgroundColor, colorText: labelRules.color, @@ -540,6 +550,7 @@ export const getAppearance = ( elementsLocation, forWooPay = false ) => { '.Heading': headingRules, '.Button': buttonRules, '.Link': linkRules, + '.Container': containerRules, }; } diff --git a/client/checkout/upe-styles/test/index.js b/client/checkout/upe-styles/test/index.js index bc79053555a..96a602a4bbd 100644 --- a/client/checkout/upe-styles/test/index.js +++ b/client/checkout/upe-styles/test/index.js @@ -222,6 +222,9 @@ describe( 'Getting styles for automated theming', () => { fontSize: '12px', padding: '10px', }, + '.Container': { + backgroundColor: 'rgba(0, 0, 0, 0)', + }, }, labels: 'above', } ); diff --git a/client/checkout/upe-styles/upe-styles.js b/client/checkout/upe-styles/upe-styles.js index ffc27cee0d2..fda1c987f09 100644 --- a/client/checkout/upe-styles/upe-styles.js +++ b/client/checkout/upe-styles/upe-styles.js @@ -76,6 +76,7 @@ const upeSupportedProperties = { ...paddingColorProps.slice( 1 ), // Remove color ...borderOutlineBackgroundProps.slice( 1 ), // Remove backgroundColor ], + '.Container': [ ...borderOutlineBackgroundProps ], }; // Restricted properties allowed to generate the automated theming of UPE. @@ -110,4 +111,5 @@ export const upeRestrictedProperties = { '.TabIcon--selected': [ ...restrictedTabIconSelectedProperties ], '.TabLabel': upeSupportedProperties[ '.TabLabel' ], '.Block': upeSupportedProperties[ '.Block' ], + '.Container': upeSupportedProperties[ '.Container' ], }; diff --git a/client/checkout/woopay/express-button/test/woopay-express-checkout-button.test.js b/client/checkout/woopay/express-button/test/woopay-express-checkout-button.test.js index 90b35164fe8..47bf07d77fe 100644 --- a/client/checkout/woopay/express-button/test/woopay-express-checkout-button.test.js +++ b/client/checkout/woopay/express-button/test/woopay-express-checkout-button.test.js @@ -89,6 +89,7 @@ describe( 'WoopayExpressCheckoutButton', () => { '.Text--redirect': {}, '.Heading': {}, '.Button': {}, + '.Container': {}, '.Link': {}, }, theme: 'stripe', From 685471e6a9abfb25dc11c47c5f632a5e0eb8ad6f Mon Sep 17 00:00:00 2001 From: Eric Jinks <3147296+Jinksi@users.noreply.github.com> Date: Fri, 18 Oct 2024 07:27:13 +1000 Subject: [PATCH 21/28] Update Playwright README with correct instructions for updating snapshots (#9563) --- .../fix-9562-readme-correction-playwright-update-snapshots | 5 +++++ tests/e2e-pw/README.md | 2 +- 2 files changed, 6 insertions(+), 1 deletion(-) create mode 100644 changelog/fix-9562-readme-correction-playwright-update-snapshots diff --git a/changelog/fix-9562-readme-correction-playwright-update-snapshots b/changelog/fix-9562-readme-correction-playwright-update-snapshots new file mode 100644 index 00000000000..846b832a05f --- /dev/null +++ b/changelog/fix-9562-readme-correction-playwright-update-snapshots @@ -0,0 +1,5 @@ +Significance: patch +Type: dev +Comment: Update Playwright README with correct instructions for updating snapshots – not user-facing. + + diff --git a/tests/e2e-pw/README.md b/tests/e2e-pw/README.md index f18388e3f31..c91f61a345d 100644 --- a/tests/e2e-pw/README.md +++ b/tests/e2e-pw/README.md @@ -17,7 +17,7 @@ See [tests/e2e/README.md](/tests/e2e/README.md) for detailed e2e environment set - `npm run test:e2e-pw` headless run from within a linux docker container. - `npm run test:e2e-pw-ui` runs tests in interactive UI mode from within a linux docker container – recommended for authoring tests and re-running failed tests. - `npm run test:e2e-pw keyword` runs tests only with a specific keyword in the file name, e.g. `dispute` or `checkout`. -- `npm run test:e2e-pw --update-snapshots` updates snapshots. +- `npm run test:e2e-pw -- --update-snapshots` updates snapshots. This can be combined with a keyword to update a specific set of snapshots, e.g. `npm run test:e2e-pw -- --update-snapshots deposits`. ## FAQs From 3326a6d75bf830bf7dede0427ae51c4ca1ec64e9 Mon Sep 17 00:00:00 2001 From: Eric Jinks <3147296+Jinksi@users.noreply.github.com> Date: Fri, 18 Oct 2024 09:16:50 +1000 Subject: [PATCH 22/28] Darken the color of links within click tooltips to improve color contrast and readability (#9571) --- changelog/fix-9559-tooltip-link-color-contrast | 4 ++++ client/components/tooltip/style.scss | 11 +++++++++-- 2 files changed, 13 insertions(+), 2 deletions(-) create mode 100644 changelog/fix-9559-tooltip-link-color-contrast diff --git a/changelog/fix-9559-tooltip-link-color-contrast b/changelog/fix-9559-tooltip-link-color-contrast new file mode 100644 index 00000000000..64e3986e2e8 --- /dev/null +++ b/changelog/fix-9559-tooltip-link-color-contrast @@ -0,0 +1,4 @@ +Significance: patch +Type: fix + +Fix the color contrast of links within tooltips to improve readability. diff --git a/client/components/tooltip/style.scss b/client/components/tooltip/style.scss index 51422218e10..cec46e023bb 100644 --- a/client/components/tooltip/style.scss +++ b/client/components/tooltip/style.scss @@ -50,11 +50,13 @@ &__tooltip { position: relative; + // Default tooltip styles have a dark background and light text. color: $white; background-color: $gray-900; padding: 10px; text-align: center; + // Links inside default tooltips should have a light color against the dark background. a { color: var( --wp-admin-theme-color-background-25, $wp-blue-5 ); text-decoration: underline; @@ -72,16 +74,21 @@ } &__tooltip { - // Specific styles for the click tooltip variant. + // Click tooltips have a light background and dark text. position: relative; padding: 12px; color: $gray-900; text-align: left; border-radius: 2px; border: 1px solid $gray-400; - background: $white; + background-color: $white; box-shadow: 0 2px 6px 0 rgba( 0, 0, 0, 0.05 ); + // Links inside click tooltips should have a dark color against the light background. + a { + color: var( --wp-admin-theme-color, $gutenberg-blue ); + } + &::after { // Remove the arrow from the click tooltip variant. display: none; From a35b00c1c9b066d3211e61afd9fda9d13ac0d0c4 Mon Sep 17 00:00:00 2001 From: Francesco Date: Fri, 18 Oct 2024 10:10:52 +0200 Subject: [PATCH 23/28] chore: remove methods deprecated in 5.6.0 (#9567) --- ...ore-remove-woopayments-dev-test-mode-calls | 4 +++ includes/class-wc-payment-gateway-wcpay.php | 28 --------------- .../test-class-wc-payment-gateway-wcpay.php | 35 ------------------- 3 files changed, 4 insertions(+), 63 deletions(-) create mode 100644 changelog/chore-remove-woopayments-dev-test-mode-calls diff --git a/changelog/chore-remove-woopayments-dev-test-mode-calls b/changelog/chore-remove-woopayments-dev-test-mode-calls new file mode 100644 index 00000000000..0215265352c --- /dev/null +++ b/changelog/chore-remove-woopayments-dev-test-mode-calls @@ -0,0 +1,4 @@ +Significance: minor +Type: update + +chore: remove deprecated is_in_dev_mode() and is_in_test_mode() methods diff --git a/includes/class-wc-payment-gateway-wcpay.php b/includes/class-wc-payment-gateway-wcpay.php index 136a8eaa4b6..f795a7514b7 100644 --- a/includes/class-wc-payment-gateway-wcpay.php +++ b/includes/class-wc-payment-gateway-wcpay.php @@ -4507,34 +4507,6 @@ public function find_duplicates() { return $this->duplicate_payment_methods_detection_service->find_duplicates(); } - // Start: Deprecated functions. - - /** - * Check the defined constant to determine the current plugin mode. - * - * @deprecated 5.6.0 - * - * @return bool - */ - public function is_in_dev_mode() { - wc_deprecated_function( __FUNCTION__, '5.6.0', 'WC_Payments::mode()->is_dev()' ); - return WC_Payments::mode()->is_dev(); - } - - /** - * Returns whether test_mode or dev_mode is active for the gateway - * - * @deprecated 5.6.0 - * - * @return boolean Test mode enabled if true, disabled if false - */ - public function is_in_test_mode() { - wc_deprecated_function( __FUNCTION__, '5.6.0', 'WC_Payments::mode()->is_test()' ); - return WC_Payments::mode()->is_test(); - } - - // End: Deprecated functions. - /** * Determine whether redirection is needed for the non-card UPE payment method. * diff --git a/tests/unit/test-class-wc-payment-gateway-wcpay.php b/tests/unit/test-class-wc-payment-gateway-wcpay.php index b97fad22eea..b638c07e6dd 100644 --- a/tests/unit/test-class-wc-payment-gateway-wcpay.php +++ b/tests/unit/test-class-wc-payment-gateway-wcpay.php @@ -3444,41 +3444,6 @@ public function is_woopay_falsy_value_provider() { ]; } - /** - * @expectedDeprecated is_in_dev_mode - */ - public function test_is_in_dev_mode() { - $mode = WC_Payments::mode(); - - $mode->dev(); - $this->assertTrue( $this->card_gateway->is_in_dev_mode() ); - - $mode->live_mode_onboarding(); - $this->assertFalse( $this->card_gateway->is_in_dev_mode() ); - - $mode->live(); - $this->assertFalse( $this->card_gateway->is_in_dev_mode() ); - } - - /** - * @expectedDeprecated is_in_test_mode - */ - public function test_is_in_test_mode() { - $mode = WC_Payments::mode(); - - $mode->dev(); - $this->assertTrue( $this->card_gateway->is_in_test_mode() ); - - $mode->test_mode_onboarding(); - $this->assertTrue( $this->card_gateway->is_in_test_mode() ); - - $mode->test(); - $this->assertTrue( $this->card_gateway->is_in_test_mode() ); - - $mode->live(); - $this->assertFalse( $this->card_gateway->is_in_test_mode() ); - } - /** * Create a partial mock for WC_Payment_Gateway_WCPay class. * From 23ba546de1cfbc3d712d825199b47fd14936f976 Mon Sep 17 00:00:00 2001 From: Malith Senaweera <6216000+malithsen@users.noreply.github.com> Date: Fri, 18 Oct 2024 09:03:00 -0500 Subject: [PATCH 24/28] Fix WooPay user registration in classic checkout (#9558) Co-authored-by: Danae Millan --- ...woopay-user-creation-in-shortcode-checkout | 4 ++++ includes/woopay/class-woopay-utilities.php | 22 ++++++++++++++----- .../woopay/test-class-woopay-utilities.php | 14 ++++++++++++ 3 files changed, 35 insertions(+), 5 deletions(-) create mode 100644 changelog/fix-woopay-user-creation-in-shortcode-checkout diff --git a/changelog/fix-woopay-user-creation-in-shortcode-checkout b/changelog/fix-woopay-user-creation-in-shortcode-checkout new file mode 100644 index 00000000000..4c501ea1add --- /dev/null +++ b/changelog/fix-woopay-user-creation-in-shortcode-checkout @@ -0,0 +1,4 @@ +Significance: patch +Type: fix + +WooPay user registration via classic checkout diff --git a/includes/woopay/class-woopay-utilities.php b/includes/woopay/class-woopay-utilities.php index fdd03791d0d..73083341975 100644 --- a/includes/woopay/class-woopay-utilities.php +++ b/includes/woopay/class-woopay-utilities.php @@ -125,7 +125,10 @@ public function should_save_platform_customer() { $session_data = WC()->session->get( WooPay_Session::WOOPAY_SESSION_KEY ); } - return isset( $session_data['save_user_in_woopay'] ) && filter_var( $session_data['save_user_in_woopay'], FILTER_VALIDATE_BOOLEAN ); + $save_user_in_woopay_post = isset( $_POST['save_user_in_woopay'] ) && filter_var( wp_unslash( $_POST['save_user_in_woopay'] ), FILTER_VALIDATE_BOOLEAN ); // phpcs:ignore WordPress.Security.NonceVerification + $save_user_in_woopay_session = isset( $session_data['save_user_in_woopay'] ) && filter_var( $session_data['save_user_in_woopay'], FILTER_VALIDATE_BOOLEAN ); + + return $save_user_in_woopay_post || $save_user_in_woopay_session; } /** @@ -170,7 +173,9 @@ public static function is_store_country_available() { public function get_woopay_phone() { $session_data = WC()->session->get( WooPay_Session::WOOPAY_SESSION_KEY ); - if ( ! empty( $session_data['woopay_user_phone_field']['full'] ) ) { + if ( ! empty( $_POST['woopay_user_phone_field']['full'] ) ) { // phpcs:ignore WordPress.Security.NonceVerification + return wc_clean( wp_unslash( $_POST['woopay_user_phone_field']['full'] ) ); // phpcs:ignore WordPress.Security.NonceVerification + } elseif ( ! empty( $session_data['woopay_user_phone_field']['full'] ) ) { return $session_data['woopay_user_phone_field']['full']; } @@ -185,7 +190,9 @@ public function get_woopay_phone() { public function get_woopay_source_url() { $session_data = WC()->session->get( WooPay_Session::WOOPAY_SESSION_KEY ); - if ( ! empty( $session_data['woopay_source_url'] ) ) { + if ( ! empty( $_POST['woopay_source_url'] ) ) { // phpcs:ignore WordPress.Security.NonceVerification + return wc_clean( wp_unslash( $_POST['woopay_source_url'] ) ); // phpcs:ignore WordPress.Security.NonceVerification + } elseif ( ! empty( $session_data['woopay_source_url'] ) ) { return $session_data['woopay_source_url']; } @@ -200,7 +207,10 @@ public function get_woopay_source_url() { public function get_woopay_is_blocks() { $session_data = WC()->session->get( WooPay_Session::WOOPAY_SESSION_KEY ); - return isset( $session_data['woopay_is_blocks'] ) && filter_var( $session_data['woopay_is_blocks'], FILTER_VALIDATE_BOOLEAN ); + $woopay_is_blocks_post = isset( $_POST['woopay_is_blocks'] ) && filter_var( wp_unslash( $_POST['woopay_is_blocks'] ), FILTER_VALIDATE_BOOLEAN ); // phpcs:ignore WordPress.Security.NonceVerification + $woopay_is_blocks_session = isset( $session_data['woopay_is_blocks'] ) && filter_var( $session_data['woopay_is_blocks'], FILTER_VALIDATE_BOOLEAN ); + + return $woopay_is_blocks_post || $woopay_is_blocks_session; } /** @@ -211,7 +221,9 @@ public function get_woopay_is_blocks() { public function get_woopay_viewport() { $session_data = WC()->session->get( WooPay_Session::WOOPAY_SESSION_KEY ); - if ( ! empty( $session_data['woopay_viewport'] ) ) { + if ( ! empty( $_POST['woopay_viewport'] ) ) { // phpcs:ignore WordPress.Security.NonceVerification + return wc_clean( wp_unslash( $_POST['woopay_viewport'] ) ); // phpcs:ignore WordPress.Security.NonceVerification + } elseif ( ! empty( $session_data['woopay_viewport'] ) ) { return $session_data['woopay_viewport']; } diff --git a/tests/unit/woopay/test-class-woopay-utilities.php b/tests/unit/woopay/test-class-woopay-utilities.php index df8a0533f26..eec8443fcf4 100644 --- a/tests/unit/woopay/test-class-woopay-utilities.php +++ b/tests/unit/woopay/test-class-woopay-utilities.php @@ -6,6 +6,7 @@ */ use WCPay\WooPay\WooPay_Utilities; +use WCPay\WooPay\WooPay_Session; /** * WooPay_Utilities unit tests. @@ -177,6 +178,19 @@ public function test_should_enable_woopay_on_cart_or_checkout_logged_out_guest_c $this->clean_up_should_enable_woopay_tests(); } + /** + * WooPay user is saved to platform on classic checkout. + * + * @return void + */ + public function test_should_save_platform_customer_in_classic_checkout() { + $woopay_utilities = new WooPay_Utilities(); + + $_POST['save_user_in_woopay'] = 'true'; + $this->assertTrue( $woopay_utilities->should_save_platform_customer() ); + unset( $_POST['save_user_in_woopay'] ); + } + private function clean_up_should_enable_woopay_tests() { remove_filter( 'woocommerce_is_checkout', '__return_true' ); wp_set_current_user( 0 ); From 7f8cad70de8488f5bdac3599d21697b50b1e2416 Mon Sep 17 00:00:00 2001 From: Daniel Guerra <15204776+danielmx-dev@users.noreply.github.com> Date: Fri, 18 Oct 2024 23:59:15 +0300 Subject: [PATCH 25/28] Use tax inclusive amounts in PMME calculations to match displayed prices (#9583) --- .../fix-9553-use-tax-inclusive-prices-pmme | 4 +++ ...ments-payment-method-messaging-element.php | 29 +++++++++++++++++-- 2 files changed, 31 insertions(+), 2 deletions(-) create mode 100644 changelog/fix-9553-use-tax-inclusive-prices-pmme diff --git a/changelog/fix-9553-use-tax-inclusive-prices-pmme b/changelog/fix-9553-use-tax-inclusive-prices-pmme new file mode 100644 index 00000000000..9c76e73ddfa --- /dev/null +++ b/changelog/fix-9553-use-tax-inclusive-prices-pmme @@ -0,0 +1,4 @@ +Significance: minor +Type: fix + +The amounts used by the PMMEs will match the displayed price of the product regardless of the tax settings. diff --git a/includes/class-wc-payments-payment-method-messaging-element.php b/includes/class-wc-payments-payment-method-messaging-element.php index 6270b99e912..aeffbc78c61 100644 --- a/includes/class-wc-payments-payment-method-messaging-element.php +++ b/includes/class-wc-payments-payment-method-messaging-element.php @@ -60,17 +60,42 @@ public function init() { $product_variations = []; if ( $product ) { + $get_price_fn = function ( $product ) { + return $product->get_price(); + }; + if ( wc_tax_enabled() && $product->is_taxable() ) { + if ( + wc_prices_include_tax() && + ( + get_option( 'woocommerce_tax_display_shop' ) !== 'incl' || + WC()->customer->get_is_vat_exempt() + ) + ) { + $get_price_fn = function ( $product ) { + return wc_get_price_excluding_tax( $product ); + }; + } elseif ( + get_option( 'woocommerce_tax_display_shop' ) === 'incl' + && ! WC()->customer->get_is_vat_exempt() + ) { + $get_price_fn = function ( $product ) { + return wc_get_price_including_tax( $product ); + }; + } + } + $price = $get_price_fn( $product ); $product_variations = [ 'base_product' => [ - 'amount' => WC_Payments_Utils::prepare_amount( $product->get_price(), $currency_code ), + 'amount' => WC_Payments_Utils::prepare_amount( $price, $currency_code ), 'currency' => $currency_code, ], ]; foreach ( $product->get_children() as $variation_id ) { $variation = wc_get_product( $variation_id ); if ( $variation ) { + $price = $get_price_fn( $variation ); $product_variations[ $variation_id ] = [ - 'amount' => WC_Payments_Utils::prepare_amount( $variation->get_price(), $currency_code ), + 'amount' => WC_Payments_Utils::prepare_amount( $price, $currency_code ), 'currency' => $currency_code, ]; } From 70b696f825831746bec0550da2dbb3212e093ac1 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Sun, 20 Oct 2024 12:10:01 +0000 Subject: [PATCH 26/28] Update version and add changelog entries for release 8.4.0 --- changelog.txt | 20 +++++++++++++++++ changelog/add-stripe-floating-labels | 4 ---- changelog/add-support-for-woo-button-controls | 4 ---- .../add-test-mode-badge-classic-checkout | 4 ---- changelog/as-fix-unnecessary-css-import | 4 ---- ...ore-remove-woopayments-dev-test-mode-calls | 4 ---- changelog/dev-bump-wc-tested-up-to-version | 4 ---- ...v-use-official-docker-hub-phpmyadmin-image | 4 ---- ...-on-prod-when-user-is-deleted-on-localhost | 4 ---- .../fix-9142-classname-optional-default-null | 4 ---- ...x-9518-apple-pay-button-on-blocks-checkout | 4 ---- changelog/fix-9548-woopay-auto-enable | 4 ---- .../fix-9553-use-tax-inclusive-prices-pmme | 4 ---- .../fix-9559-tooltip-link-color-contrast | 4 ---- ...dme-correction-playwright-update-snapshots | 5 ----- changelog/fix-add-svn-script | 5 ----- changelog/fix-convert-rgba-text-color | 4 ---- .../fix-e2e-save-settings-button-disabled | 5 ----- ...multiple-instances-of-wc-payments-in-tests | 4 ---- changelog/fix-test-mode-badge-credit-card | 4 ---- changelog/fix-woopay-theming-border-styles | 4 ---- ...woopay-user-creation-in-shortcode-checkout | 4 ---- changelog/fix-wrong-utils-path | 4 ---- .../update-9540-payment-task-onboarding-flow | 4 ---- package-lock.json | 4 ++-- package.json | 2 +- readme.txt | 22 ++++++++++++++++++- woocommerce-payments.php | 2 +- 28 files changed, 45 insertions(+), 100 deletions(-) delete mode 100644 changelog/add-stripe-floating-labels delete mode 100644 changelog/add-support-for-woo-button-controls delete mode 100644 changelog/add-test-mode-badge-classic-checkout delete mode 100644 changelog/as-fix-unnecessary-css-import delete mode 100644 changelog/chore-remove-woopayments-dev-test-mode-calls delete mode 100644 changelog/dev-bump-wc-tested-up-to-version delete mode 100644 changelog/dev-use-official-docker-hub-phpmyadmin-image delete mode 100644 changelog/fix-5384-prevent-pm-detach-on-prod-when-user-is-deleted-on-localhost delete mode 100644 changelog/fix-9142-classname-optional-default-null delete mode 100644 changelog/fix-9518-apple-pay-button-on-blocks-checkout delete mode 100644 changelog/fix-9548-woopay-auto-enable delete mode 100644 changelog/fix-9553-use-tax-inclusive-prices-pmme delete mode 100644 changelog/fix-9559-tooltip-link-color-contrast delete mode 100644 changelog/fix-9562-readme-correction-playwright-update-snapshots delete mode 100644 changelog/fix-add-svn-script delete mode 100644 changelog/fix-convert-rgba-text-color delete mode 100644 changelog/fix-e2e-save-settings-button-disabled delete mode 100644 changelog/fix-multiple-instances-of-wc-payments-in-tests delete mode 100644 changelog/fix-test-mode-badge-credit-card delete mode 100644 changelog/fix-woopay-theming-border-styles delete mode 100644 changelog/fix-woopay-user-creation-in-shortcode-checkout delete mode 100644 changelog/fix-wrong-utils-path delete mode 100644 changelog/update-9540-payment-task-onboarding-flow diff --git a/changelog.txt b/changelog.txt index 5ac9ccad3d1..2bc166dbb97 100644 --- a/changelog.txt +++ b/changelog.txt @@ -1,5 +1,25 @@ *** WooPayments Changelog *** += 8.4.0 - 2024-10-23 = +* Add - Add test mode badge to classic checkout and add payment method. +* Add - Using Floating Labels with Stripe Appearance API for Blocks Checkout +* Fix - Converting text color rgba to hex to prevent Stripe warning +* Fix - Fix the color contrast of links within tooltips to improve readability. +* Fix - Pass container styling data to WooPay +* Fix - Prevented detaching payment methods from live Stripe accounts when working in non-production environments. +* Fix - Rendering Test Model badge only for Credit Card +* Fix - Stop enqueuing woopay-express-button.css to prevent 404 errors +* Fix - The amounts used by the PMMEs will match the displayed price of the product regardless of the tax settings. +* Fix - WooPay user registration via classic checkout +* Update - Add support for the style controls for the WooPay button +* Update - chore: remove deprecated is_in_dev_mode() and is_in_test_mode() methods +* Update - Payments task onboarding flows skip the Connect page. +* Dev - Bump WC tested up to version to 9.3.3. +* Dev - fix: prevent multiple instances of WC_Payments_Apple_Pay_Registration +* Dev - Fixed wrong utils path that would prevent checkout with WooPay OTP +* Dev - Migrate WizardTaskItem and CollapsibleBody components to TypeScript, making the className prop optional. +* Dev - Use official `phpmyadmin` Docker Hub container image + = 8.3.1 - 2024-10-16 = * Fix - Auto-enabled WooPay for new accounts. * Fix - Load Stripe with merchant account's key when checking payment method availability. diff --git a/changelog/add-stripe-floating-labels b/changelog/add-stripe-floating-labels deleted file mode 100644 index c82d0361748..00000000000 --- a/changelog/add-stripe-floating-labels +++ /dev/null @@ -1,4 +0,0 @@ -Significance: minor -Type: add - -Using Floating Labels with Stripe Appearance API for Blocks Checkout diff --git a/changelog/add-support-for-woo-button-controls b/changelog/add-support-for-woo-button-controls deleted file mode 100644 index 4e46b384b5d..00000000000 --- a/changelog/add-support-for-woo-button-controls +++ /dev/null @@ -1,4 +0,0 @@ -Significance: minor -Type: update - -Add support for the style controls for the WooPay button diff --git a/changelog/add-test-mode-badge-classic-checkout b/changelog/add-test-mode-badge-classic-checkout deleted file mode 100644 index 7bc0f1ad648..00000000000 --- a/changelog/add-test-mode-badge-classic-checkout +++ /dev/null @@ -1,4 +0,0 @@ -Significance: minor -Type: add - -Add test mode badge to classic checkout and add payment method. diff --git a/changelog/as-fix-unnecessary-css-import b/changelog/as-fix-unnecessary-css-import deleted file mode 100644 index e6fdf701c72..00000000000 --- a/changelog/as-fix-unnecessary-css-import +++ /dev/null @@ -1,4 +0,0 @@ -Significance: minor -Type: fix - -Stop enqueuing woopay-express-button.css to prevent 404 errors diff --git a/changelog/chore-remove-woopayments-dev-test-mode-calls b/changelog/chore-remove-woopayments-dev-test-mode-calls deleted file mode 100644 index 0215265352c..00000000000 --- a/changelog/chore-remove-woopayments-dev-test-mode-calls +++ /dev/null @@ -1,4 +0,0 @@ -Significance: minor -Type: update - -chore: remove deprecated is_in_dev_mode() and is_in_test_mode() methods diff --git a/changelog/dev-bump-wc-tested-up-to-version b/changelog/dev-bump-wc-tested-up-to-version deleted file mode 100644 index fc508162aec..00000000000 --- a/changelog/dev-bump-wc-tested-up-to-version +++ /dev/null @@ -1,4 +0,0 @@ -Significance: patch -Type: dev - -Bump WC tested up to version to 9.3.3. diff --git a/changelog/dev-use-official-docker-hub-phpmyadmin-image b/changelog/dev-use-official-docker-hub-phpmyadmin-image deleted file mode 100644 index 240b76dd52b..00000000000 --- a/changelog/dev-use-official-docker-hub-phpmyadmin-image +++ /dev/null @@ -1,4 +0,0 @@ -Significance: patch -Type: dev - -Use official `phpmyadmin` Docker Hub container image diff --git a/changelog/fix-5384-prevent-pm-detach-on-prod-when-user-is-deleted-on-localhost b/changelog/fix-5384-prevent-pm-detach-on-prod-when-user-is-deleted-on-localhost deleted file mode 100644 index a39adc06bb1..00000000000 --- a/changelog/fix-5384-prevent-pm-detach-on-prod-when-user-is-deleted-on-localhost +++ /dev/null @@ -1,4 +0,0 @@ -Significance: patch -Type: fix - -Prevented detaching payment methods from live Stripe accounts when working in non-production environments. diff --git a/changelog/fix-9142-classname-optional-default-null b/changelog/fix-9142-classname-optional-default-null deleted file mode 100644 index bfcb783f576..00000000000 --- a/changelog/fix-9142-classname-optional-default-null +++ /dev/null @@ -1,4 +0,0 @@ -Significance: patch -Type: dev - -Migrate WizardTaskItem and CollapsibleBody components to TypeScript, making the className prop optional. diff --git a/changelog/fix-9518-apple-pay-button-on-blocks-checkout b/changelog/fix-9518-apple-pay-button-on-blocks-checkout deleted file mode 100644 index ec6970b90e3..00000000000 --- a/changelog/fix-9518-apple-pay-button-on-blocks-checkout +++ /dev/null @@ -1,4 +0,0 @@ -Significance: patch -Type: fix - -Load Stripe with merchant account's key when checking payment method availability. diff --git a/changelog/fix-9548-woopay-auto-enable b/changelog/fix-9548-woopay-auto-enable deleted file mode 100644 index dbbf05c6bea..00000000000 --- a/changelog/fix-9548-woopay-auto-enable +++ /dev/null @@ -1,4 +0,0 @@ -Significance: patch -Type: fix - -Auto-enabled WooPay for new accounts. diff --git a/changelog/fix-9553-use-tax-inclusive-prices-pmme b/changelog/fix-9553-use-tax-inclusive-prices-pmme deleted file mode 100644 index 9c76e73ddfa..00000000000 --- a/changelog/fix-9553-use-tax-inclusive-prices-pmme +++ /dev/null @@ -1,4 +0,0 @@ -Significance: minor -Type: fix - -The amounts used by the PMMEs will match the displayed price of the product regardless of the tax settings. diff --git a/changelog/fix-9559-tooltip-link-color-contrast b/changelog/fix-9559-tooltip-link-color-contrast deleted file mode 100644 index 64e3986e2e8..00000000000 --- a/changelog/fix-9559-tooltip-link-color-contrast +++ /dev/null @@ -1,4 +0,0 @@ -Significance: patch -Type: fix - -Fix the color contrast of links within tooltips to improve readability. diff --git a/changelog/fix-9562-readme-correction-playwright-update-snapshots b/changelog/fix-9562-readme-correction-playwright-update-snapshots deleted file mode 100644 index 846b832a05f..00000000000 --- a/changelog/fix-9562-readme-correction-playwright-update-snapshots +++ /dev/null @@ -1,5 +0,0 @@ -Significance: patch -Type: dev -Comment: Update Playwright README with correct instructions for updating snapshots – not user-facing. - - diff --git a/changelog/fix-add-svn-script b/changelog/fix-add-svn-script deleted file mode 100644 index 7da3bf73cf3..00000000000 --- a/changelog/fix-add-svn-script +++ /dev/null @@ -1,5 +0,0 @@ -Significance: patch -Type: dev -Comment: fix: add GH action SVN dependency - - diff --git a/changelog/fix-convert-rgba-text-color b/changelog/fix-convert-rgba-text-color deleted file mode 100644 index 3c5b8f8c52e..00000000000 --- a/changelog/fix-convert-rgba-text-color +++ /dev/null @@ -1,4 +0,0 @@ -Significance: patch -Type: fix - -Converting text color rgba to hex to prevent Stripe warning diff --git a/changelog/fix-e2e-save-settings-button-disabled b/changelog/fix-e2e-save-settings-button-disabled deleted file mode 100644 index 8e93eb9a0e8..00000000000 --- a/changelog/fix-e2e-save-settings-button-disabled +++ /dev/null @@ -1,5 +0,0 @@ -Significance: patch -Type: dev -Comment: fix: e2e tests w/ save settings button disabled. - - diff --git a/changelog/fix-multiple-instances-of-wc-payments-in-tests b/changelog/fix-multiple-instances-of-wc-payments-in-tests deleted file mode 100644 index aa57d16233a..00000000000 --- a/changelog/fix-multiple-instances-of-wc-payments-in-tests +++ /dev/null @@ -1,4 +0,0 @@ -Significance: patch -Type: dev - -fix: prevent multiple instances of WC_Payments_Apple_Pay_Registration diff --git a/changelog/fix-test-mode-badge-credit-card b/changelog/fix-test-mode-badge-credit-card deleted file mode 100644 index dfb2537989d..00000000000 --- a/changelog/fix-test-mode-badge-credit-card +++ /dev/null @@ -1,4 +0,0 @@ -Significance: patch -Type: fix - -Rendering Test Model badge only for Credit Card diff --git a/changelog/fix-woopay-theming-border-styles b/changelog/fix-woopay-theming-border-styles deleted file mode 100644 index c3b92530afe..00000000000 --- a/changelog/fix-woopay-theming-border-styles +++ /dev/null @@ -1,4 +0,0 @@ -Significance: patch -Type: fix - -Pass container styling data to WooPay diff --git a/changelog/fix-woopay-user-creation-in-shortcode-checkout b/changelog/fix-woopay-user-creation-in-shortcode-checkout deleted file mode 100644 index 4c501ea1add..00000000000 --- a/changelog/fix-woopay-user-creation-in-shortcode-checkout +++ /dev/null @@ -1,4 +0,0 @@ -Significance: patch -Type: fix - -WooPay user registration via classic checkout diff --git a/changelog/fix-wrong-utils-path b/changelog/fix-wrong-utils-path deleted file mode 100644 index aaf2afcc9a2..00000000000 --- a/changelog/fix-wrong-utils-path +++ /dev/null @@ -1,4 +0,0 @@ -Significance: patch -Type: dev - -Fixed wrong utils path that would prevent checkout with WooPay OTP diff --git a/changelog/update-9540-payment-task-onboarding-flow b/changelog/update-9540-payment-task-onboarding-flow deleted file mode 100644 index c4674a67377..00000000000 --- a/changelog/update-9540-payment-task-onboarding-flow +++ /dev/null @@ -1,4 +0,0 @@ -Significance: patch -Type: update - -Payments task onboarding flows skip the Connect page. diff --git a/package-lock.json b/package-lock.json index 56cfed2cfa8..8f0358c6674 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "woocommerce-payments", - "version": "8.3.1", + "version": "8.4.0", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "woocommerce-payments", - "version": "8.3.1", + "version": "8.4.0", "hasInstallScript": true, "license": "GPL-3.0-or-later", "dependencies": { diff --git a/package.json b/package.json index 629b9ceee87..952111032f4 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "woocommerce-payments", - "version": "8.3.1", + "version": "8.4.0", "main": "webpack.config.js", "author": "Automattic", "license": "GPL-3.0-or-later", diff --git a/readme.txt b/readme.txt index 1bc07f50c25..76ff51ccda2 100644 --- a/readme.txt +++ b/readme.txt @@ -4,7 +4,7 @@ Tags: woocommerce payments, apple pay, credit card, google pay, payment, payment Requires at least: 6.0 Tested up to: 6.6 Requires PHP: 7.3 -Stable tag: 8.3.1 +Stable tag: 8.4.0 License: GPLv2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html @@ -94,6 +94,26 @@ Please note that our support for the checkout block is still experimental and th == Changelog == += 8.4.0 - 2024-10-23 = +* Add - Add test mode badge to classic checkout and add payment method. +* Add - Using Floating Labels with Stripe Appearance API for Blocks Checkout +* Fix - Converting text color rgba to hex to prevent Stripe warning +* Fix - Fix the color contrast of links within tooltips to improve readability. +* Fix - Pass container styling data to WooPay +* Fix - Prevented detaching payment methods from live Stripe accounts when working in non-production environments. +* Fix - Rendering Test Model badge only for Credit Card +* Fix - Stop enqueuing woopay-express-button.css to prevent 404 errors +* Fix - The amounts used by the PMMEs will match the displayed price of the product regardless of the tax settings. +* Fix - WooPay user registration via classic checkout +* Update - Add support for the style controls for the WooPay button +* Update - chore: remove deprecated is_in_dev_mode() and is_in_test_mode() methods +* Update - Payments task onboarding flows skip the Connect page. +* Dev - Bump WC tested up to version to 9.3.3. +* Dev - fix: prevent multiple instances of WC_Payments_Apple_Pay_Registration +* Dev - Fixed wrong utils path that would prevent checkout with WooPay OTP +* Dev - Migrate WizardTaskItem and CollapsibleBody components to TypeScript, making the className prop optional. +* Dev - Use official `phpmyadmin` Docker Hub container image + = 8.3.1 - 2024-10-16 = * Fix - Auto-enabled WooPay for new accounts. * Fix - Load Stripe with merchant account's key when checking payment method availability. diff --git a/woocommerce-payments.php b/woocommerce-payments.php index 5f240fb7202..7283bb20728 100644 --- a/woocommerce-payments.php +++ b/woocommerce-payments.php @@ -11,7 +11,7 @@ * WC tested up to: 9.3.3 * Requires at least: 6.0 * Requires PHP: 7.3 - * Version: 8.3.1 + * Version: 8.4.0 * Requires Plugins: woocommerce * * @package WooCommerce\Payments From ebca2f4bd12cf5fd1db6ee35328a9786e9619dab Mon Sep 17 00:00:00 2001 From: Daniel Guerra <15204776+danielmx-dev@users.noreply.github.com> Date: Tue, 22 Oct 2024 22:54:03 +0300 Subject: [PATCH 27/28] Omit Test Mode badge in the Change payment method form (#9615) --- ...mit-test-mode-badge-in-change-payment-form | 4 + client/checkout/classic/style.scss | 83 ++++++++++--------- includes/class-wc-payment-gateway-wcpay.php | 6 +- 3 files changed, 52 insertions(+), 41 deletions(-) create mode 100644 changelog/fix-omit-test-mode-badge-in-change-payment-form diff --git a/changelog/fix-omit-test-mode-badge-in-change-payment-form b/changelog/fix-omit-test-mode-badge-in-change-payment-form new file mode 100644 index 00000000000..eff6afc6766 --- /dev/null +++ b/changelog/fix-omit-test-mode-badge-in-change-payment-form @@ -0,0 +1,4 @@ +Significance: minor +Type: fix + +Omit the test mode badge in the change payment method form for subscriptions. diff --git a/client/checkout/classic/style.scss b/client/checkout/classic/style.scss index aa8df8b1676..5b452accc83 100644 --- a/client/checkout/classic/style.scss +++ b/client/checkout/classic/style.scss @@ -39,53 +39,56 @@ max-height: 24px !important; } - li.payment_method_woocommerce_payments { - display: grid; - grid-template-columns: 0fr 0fr 1fr; - grid-template-rows: max-content; - - > input[name='payment_method'] { - align-self: center; - } - > label { - grid-column: 3; + &.wc_payment_methods, + &.woocommerce-PaymentMethods { + li.payment_method_woocommerce_payments { display: grid; - grid-template-columns: 0fr auto; + grid-template-columns: 0fr 0fr 1fr; grid-template-rows: max-content; - grid-gap: 0; - margin-bottom: 0; - - > .label-title-container { - grid-area: 1 / 2 / 2 / 3; - } - .payment-method-title { - margin-right: 8px; + > input[name='payment_method'] { + align-self: center; } - - .test-mode.badge { - display: inline-block; - background-color: #fff2d7; - border-radius: 4px; - padding: 4px 6px; - font-size: 12px; - font-weight: 400; - line-height: 16px; - color: #4d3716; - vertical-align: middle; + > label { + grid-column: 3; + display: grid; + grid-template-columns: 0fr auto; + grid-template-rows: max-content; + grid-gap: 0; + margin-bottom: 0; + + > .label-title-container { + grid-area: 1 / 2 / 2 / 3; + } + + .payment-method-title { + margin-right: 8px; + } + + .test-mode.badge { + display: inline-block; + background-color: #fff2d7; + border-radius: 4px; + padding: 4px 6px; + font-size: 12px; + font-weight: 400; + line-height: 16px; + color: #4d3716; + vertical-align: middle; + } + + img { + float: none; + grid-area: 1 / 4 / 2 / 5; + align-self: baseline; + justify-self: end; + margin-left: 1em; + } } - - img { - float: none; - grid-area: 1 / 4 / 2 / 5; - align-self: baseline; - justify-self: end; - margin-left: 1em; + > div.payment_box { + grid-area: 2 / 1 / 3 / 4; } } - > div.payment_box { - grid-area: 2 / 1 / 3 / 4; - } } } diff --git a/includes/class-wc-payment-gateway-wcpay.php b/includes/class-wc-payment-gateway-wcpay.php index f795a7514b7..d1fe2b1cca6 100644 --- a/includes/class-wc-payment-gateway-wcpay.php +++ b/includes/class-wc-payment-gateway-wcpay.php @@ -580,7 +580,11 @@ public function init_hooks() { public function get_title() { $title = parent::get_title(); - if ( Payment_Method::CARD === $this->stripe_id && ( is_checkout() || is_add_payment_method_page() ) ) { + if ( + Payment_Method::CARD === $this->stripe_id && + ( is_checkout() || is_add_payment_method_page() ) && + ! isset( $_GET['change_payment_method'] ) // phpcs:ignore WordPress.Security.NonceVerification + ) { if ( WC_Payments::mode()->is_test() ) { $test_mode_badge = '' . __( 'Test Mode', 'woocommerce-payments' ) . ''; } else { From e4b68149333584b69d51d8ff0b0514eb57c2f3bf Mon Sep 17 00:00:00 2001 From: botwoo Date: Wed, 23 Oct 2024 15:08:29 +0000 Subject: [PATCH 28/28] Amend changelog entries for release 8.4.0 --- changelog.txt | 1 + changelog/fix-omit-test-mode-badge-in-change-payment-form | 4 ---- readme.txt | 1 + 3 files changed, 2 insertions(+), 4 deletions(-) delete mode 100644 changelog/fix-omit-test-mode-badge-in-change-payment-form diff --git a/changelog.txt b/changelog.txt index 2bc166dbb97..3e68c78c9f1 100644 --- a/changelog.txt +++ b/changelog.txt @@ -5,6 +5,7 @@ * Add - Using Floating Labels with Stripe Appearance API for Blocks Checkout * Fix - Converting text color rgba to hex to prevent Stripe warning * Fix - Fix the color contrast of links within tooltips to improve readability. +* Fix - Omit the test mode badge in the change payment method form for subscriptions. * Fix - Pass container styling data to WooPay * Fix - Prevented detaching payment methods from live Stripe accounts when working in non-production environments. * Fix - Rendering Test Model badge only for Credit Card diff --git a/changelog/fix-omit-test-mode-badge-in-change-payment-form b/changelog/fix-omit-test-mode-badge-in-change-payment-form deleted file mode 100644 index eff6afc6766..00000000000 --- a/changelog/fix-omit-test-mode-badge-in-change-payment-form +++ /dev/null @@ -1,4 +0,0 @@ -Significance: minor -Type: fix - -Omit the test mode badge in the change payment method form for subscriptions. diff --git a/readme.txt b/readme.txt index 76ff51ccda2..cc050c3699e 100644 --- a/readme.txt +++ b/readme.txt @@ -99,6 +99,7 @@ Please note that our support for the checkout block is still experimental and th * Add - Using Floating Labels with Stripe Appearance API for Blocks Checkout * Fix - Converting text color rgba to hex to prevent Stripe warning * Fix - Fix the color contrast of links within tooltips to improve readability. +* Fix - Omit the test mode badge in the change payment method form for subscriptions. * Fix - Pass container styling data to WooPay * Fix - Prevented detaching payment methods from live Stripe accounts when working in non-production environments. * Fix - Rendering Test Model badge only for Credit Card