Merge branch 'develop' into woopmnt-5113-visa-compliance-dispute-requires-attention-to-a-specific-fee

dmvrtx · web-flow · commit ed8116619c73 · 2025-11-10T16:28:09.000+01:00
diff --git a/changelog/dev-qit-e2e-foundation b/changelog/dev-qit-e2e-foundation
@@ -0,0 +1,5 @@
+Significance: patch
+Type: dev
+Comment: Add foundation to run E2E tests with QIT and basic tests.
+
+
diff --git a/changelog/woopmnt-5398-woopay-button-spinner-and-label-is-not-visible-on-click b/changelog/woopmnt-5398-woopay-button-spinner-and-label-is-not-visible-on-click
@@ -0,0 +1,4 @@
+Significance: minor
+Type: fix
+
+Fix styling of the WooPay button to make sure that the spinner is visible when loading.
diff --git a/changelog/woopmnt-5449-update-payout-banner-in-the-settings b/changelog/woopmnt-5449-update-payout-banner-in-the-settings
@@ -0,0 +1,4 @@
+Significance: minor
+Type: update
+
+Change payout texts for  New Account Waiting Period to be consistent with new Account Details
diff --git a/client/checkout/woopay/express-button/style.scss b/client/checkout/woopay/express-button/style.scss
@@ -18,6 +18,7 @@
 		text-transform: none;
 		list-style-type: none;
 		min-height: auto;
+		position: relative;
 
 		.button-content {
 			display: flex;
diff --git a/client/components/deposits-overview/__tests__/index.test.tsx b/client/components/deposits-overview/__tests__/index.test.tsx
@@ -306,9 +306,12 @@ describe( 'Deposits Overview information', () => {
 			setSelectedCurrency: mockSetSelectedCurrency,
 		} );
 		const { getByText, queryByText } = render( <DepositsOverview /> );
-		getByText( /Your first payout is held for/, {
-			ignore: '.a11y-speak-region',
-		} );
+		getByText(
+			/Payout scheduling becomes available after the standard 7-day waiting period for new accounts is complete/,
+			{
+				ignore: '.a11y-speak-region',
+			}
+		);
 		expect( queryByText( 'Change deposit schedule' ) ).toBeFalsy();
 		expect( queryByText( 'View full deposits history' ) ).toBeFalsy();
 	} );
@@ -426,7 +429,11 @@ describe( 'Deposits Overview information', () => {
 		} );
 
 		const { queryByText } = render( <DepositsOverview /> );
