Release branch for 9.8.0

.eslintrc

@@ -102,10 +102,6 @@
 			{
 				"selector": "ImportDeclaration[source.value=/gridicons(?!\\u002F)/]",
 				"message": "Do not import whole Gridicons, import them individually with 'gridicons/dist/icon-name'."
-			},
-			{
-				"selector": "ImportDeclaration[source.value='@wordpress/components']",
-				"message": "Do not import from '@wordpress/components' directly. Use components from 'wcpay/components/wp-components-wrapped' instead."
 			}
 		]
 	},

.github/workflows/build-live-branch.yml

@@ -0,0 +1,119 @@
+name: Build live branch when develop updated
+on:
+  workflow_dispatch:
+  push:
+    branches:
+      - develop
+    paths-ignore:
+      - '.cursor/**'
+      - '.github/**'
+      - '!.github/workflows/build-live-branch.yml'
+      - '.husky/**'
+      - '.bin/**'
+      - 'docker/**'
+      - 'docs/**'
+      - 'tasks/**'
+      - 'tests/**'
+      - '**/tests/**'
+      - 'wordpress-org-assets/**'
+      - '**/changelog/**'
+      - '**/changelog.txt'
+      - '**/readme.txt'
+      - '.gitignore'
+      - 'CODEOWNERS'
+      - '**/*.md'
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: true
+
+permissions: {}
+
+jobs:
+  build:
+    if: github.repository_owner == 'automattic' && github.actor != 'github-actions[bot]'
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+    steps:
+      - name: "Checkout repository"
+        uses: actions/checkout@v4
+
+      - name: "Set up repository"
+        uses: ./.github/actions/setup-repo
+
+      - name: "Get current version"
+        id: current-version
+        run: |
+          VERSION=$(jq '.version' package.json -r)
+          echo "Current version found: $VERSION" >> $GITHUB_STEP_SUMMARY
+          echo "VERSION=$VERSION" >> $GITHUB_OUTPUT
+
+      - name: "Get dev version"
+        id: get-dev-version
+        env:
+          CURRENT_VERSION: ${{ steps.current-version.outputs.VERSION }}
+        run: |
+          DEV_SUFFIX_VERSION="${GITHUB_RUN_ID}-g$(git rev-parse --short HEAD)"
+          DEV_VERSION="${CURRENT_VERSION}-${DEV_SUFFIX_VERSION}"
+          echo "Dev Version: $DEV_VERSION" >> $GITHUB_STEP_SUMMARY
+          echo "DEV_VERSION=$DEV_VERSION" >> $GITHUB_OUTPUT
+
+      - name: "Bump dev version"
+        id: bump-dev-version
+        env:
+          DEV_VERSION: ${{ steps.get-dev-version.outputs.DEV_VERSION }}
+        run: |
+          # 'Version' header in woocommerce-payments.php
+          sed -i "s/^ \* Version: .*$/ * Version: $DEV_VERSION/" woocommerce-payments.php
+
+          # 'version' field in package.json
+          sed -ri 's/("version": )".*"/\1"'${DEV_VERSION}'"/' package.json
+
+          # 'Stable tag' header in readme.txt;
+          sed -i "s/^Stable tag: .*$/Stable tag: $DEV_VERSION/" readme.txt
+
+      - name: "Build the plugin"
+        id: build_plugin
+        uses: ./.github/actions/build
+
+      - name: "Update the structure of artifacts for Jetpack Beta Builder" 
+        run: |
+          cd release
+          mv woocommerce-payments woocommerce-payments-dev
+          zip -q -r "woocommerce-payments-dev.zip" "woocommerce-payments-dev/"
+          rm -fR "woocommerce-payments-dev"
+
+      - name: "Get plugin data for Jetpack Beta Builder"
+        id: get-plugin-data
+        env:
+          DEV_VERSION: ${{ steps.get-dev-version.outputs.DEV_VERSION }}
+        run: |
+          # Plugin data is passed as a JSON object.
+          PLUGIN_DATA="{}"
+          PLUGIN_DATA=$( jq -c --arg slug "woocommerce-payments" --arg ver "$DEV_VERSION" '.[ $slug ] = { version: $ver }' <<<"$PLUGIN_DATA" )
+          echo "plugin-data=$PLUGIN_DATA" >> $GITHUB_OUTPUT
+
+      - name: "Upload the zip file as an artifact"
+        uses: actions/upload-artifact@v4
+        if: steps.get-plugin-data.outputs.plugin-data != '{}'
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        with:
+          name: plugins
+          path: release
+          # Only need to retain for a day since the beta builder slurps it up to distribute.
+          retention-days: 1
+
+      - name: "Inform Jetpack Beta Builder webhook"
+        if: steps.get-plugin-data.outputs.plugin-data != '{}'
+        env:
+          SECRET: ${{ secrets.WCPAYBETA_SECRET }}
+          PLUGIN_DATA: ${{ steps.get-plugin-data.outputs.plugin-data }}
+        run: |
+          curl -v --fail -L \
+            --url "https://betadownload.jetpack.me/gh-action.php?run_id=$GITHUB_RUN_ID&commit=$GITHUB_SHA" \
+            --form-string "repo=$GITHUB_REPOSITORY" \
+            --form-string "branch=${GITHUB_REF#refs/heads/}" \
+            --form-string "plugins=$PLUGIN_DATA" \
+            --form-string "secret=$SECRET"

