Commit 1c7478aba21 for woocommerce
commit 1c7478aba21428d79ae808854ad59db72f3ac2d3
Author: Luigi Teschio <gigitux@gmail.com>
Date: Thu Aug 13 09:46:20 2026 +0200
Fix Search dependency on wcSettings (#67579)
* Fix Search dependency on wcSettings
* Add changelog entry for Search wcSettings fix
diff --git a/packages/js/components/changelog/39772-search-wcsettings b/packages/js/components/changelog/39772-search-wcsettings
new file mode 100644
index 00000000000..c8ec28c1cc3
--- /dev/null
+++ b/packages/js/components/changelog/39772-search-wcsettings
@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Prevent the Search variations autocompleter from failing when wcSettings is unavailable.
diff --git a/packages/js/components/src/phone-number-input/utils.ts b/packages/js/components/src/phone-number-input/utils.ts
index 12a2788b9c8..bd62fd31838 100644
--- a/packages/js/components/src/phone-number-input/utils.ts
+++ b/packages/js/components/src/phone-number-input/utils.ts
@@ -72,7 +72,7 @@ const countryNames: Record< string, string > = mapValues(
{
AC: 'Ascension Island',
XK: 'Kosovo',
- ...( window.wcSettings?.countries || [] ),
+ ...( window.wcSettings?.countries || {} ),
},
( name ) => decodeHtmlEntities( name )
);
diff --git a/packages/js/components/src/search/autocompleters/test/variations.test.ts b/packages/js/components/src/search/autocompleters/test/variations.test.ts
new file mode 100644
index 00000000000..f69afcdd2e6
--- /dev/null
+++ b/packages/js/components/src/search/autocompleters/test/variations.test.ts
@@ -0,0 +1,48 @@
+/**
+ * Internal dependencies
+ */
+import variations from '../variations';
+
+jest.mock( '@woocommerce/navigation', () => ( {
+ getQuery: jest.fn( () => ( {} ) ),
+} ) );
+
+describe( 'variations autocompleter', () => {
+ const hadWcSettings = 'wcSettings' in window;
+ const originalWcSettings = window.wcSettings;
+ const variation = {
+ id: 1,
+ name: 'T-shirt',
+ attributes: [ { option: 'Red' }, { option: 'Large' } ],
+ sku: 'TSHIRT-RED-LARGE',
+ };
+
+ afterEach( () => {
+ if ( hadWcSettings ) {
+ window.wcSettings = originalWcSettings;
+ } else {
+ delete window.wcSettings;
+ }
+ } );
+
+ it( 'uses the default separator when wcSettings is unavailable', () => {
+ delete window.wcSettings;
+
+ expect( variations.getOptionKeywords( variation ) ).toEqual( [
+ 'T-shirt - Red, Large',
+ 'TSHIRT-RED-LARGE',
+ ] );
+ } );
+
+ it( 'uses the separator configured in wcSettings', () => {
+ window.wcSettings = {
+ variationTitleAttributesSeparator: ' | ',
+ countries: {},
+ };
+
+ expect( variations.getOptionKeywords( variation ) ).toEqual( [
+ 'T-shirt | Red, Large',
+ 'TSHIRT-RED-LARGE',
+ ] );
+ } );
+} );
diff --git a/packages/js/components/src/search/autocompleters/variations.tsx b/packages/js/components/src/search/autocompleters/variations.tsx
index 5789fd9ab71..2807c924849 100644
--- a/packages/js/components/src/search/autocompleters/variations.tsx
+++ b/packages/js/components/src/search/autocompleters/variations.tsx
@@ -30,7 +30,7 @@ function getVariationName( {
name: string;
} ) {
const separator =
- window.wcSettings.variationTitleAttributesSeparator || ' - ';
+ window.wcSettings?.variationTitleAttributesSeparator || ' - ';
if ( name.indexOf( separator ) > -1 ) {
return name;
diff --git a/packages/js/components/typings/global.d.ts b/packages/js/components/typings/global.d.ts
index 2a33e1b2764..eba858bc9b6 100644
--- a/packages/js/components/typings/global.d.ts
+++ b/packages/js/components/typings/global.d.ts
@@ -1,6 +1,6 @@
declare global {
interface Window {
- wcSettings: {
+ wcSettings?: {
variationTitleAttributesSeparator?: string;
countries: Record< string, string >;
};
@@ -9,4 +9,3 @@ declare global {
/*~ If your module exports nothing, you'll need this line. Otherwise, delete it */
export {};
-