Commit 85b2046af32 for woocommerce
commit 85b2046af3295be4b271e7e555ef8140ffd31d8e
Author: Vlad Olaru <vlad.olaru@automattic.com>
Date: Mon Sep 14 17:37:26 2026 +0300
[tests] Add Jest and browser coverage for the Customer Account block (#68660)
* test(blocks): Cover Customer Account settings and its account link name
Two things about the Customer Account block had no test anywhere. This
adds one for each.
The first is the editor side: which attribute gets written when
someone picks a display style. A new Jest suite renders BlockSettings
with InspectorControls and the toggle group stubbed, picks each option
through a real user-event interaction, and asserts the exact value
handed to setAttributes. Three cases, one per display style. Only
displayStyle is exercised; the icon-style control is stubbed and not
interacted with.
The second is the accessible name render_label produces for a
logged-in customer. CustomerAccountTest covers the block's rendering
on trunk and is untouched here, but it asserts only that a label and
an aria-label are present, never what they say: change 'My Account' to
'Account' and it stays green at OK (6 tests, 15 assertions).
That second test arrives in a file trunk deleted, so the history is
worth stating exactly. #68122 removed the block's spec as redundant
when it held three titles, none of which asserted the account link's
name. The migration branch separately rewrote that spec down to one
title and added the name assertion while doing so. What lands here is
therefore new coverage that has never existed on trunk, not a reversal
of that deletion and not one of the three titles judged redundant.
Nothing is removed and no production code changes.
Consolidates the mega-branch slices:
- Slice blocks-flow-05-customer-account
Refs TESTOPS-234
Refs #68046
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
* test(php): Cover the account link's accessible name, drop the browser test
The browser title existed for one assertion the PHP suite was missing:
`test_display_style` checked only that an `aria-label=` attribute was
present, never what it said. Everything else in the title was already
covered by `CustomerAccountTest`, and #68122 removed the rest of the
spec on those grounds.
Move the missing assertion down instead of keeping a browser run for
it. Four data rows now pin the name itself: `aria-label="My Account"`
for the icon-only style, `<span class="label">My Account</span>` for
the two styles that render text, and `aria-label="Login"` for a logged
-out visitor. Forcing `render_label()` to always return `Login` fails
the three logged-in rows and leaves the rest green.
The editor half stays with the Jest test this PR adds, which asserts
the Icon options control writes the right `displayStyle`.
Refs TESTOPS-234
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
---------
Co-authored-by: Claude Opus 5 (1M context) <noreply@anthropic.com>
diff --git a/plugins/woocommerce/changelog/testops-234-customer-account-block b/plugins/woocommerce/changelog/testops-234-customer-account-block
new file mode 100644
index 00000000000..4978b1ce9ba
--- /dev/null
+++ b/plugins/woocommerce/changelog/testops-234-customer-account-block
@@ -0,0 +1,3 @@
+Significance: patch
+Type: dev
+Comment: Add Jest coverage for the Customer Account block's sidebar settings and PHPUnit coverage for the accessible name its link exposes, which nothing covered before.
diff --git a/plugins/woocommerce/client/blocks/assets/js/blocks/customer-account/test/sidebar-settings.tsx b/plugins/woocommerce/client/blocks/assets/js/blocks/customer-account/test/sidebar-settings.tsx
new file mode 100644
index 00000000000..9aeb8e45ae0
--- /dev/null
+++ b/plugins/woocommerce/client/blocks/assets/js/blocks/customer-account/test/sidebar-settings.tsx
@@ -0,0 +1,75 @@
+/**
+ * External dependencies
+ */
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+
+/**
+ * Internal dependencies
+ */
+import { BlockSettings } from '../sidebar-settings';
+import { DisplayStyle, IconStyle } from '../types';
+
+jest.mock( '@wordpress/block-editor', () => ( {
+ ...jest.requireActual( '@wordpress/block-editor' ),
+ InspectorControls: jest.fn( ( { children } ) => <div>{ children }</div> ),
+} ) );
+
+jest.mock( '@wordpress/components', () => ( {
+ ...jest.requireActual( '@wordpress/components' ),
+ __experimentalToggleGroupControl: jest.fn( ( { children } ) => (
+ <div>{ children }</div>
+ ) ),
+ __experimentalToggleGroupControlOption: jest.fn( () => null ),
+} ) );
+
+describe( 'Customer Account sidebar settings', () => {
+ it.each( [
+ {
+ option: 'Icon and text',
+ initialDisplayStyle: DisplayStyle.TEXT_ONLY,
+ expectedDisplayStyle: DisplayStyle.ICON_AND_TEXT,
+ },
+ {
+ option: 'Text-only',
+ initialDisplayStyle: DisplayStyle.ICON_ONLY,
+ expectedDisplayStyle: DisplayStyle.TEXT_ONLY,
+ },
+ {
+ option: 'Icon-only',
+ initialDisplayStyle: DisplayStyle.ICON_AND_TEXT,
+ expectedDisplayStyle: DisplayStyle.ICON_ONLY,
+ },
+ ] )(
+ 'maps "$option" to its serialized display style',
+ async ( { option, initialDisplayStyle, expectedDisplayStyle } ) => {
+ const user = userEvent.setup();
+ const setAttributes = jest.fn();
+
+ render(
+ <BlockSettings
+ attributes={ {
+ displayStyle: initialDisplayStyle,
+ iconStyle: IconStyle.DEFAULT,
+ iconClass: 'wc-block-customer-account__account-icon',
+ } }
+ setAttributes={ setAttributes }
+ />
+ );
+
+ const displayStyleSelect = screen.getByRole( 'combobox', {
+ name: 'Icon options',
+ } );
+ const targetOption = screen.getByRole( 'option', {
+ name: option,
+ } );
+
+ await user.selectOptions( displayStyleSelect, targetOption );
+
+ expect( setAttributes ).toHaveBeenCalledTimes( 1 );
+ expect( setAttributes ).toHaveBeenCalledWith( {
+ displayStyle: expectedDisplayStyle,
+ } );
+ }
+ );
+} );
diff --git a/plugins/woocommerce/client/blocks/changelog/testops-234-customer-account-block b/plugins/woocommerce/client/blocks/changelog/testops-234-customer-account-block
new file mode 100644
index 00000000000..4978b1ce9ba
--- /dev/null
+++ b/plugins/woocommerce/client/blocks/changelog/testops-234-customer-account-block
@@ -0,0 +1,3 @@
+Significance: patch
+Type: dev
+Comment: Add Jest coverage for the Customer Account block's sidebar settings and PHPUnit coverage for the accessible name its link exposes, which nothing covered before.
diff --git a/plugins/woocommerce/tests/php/src/Blocks/BlockTypes/CustomerAccountTest.php b/plugins/woocommerce/tests/php/src/Blocks/BlockTypes/CustomerAccountTest.php
index 8b53ed17b0e..3a833e3afb8 100644
--- a/plugins/woocommerce/tests/php/src/Blocks/BlockTypes/CustomerAccountTest.php
+++ b/plugins/woocommerce/tests/php/src/Blocks/BlockTypes/CustomerAccountTest.php
@@ -147,4 +147,46 @@ class CustomerAccountTest extends WP_UnitTestCase {
$this->assertSame( $has_label, str_contains( $markup, 'class="label"' ) );
$this->assertSame( $has_aria, str_contains( $markup, 'aria-label=' ) );
}
+
+ /**
+ * Data provider for the account link's accessible name.
+ *
+ * @return array<string, array{string, string}>
+ */
+ public function provider_account_link_name(): array {
+ return array(
+ 'icon only, named by aria-label' => array( 'icon_only', ' aria-label="My Account"' ),
+ 'icon and text, named by label' => array( 'icon_and_text', '<span class="label">My Account</span>' ),
+ 'text only, named by label' => array( 'text_only', '<span class="label">My Account</span>' ),
+ );
+ }
+
+ /**
+ * @testdox Should name the account link "My Account" for a logged-in user, whichever display style is set.
+ *
+ * @dataProvider provider_account_link_name
+ *
+ * @param string $display_style Display style attribute.
+ * @param string $expected Markup fragment that carries the accessible name.
+ */
+ public function test_account_link_is_named_for_a_logged_in_user( string $display_style, string $expected ): void {
+ wp_set_current_user( $this->user_id );
+
+ $markup = $this->render_customer_account(
+ '{"displayStyle":"' . $display_style . '","iconClass":"wc-block-customer-account__account-icon"}'
+ );
+
+ $this->assertStringContainsString( $expected, $markup );
+ }
+
+ /**
+ * @testdox Should name the account link "Login" when nobody is logged in.
+ */
+ public function test_account_link_is_named_for_a_logged_out_visitor(): void {
+ $markup = $this->render_customer_account(
+ '{"displayStyle":"icon_only","iconClass":"wc-block-customer-account__account-icon"}'
+ );
+
+ $this->assertStringContainsString( ' aria-label="Login"', $markup );
+ }
}