.github/workflows/e2e-pull-request.yml

@@ -47,14 +47,15 @@ jobs:
     strategy:
       fail-fast:     false
       matrix:
+        wc_version:   [ 'latest' ]
         test_groups:   [ 'wcpay', 'subscriptions' ] # [TODO] Unskip blocks tests after investigating constant failures.
         test_branches: [ 'merchant', 'shopper' ]
 
-    name: WC - latest | ${{ matrix.test_groups }} - ${{ matrix.test_branches }}
+    name: WC - ${{ matrix.wc_version }} | ${{ matrix.test_groups }} - ${{ matrix.test_branches }}
 
     env:
       E2E_WP_VERSION: 'latest'
-      E2E_WC_VERSION: 'latest'
+      E2E_WC_VERSION: ${{ matrix.wc_version }}
       E2E_GROUP:  ${{ matrix.test_groups }}
       E2E_BRANCH: ${{ matrix.test_branches }}
 

.github/workflows/e2e-test.yml

@@ -37,7 +37,7 @@ jobs:
       - name: "Generate matrix"
         id: generate_matrix
         run: |
-          WC_VERSIONS=$( echo "[\"7.7.0\", \"latest\", \"beta\"]" )
+          WC_VERSIONS=$( echo "[\"7.7.0\", \"latest\", \"beta\", \"rc\"]" )
           echo "matrix={\"woocommerce\":$WC_VERSIONS,\"test_groups\":[\"wcpay\", \"subscriptions\"],\"test_branches\":[\"merchant\", \"shopper\"]}" >> $GITHUB_OUTPUT
 
   # Run WCPay & subscriptions tests against specific WC versions

.github/workflows/release-code-freeze.yml

@@ -2,8 +2,8 @@ name: "Release - Code freeze"
 
 # This action will run according to the cron schedule or when triggered manually
 on:
-  schedule:
-    - cron: '0 12 * * 0' # Run at 1200 UTC on Sundays.
+  # schedule:
+    # - cron: '0 18 * * 3' # Run at 1800 UTC on Wednesdays.
   workflow_dispatch:
     inputs:
       skipSlackPing:
@@ -57,16 +57,16 @@ jobs:
         env:
           NEXT_VERSION: ${{ steps.next-version.outputs.NEXT_RELEASE_VERSION }}
         run: |
-          git fetch --tags origin
-          NEXT_VERSION_TAG_STABLE=$(git tag -l "${{ env.NEXT_VERSION }}" | tail -1)
-          NEXT_VERSION_TAG_FROM_WEEK_2=$(git tag -l "${{ env.NEXT_VERSION }}-test-2" | tail -1)
-          if [[ -z "$NEXT_VERSION_TAG_FROM_WEEK_2" ]]; then
-            echo "Code freeze is not needed :x:" >> $GITHUB_STEP_SUMMARY
-            echo "FREEZE=0" >> $GITHUB_OUTPUT
-          elif [[ -z "$NEXT_VERSION_TAG_STABLE" ]]; then
-            echo "Code freeze is needed :white_check_mark:" >> $GITHUB_STEP_SUMMARY
-            echo "FREEZE=1" >> $GITHUB_OUTPUT
-          fi
+          # git fetch --tags origin
+          # NEXT_VERSION_TAG_STABLE=$(git tag -l "${{ env.NEXT_VERSION }}" | tail -1)
+          # NEXT_VERSION_TAG_FROM_WEEK_2=$(git tag -l "${{ env.NEXT_VERSION }}-test-2" | tail -1)
+          # if [[ -z "$NEXT_VERSION_TAG_FROM_WEEK_2" ]]; then
+          #   echo "Code freeze is not needed :x:" >> $GITHUB_STEP_SUMMARY
+          #   echo "FREEZE=0" >> $GITHUB_OUTPUT
+          # elif [[ -z "$NEXT_VERSION_TAG_STABLE" ]]; then
+          # fi
+          echo "Code freeze is needed :white_check_mark:" >> $GITHUB_STEP_SUMMARY
+          echo "FREEZE=1" >> $GITHUB_OUTPUT
 
   create-release-pr:
     name: "Raise a PR to trunk"