-		expect( queryByText( /Your first payout is held for/ ) ).toBeFalsy();
+		expect(
+			queryByText(
+				/Payout scheduling becomes available after the standard 7-day waiting period for new accounts is complete/
+			)
+		).toBeFalsy();
 	} );
 
 	test( 'Confirm new account waiting period notice shows if within waiting period', () => {
@@ -444,10 +451,13 @@ describe( 'Deposits Overview information', () => {
 		} );
 
 		const { getByText, getByRole } = render( <DepositsOverview /> );
-		getByText( /Your first payout is held for/, {
-			ignore: '.a11y-speak-region',
-		} );
-		expect( getByRole( 'link', { name: /Why\?/ } ) ).toHaveAttribute(
+		getByText(
+			/Payout scheduling becomes available after the standard 7-day waiting period for new accounts is complete/,
+			{
+				ignore: '.a11y-speak-region',
+			}
+		);
+		expect( getByRole( 'link', { name: /Learn more/ } ) ).toHaveAttribute(
 			'href',
 			'https://woocommerce.com/document/woopayments/payouts/payout-schedule/#new-accounts'
 		);
diff --git a/client/components/deposits-overview/deposit-notices.tsx b/client/components/deposits-overview/deposit-notices.tsx
@@ -58,11 +58,11 @@ export const NewAccountWaitingPeriodNotice: React.FC = () => (
 	>
 		{ interpolateComponents( {
 			mixedString: __(
-				'Your first payout is held for 7-14 days. {{whyLink}}Why?{{/whyLink}}',
+				'Payout scheduling becomes available after the standard 7-day waiting period for new accounts is complete. {{learnMoreLink}}Learn more{{/learnMoreLink}}',
 				'woocommerce-payments'
 			),
 			components: {
-				whyLink: (
+				learnMoreLink: (
 					// Link content is in the format string above. Consider disabling jsx-a11y/anchor-has-content.
 					// eslint-disable-next-line jsx-a11y/anchor-has-content
 					<a
diff --git a/client/settings/deposits/__tests__/index.test.js b/client/settings/deposits/__tests__/index.test.js
@@ -163,7 +163,7 @@ describe( 'Deposits', () => {
 		);
 
 		const depositsMessage = screen.getByText(
-			/Your first payout will be held for/,
+			/Payout scheduling becomes available after the standard 7-day waiting period for new accounts is complete/,
 			{
 				ignore: '.a11y-speak-region',
 			}
diff --git a/client/settings/deposits/index.js b/client/settings/deposits/index.js
@@ -189,8 +189,9 @@ const DepositsSchedule = () => {
 			<InlineNotice status="warning" isDismissible={ false } icon>
 				{ interpolateComponents( {
 					mixedString: __(
-						'Your first payout will be held for 7-14 days. ' +
-							'Payout scheduling will be available after this period. {{learnMoreLink}}Learn more{{/learnMoreLink}}',
+						'Payout scheduling becomes available after the standard 7-day waiting period for new accounts is complete.' +
+							' ' +
+							'{{learnMoreLink}}Learn more{{/learnMoreLink}}',
 						'woocommerce-payments'
 					),
 					components: {
diff --git a/composer.json b/composer.json
@@ -42,7 +42,7 @@
         "cweagans/composer-patches": "1.7.1",
         "automattic/jetpack-changelogger": "3.3.2",
         "spatie/phpunit-watcher": "1.23.6",
-        "woocommerce/qit-cli": "0.4.0",
+        "woocommerce/qit-cli": "0.10.0",
         "slevomat/coding-standard": "8.15.0",
         "dg/bypass-finals": "1.5.1",
         "sirbrillig/phpcs-variable-analysis": "^2.11",
diff --git a/composer.lock b/composer.lock
diff --git a/package.json b/package.json
@@ -48,6 +48,7 @@
     "test:qit-phpstan": "npm run build:release && ./tests/qit/phpstan.sh",
     "test:qit-phpstan-local": "npm run build:release && ./tests/qit/phpstan.sh --local",
     "test:qit-malware": "npm run build:release && ./tests/qit/malware.sh --local",
+    "test:qit-e2e": "./tests/qit/e2e-runner.sh",
     "watch": "webpack --watch",
     "hmr": "webpack server",
     "start": "npm run watch",
diff --git a/tests/js/jest.config.js b/tests/js/jest.config.js
@@ -46,6 +46,7 @@ module.exports = {
 		'<rootDir>/.*/build-module/',
 		'<rootDir>/docker/',
 		'<rootDir>/tests/e2e',
+		'<rootDir>/tests/qit/e2e',
 	],
 	watchPathIgnorePatterns: [
 		'/node_modules/',
@@ -54,6 +55,7 @@ module.exports = {
 		'<rootDir>/.*/build-module/',
 		'<rootDir>/docker/',
 		'<rootDir>/tests/e2e',
+		'<rootDir>/tests/qit/e2e',
 	],
 	transform: {
 		...tsjPreset.transform,
diff --git a/tests/qit/config/default.env b/tests/qit/config/default.env
@@ -1,3 +1,9 @@
-# Create `local.env` and supply actual values.
-QIT_USER=""
-QIT_PASSWORD=""
+# QIT Configuration for WooCommerce Payments
+# Copy this file to local.env and update with your values
+
+# ===========================================
+# QIT CLI CREDENTIALS (for security, phpstan, malware, custom e2e tests)
+# ===========================================
+QIT_USER=your_qit_username
+QIT_PASSWORD=your_qit_application_password
+
diff --git a/tests/qit/e2e-runner.sh b/tests/qit/e2e-runner.sh
@@ -0,0 +1,55 @@
+#!/usr/bin/env bash
+
+# Enable strict error handling and safe field splitting for reliability
+set -euo pipefail
+IFS=$'\n\t'
+
+# E2E test runner for WooPayments using QIT
+cwd=$(pwd)
+WCP_ROOT="$cwd"
+QIT_ROOT="$cwd/tests/qit"
+
+# Load local env variables if present
+if [[ -f "$QIT_ROOT/config/local.env" ]]; then
+    . "$QIT_ROOT/config/local.env"
+fi
+
+# If QIT_BINARY is not set, default to ./vendor/bin/qit
+QIT_BINARY=${QIT_BINARY:-./vendor/bin/qit}
+
+echo "Running E2E tests..."
+
+# Change to project root directory to build plugin
+cd "$WCP_ROOT"
+
+# Foundation version: Simplified build process for easier testing
+# For this foundation PR, we'll always build to avoid complex signature computation issues
+
+BUILD_HASH_FILE="$WCP_ROOT/woocommerce-payments.zip.hash"
+
+# For this foundation PR, always build if zip doesn't exist or if forced
+if [[ -n "${WCP_FORCE_BUILD:-}" ]] || [[ ! -f "woocommerce-payments.zip" ]]; then
+    echo "Building WooPayments plugin..."
+    npm run build:release
+    echo "foundation-build-$(date +%s)" > "$BUILD_HASH_FILE"
+else
+    echo "Using existing woocommerce-payments.zip"
+fi
+
+# Change to QIT directory so qit.yml is automatically found
+cd "$QIT_ROOT"
+
+# Convert relative QIT_BINARY path to absolute for directory change compatibility
+if [[ "$QIT_BINARY" = ./* ]]; then
+    QIT_CMD="$WCP_ROOT/$QIT_BINARY"
+else
+    QIT_CMD="$QIT_BINARY"
+fi
+
+echo "Running QIT E2E foundation tests (no Jetpack credentials)..."
+
+# Run our QIT E2E tests (qit.yml automatically loaded from current directory)
+"$QIT_CMD" run:e2e woocommerce-payments ./e2e \
+    --source "$WCP_ROOT/woocommerce-payments.zip"
+
+echo "QIT E2E foundation tests completed!"
diff --git a/tests/qit/e2e/.eslintrc.js b/tests/qit/e2e/.eslintrc.js
@@ -0,0 +1,26 @@
+module.exports = {
+	env: {
+		node: true,
+	},
+	globals: {
+		page: 'readonly',
+		browser: 'readonly',
+		context: 'readonly',
+	},
+	rules: {
+		// Disable Jest-specific rules that conflict with Playwright
+		'jest/no-done-callback': 'off',
+		'jest/expect-expect': 'off',
+		// Allow QIT-specific imports that ESLint can't resolve
+		'import/no-unresolved': [ 'error', { ignore: [ '/qitHelpers' ] } ],
+	},
+	overrides: [
+		{
+			files: [ '*.spec.js', '*.test.js' ],
+			rules: {
+				// Playwright test specific overrides
+				'jest/no-done-callback': 'off',
+			},
+		},
+	],
+};
diff --git a/tests/qit/e2e/basic.spec.js b/tests/qit/e2e/basic.spec.js
@@ -0,0 +1,62 @@
+/**
+ * External dependencies
+ */
+import { test, expect } from '@playwright/test';
+import qit from '/qitHelpers';
+
+/**
+ * Simple QIT E2E test - bare minimum to verify QIT works
+ */
+test( 'Load home page', async ( { page } ) => {
+	await page.goto( '/' );
+
+	// Just check that we can load the page and title exists
+	await expect( page ).toHaveTitle( /.*/ );
+} );
+
+/**
+ * Test WooCommerce Payments onboarding flow access
+ * Since we're running in development mode without Jetpack connection,
+ * we expect to always land on the onboarding flow.
+ */
+test( 'Access WooCommerce Payments onboarding as admin', async ( { page } ) => {
+	// Use QIT helper to login as admin
+	await qit.loginAsAdmin( page );
+
+	// Navigate to WooCommerce Payments settings
+	await page.goto(
+		'/wp-admin/admin.php?page=wc-admin&path=%2Fpayments%2Foverview'
+	);
+
+	// We should see the Payments admin route load
+	await expect(
+		page.locator( 'h1:not(.screen-reader-text)' ).first()
+	).toContainText( /Settings|Payments|Overview/, { timeout: 15000 } );
+
+	// In development mode without Jetpack connection, we should be on onboarding
+	expect( page.url() ).toContain( 'onboarding' );
+
+	// The onboarding page should load without errors
+	await expect( page.locator( 'body' ) ).not.toHaveText(
+		/500|404|Fatal error/
+	);
+} );
+
+/**
+ * Test plugin activation and basic WooCommerce functionality
+ */
+test( 'Verify WooCommerce Payments plugin activation', async ( { page } ) => {
+	await qit.loginAsAdmin( page );
+
+	// Check plugins page to verify WooCommerce Payments is active
+	await page.goto( '/wp-admin/plugins.php' );
+
+	// Look for the WooCommerce Payments plugin row (exclude update row)
+	const pluginRow = page.locator(
+		'tr[data-plugin*="woocommerce-payments"]:not(.plugin-update-tr)'
+	);
+	await expect( pluginRow ).toBeVisible();
+
+	// Verify it shows as activated
+	await expect( pluginRow.locator( '.deactivate' ) ).toBeVisible();
+} );
diff --git a/tests/qit/e2e/bootstrap/setup.sh b/tests/qit/e2e/bootstrap/setup.sh
diff --git a/tests/qit/qit.yml b/tests/qit/qit.yml

Original file line number	Diff line number	Diff line change
`@@ -163,7 +163,7 @@ describe( 'Deposits', () => {`
`163`	`163`	`);`
`164`	`164`
`165`	`165`	`const depositsMessage = screen.getByText(`
`166`		`- /Your first payout will be held for/,`
	`166`	`+ /Payout scheduling becomes available after the standard 7-day waiting period for new accounts is complete/,`
`167`	`167`	`{`
`168`	`168`	`ignore: '.a11y-speak-region',`
`169`	`169`	`}`