assets/css/admin.rtl.css

@@ -131,6 +131,14 @@
 	background-image: url( '../images/payment-methods/afterpay-icon.svg' );
 }
 
+.payment-method__brand--afterpay_clearpay.account-country--gb {
+	background-image: url( '../images/payment-methods/clearpay.svg' );
+}
+
+.payment-method__brand--afterpay_clearpay.account-country--us {
+	background-image: url( '../images/payment-methods/afterpay-cashapp-icon.svg' );
+}
+
 .payment-method__brand--affirm {
 	background-image: url( '../images/payment-methods/affirm-icon.svg' );
 }

bin/install-wp-tests.sh

@@ -191,9 +191,9 @@ install_woocommerce() {
 	WC_INSTALL_EXTRA=''
 	INSTALLED_WC_VERSION=$(wp plugin get woocommerce --field=version)
 
-	if [[ $WC_VERSION == 'beta' ]]; then
+	if [[ $WC_VERSION == 'beta' ]] || [[ $WC_VERSION == 'rc' ]]; then
 		# Get the latest non-trunk version number from the .org repo. This will usually be the latest release, beta, or rc.
-		WC_VERSION=$(curl https://api.wordpress.org/plugins/info/1.0/woocommerce.json | jq -r '.versions | with_entries(select(.key|match("beta";"i"))) | keys[-1]' --sort-keys)
+		WC_VERSION=$(curl https://api.wordpress.org/plugins/info/1.0/woocommerce.json | jq -r '.versions | with_entries(select(.key|match("'$WC_VERSION'";"i"))) | keys | sort_by( . | split("-")[0] | split(".") | map(tonumber) ) | last' --sort-keys)
 	fi
 
 	if [[ -n $INSTALLED_WC_VERSION ]] && [[ $WC_VERSION == 'latest' ]]; then

changelog.txt

@@ -1,5 +1,29 @@
 *** WooPayments Changelog ***
 
+= 9.8.0 - 2025-08-13 =
+* Add - Add address autocomplete to Checkout
+* Add - Add support for small screens on the evidence submission form.
+* Fix - Fix customer details section when name and/or email are very big.
+* Fix - Fix Google/Apple Pay "State / County is required" error during checkout for Croatia
+* Fix - Fix the icon border of the Steps component for a dispute.
+* Fix - Reset the enabled payment methods to default value on account reset.
+* Fix - Suppress sending completed-renewal-order email after dispute resolution
+* Update - As of this change, we stop bundling WordPress Components in favor of using the wp.components available in the WordPress installation.
+* Update - Make onboading pages use the pw.components available in the WordPress installation.
+* Update - Make the connect acctount components use the wp.components from the installation.
+* Update - Make the KYC onboarding use the WP components available in the installation.
+* Update - update: ensure Google Pay/Apple Pay can check out w/ LT addresses
+* Update - update: fraud protection rules to use WP components bundled within the WP installation
+* Update - Update documents page to use WP components available in the WordPress installation.
+* Update - Update loan page to use the installation WordPress components.
+* Update - Update the "Learn more about disputes" link in the confirmation screen of the disputes documentation.
+* Dev - Fix: enhances the robustness of the selectPaymentMethod method in end-to-end tests
+* Dev - Fix: Respond to a dispute e2e tests
+* Dev - Fix: select payment method shopper util
+* Dev - Removed all the Progressive Onboarding (PO) code.
+* Dev - update: use React 18
+* Dev - Update tested WooCommerce version to 10.1.0
+
 = 9.7.0 - 2025-07-24 =
 * Add - Add a confirmation screen to the new flow for submitting dispute evidence.
 * Add - Add Credit not processed logic for the new evidence submission form.

client/capital/test/index.test.tsx → client/capital/__tests__/index.test.tsx

@@ -7,7 +7,7 @@ import { render, screen } from '@testing-library/react';
  * Internal dependencies
  */
 import { useActiveLoanSummary, useLoans } from 'wcpay/data';
-import CapitalPage from '../index';
+import CapitalPage from '..';
 
 // Mock the useLoans hook
 jest.mock( 'wcpay/data', () => ( {

client/card-readers/index.tsx

@@ -11,7 +11,7 @@ import { __ } from '@wordpress/i18n';
  */
 import Page from 'components/page';
 import ReadersList from './list';
-import { TabPanel } from 'wcpay/components/wp-components-wrapped/components/tab-panel';
+import { TabPanel } from '@wordpress/components';
 
 import './style.scss';
 

client/card-readers/list/index.tsx

@@ -8,9 +8,7 @@ import { __, sprintf } from '@wordpress/i18n';
 /**
  * Internal dependencies
  */
-import { Card } from 'wcpay/components/wp-components-wrapped/components/card';
-import { CardBody } from 'wcpay/components/wp-components-wrapped/components/card-body';
-import { CardDivider } from 'wcpay/components/wp-components-wrapped/components/card-divider';
+import { Card, CardBody, CardDivider } from '@wordpress/components';
 import SettingsSection from 'wcpay/settings/settings-section';
 import SettingsLayout from 'wcpay/settings/settings-layout';
 import LoadableSettingsSection from 'wcpay/settings/loadable-settings-section';

client/checkout/upe-styles/test/index.js → client/checkout/upe-styles/__tests__/index.test.js

@@ -1,7 +1,7 @@
 /**
  * Internal dependencies
  */
-import * as upeStyles from '../index';
+import * as upeStyles from '..';
 
 describe( 'Getting styles for automated theming', () => {
 	const mockElement = document.createElement( 'input' );

client/checkout/woopay/connect/woopay-connect.js

@@ -2,7 +2,7 @@
  * Internal dependencies
  */
 import { WooPayConnectIframe } from 'wcpay/checkout/woopay/connect/woopay-connect-iframe';
-import ReactDOM from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import { getConfig } from 'wcpay/utils/checkout';
 import {
 	INJECTED_STATE,
@@ -110,7 +110,8 @@ class WoopayConnect {
 			self.listeners.getIframePostMessageCallback = resolve;
 		} );
 
-		ReactDOM.render( <WooPayConnectIframe />, hiddenDiv );
+		const root = createRoot( hiddenDiv );
+		root.render( <WooPayConnectIframe /> );
 	}
 
 	/**

client/checkout/woopay/express-button/test/index.test.js → client/checkout/woopay/express-button/__tests__/index.test.js

@@ -1,13 +1,12 @@
 /**
  * External dependencies
  */
-import { screen } from '@testing-library/react';
+import { screen, act } from '@testing-library/react';
 
 /**
  * Internal dependencies
  */
-import '../index';
-import { getConfig } from 'utils/checkout';
+import '..';
 
 jest.mock( 'utils/checkout', () => ( {
 	getConfig: jest.fn(),
@@ -26,25 +25,33 @@ describe( 'renderWooPayExpressButton', () => {
 	expressButtonContainer.setAttribute( 'id', 'wcpay-woopay-button' );
 
 	beforeEach( () => {
-		getConfig.mockReturnValue( 'foo' );
+		document.body.innerHTML = '';
 	} );
 
-	test( 'render the button component in placeholder', () => {
+	test( 'render the button component in placeholder', async () => {
 		document.body.appendChild( expressButtonContainer );
 
 		// trigger window load.
-		window.dispatchEvent( new Event( 'load' ) );
+		await act( async () => {
+			window.dispatchEvent( new Event( 'load' ) );
+
+			// giving React some time to render
+			await new Promise( ( resolve ) => setTimeout( resolve, 0 ) );
+		} );
 
 		expect(
-			screen.queryByText( 'WooPay Express Button' )
+			await screen.findByText( 'WooPay Express Button' )
 		).toBeInTheDocument();
 	} );
 
-	test( 'should not render the express button component if placeholder is absent', () => {
-		document.body.removeChild( expressButtonContainer );
-
+	test( 'should not render the express button component if placeholder is absent', async () => {
 		// trigger window load.
-		window.dispatchEvent( new Event( 'load' ) );
+		await act( async () => {
+			window.dispatchEvent( new Event( 'load' ) );
+
+			// giving React some time to render
+			await new Promise( ( resolve ) => setTimeout( resolve, 0 ) );
+		} );
 
 		expect(
 			screen.queryByText( 'WooPay Express Button' )