Merge pull request #2010 from woocommerce/release/2.4.11

release 2.4.11

.github/workflows/bundle-size.yml → .github/workflows/build.yml

@@ -1,4 +1,4 @@
-name: Bundle Size
+name: Build
 
 on:
   push:
@@ -12,8 +12,8 @@ concurrency:
   cancel-in-progress: true
 
 jobs:
-  BundleSize:
-    name: Bundle size
+  BuildExtensionBundle:
+    name: Build extension bundle
     runs-on: ubuntu-latest
     env:
       FORCE_COLOR: 2
@@ -63,3 +63,9 @@ jobs:
         env:
           BUNDLEWATCH_GITHUB_TOKEN: ${{ secrets.BUNDLEWATCH_GITHUB_TOKEN }}
         run: node ./node_modules/bundlewatch/lib/bin/index.js
+
+      - name: Publish dev build to GitHub
+        if: ${{ github.event_name == 'push' && github.ref_name == 'develop' }}
+        uses: woocommerce/grow/publish-extension-dev-build@actions-v1
+        with:
+          extension-asset-path: google-listings-and-ads.zip

.github/workflows/php-unit-tests.yml

@@ -49,6 +49,8 @@ jobs:
         include:
           - php: 7.4
             wp-version: ${{ needs.GetMatrix.outputs.latest-wp-version }}
+          - php: 8.1
+            wp-version: ${{ needs.GetMatrix.outputs.latest-wp-version }}
 
     steps:
       - name: Checkout repository

.github/workflows/prepare-release.yml

@@ -0,0 +1,44 @@
+name: 'Prepare New Release'
+run-name:  Prepare New Release `${{ github.event.inputs.type }}/${{ github.event.inputs.version }}` from by @${{ github.actor }}
+
+# **What it does**: Does release preparation: creates the release branch and the PR with a checklist.
+# **Why we have it**: To support devs automating a few manual steps, and to leave a nice reference for consumers.
+
+on:
+  workflow_dispatch:
+    inputs:
+      ## In the future we could infer that version from the changelog, or bump it via major|minor|patch.
+      version:
+        description: 'Version number to be released'
+        required: true
+      type:
+        description: 'Type of the release (release|hotfix)'
+        required: true
+        default: 'release'
+      wp-version:
+        description: 'WordPress tested up to'
+      wc-version:
+        description: 'WooCommerce tested up to'
+
+
+jobs:
+  PrepareRelease:
+    name: Prepare Release
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+
+      - name: Create branch & PR
+        uses: woocommerce/grow/prepare-extension-release@actions-v1
+        with:
+          version: ${{ github.event.inputs.version }}
+          type: ${{ github.event.inputs.type }}
+          wp-version: ${{ github.event.inputs.wp-version }}
+          wc-version: ${{ github.event.inputs.wc-version }}
+          main-branch: 'trunk'
+          pre-steps: |
+            1. [ ] Remove older changelog entries from `readme.txt` (keep the last two versions, since we will be adding a third during the release), commit changes.
+            1. [ ] If there are new database migration classes (under `src/DB/Migration/`), modify their applicable version set in the `get_applicable_version` class of each migration class to be the same value as the version that is to be released.
+               :warning: Notice that `x.x.x` is not a valid version and should be set manually with the new version. So, for example, if we are releasing version 1.12.0 and there is a file `Migration20211228T1640692399.php` inside `src/DB/Migration/`, you should open that file and in the method `get_applicable_version` return `1.12.0`.
+            1. [ ] :exclamation: If this release has updated composer packages, we should test [Composer package conflicts with other plugins](https://github.com/woocommerce/google-listings-and-ads/wiki/Smoke-tests#composer-package-conflicts-with-other-plugins).

.npmrc

@@ -0,0 +1 @@
+engine-strict=true

README.md

@@ -4,7 +4,7 @@
 [![JavaScript Unit Tests](https://github.com/woocommerce/google-listings-and-ads/actions/workflows/js-unit-tests.yml/badge.svg)](https://github.com/woocommerce/google-listings-and-ads/actions/workflows/js-unit-tests.yml)
 [![PHP Coding Standards](https://github.com/woocommerce/google-listings-and-ads/actions/workflows/php-coding-standards.yml/badge.svg)](https://github.com/woocommerce/google-listings-and-ads/actions/workflows/php-coding-standards.yml)
 [![JavaScript and CSS Linting](https://github.com/woocommerce/google-listings-and-ads/actions/workflows/js-css-linting.yml/badge.svg)](https://github.com/woocommerce/google-listings-and-ads/actions/workflows/js-css-linting.yml)
-[![Bundle Size](https://github.com/woocommerce/google-listings-and-ads/actions/workflows/bundle-size.yml/badge.svg)](https://github.com/woocommerce/google-listings-and-ads/actions/workflows/bundle-size.yml)
+[![Build](https://github.com/woocommerce/google-listings-and-ads/actions/workflows/build.yml/badge.svg)](https://github.com/woocommerce/google-listings-and-ads/actions/workflows/build.yml)
 
 A native integration with Google offering free listings and Performance Max ads to WooCommerce merchants.
 

changelog.txt

@@ -1,5 +1,20 @@
 *** WooCommerce Google Listings and Ads Changelog ***
 
+= 2.4.11 - 2023-07-11 =
+* Add - Client name and plugin version to requests.
+* Dev - Enable unit testing for PHP 8.1.
+* Dev - Set engines for the repository.
+* Fix - Avoid continuing to save settings to Google Merchant Center after the shipping time save failed on the Edit Free Listings page.
+* Fix - Avoid errors when clearing all audience countries in the onboarding flow.
+* Fix - Incorrectly display South America in the audience location selector after selecting Saudi Arabia.
+* Fix - Remove deprecated $border-width-focus variable.
+* Fix - Show a general error message when the phone number verification request is failed.
+* Tweak - Add placeholder in the Attribute Mapping table when there are no rules available.
+* Tweak - Changes for title, descriptions and FAQ in PMAX Optimized Campaigns.
+* Tweak - Make some error messages clearer when errors occur in querying or modifying data.
+* Tweak - Make the error message clearer for errors that occur in getting or updating a Google Merchant Center account.
+* Tweak - WC 7.9 compatibility.
+
 = 2.4.10 - 2023-06-13 =
 * Tweak - WC 7.8 compatibility.
 

google-listings-and-ads.php

@@ -3,7 +3,7 @@
  * Plugin Name: Google Listings and Ads
  * Plugin URL: https://wordpress.org/plugins/google-listings-and-ads/
  * Description: Native integration with Google that allows merchants to easily display their products across Google’s network.
- * Version: 2.4.10
+ * Version: 2.4.11
  * Author: WooCommerce
  * Author URI: https://woocommerce.com/
  * Text Domain: google-listings-and-ads
@@ -13,7 +13,7 @@
  * Requires PHP Architecture: 64 bits
  *
  * WC requires at least: 6.9
- * WC tested up to: 7.8
+ * WC tested up to: 7.9
  * Woo:
  *
  * @package WooCommerce\Admin
@@ -30,7 +30,7 @@
 
 defined( 'ABSPATH' ) || exit;
 
-define( 'WC_GLA_VERSION', '2.4.10' ); // WRCS: DEFINED_VERSION.
+define( 'WC_GLA_VERSION', '2.4.11' ); // WRCS: DEFINED_VERSION.
 define( 'WC_GLA_MIN_PHP_VER', '7.4' );
 define( 'WC_GLA_MIN_WC_VER', '6.9' );
 

js/src/attribute-mapping/attribute-mapping-table.js

@@ -106,6 +106,10 @@ const AttributeMappingTable = () => {
 						/>
 					) : (
 						<Table
+							emptyMessage={ __(
+								'You have no attribute rules',
+								'google-listings-and-ads'
+							) }
 							caption={ __(
 								'Attribute Mapping configuration',
 								'google-listings-and-ads'

js/src/components/app-tab-nav/index.scss

@@ -29,12 +29,12 @@
 		}
 
 		&:focus:not(:disabled) {
-			box-shadow: inset 0 $border-width-focus var(--wp-admin-theme-color);
+			box-shadow: inset 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
 		}
 
 		&.is-active {
 			// The transparent shadow ensures no jumpiness when focus animates on an active tab.
-			box-shadow: inset 0 0 0 $border-width-focus transparent, inset 0 0 - $border-width-tab 0 0 var(--wp-admin-theme-color);
+			box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) transparent, inset 0 0 - $border-width-tab 0 0 var(--wp-admin-theme-color);
 			position: relative;
 
 			// This border appears in Windows High Contrast mode instead of the box-shadow.
@@ -50,11 +50,11 @@
 		}
 
 		&:focus {
-			box-shadow: inset 0 0 0 $border-width-focus var(--wp-admin-theme-color);
+			box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
 		}
 
 		&.is-active:focus {
-			box-shadow: inset 0 0 0 $border-width-focus var(--wp-admin-theme-color), inset 0 0 - $border-width-tab 0 0 var(--wp-admin-theme-color);
+			box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color), inset 0 0 - $border-width-tab 0 0 var(--wp-admin-theme-color);
 		}
 	}
 }

js/src/components/paid-ads/asset-group/asset-group-section.js

@@ -13,6 +13,7 @@ import Section from '.~/wcdl/section';
 import VerticalGapLayout from '.~/components/vertical-gap-layout';
 import FinalUrlCard from './final-url-card';
 import AssetGroupCard from './asset-group-card';
+import AppDocumentationLink from '.~/components/app-documentation-link';
 import './asset-group-section.scss';
 
 /**
@@ -29,7 +30,7 @@ export default function AssetGroupSection() {
 			className="gla-asset-group-section"
 			title={ createInterpolateElement(
 				__(
-					'Add dynamic ad assets <optional>(Optional)</optional>',
+					'Add additional assets <optional>(Optional)</optional>',
 					'google-listings-and-ads'
 				),
 				{
@@ -39,12 +40,23 @@ export default function AssetGroupSection() {
 				}
 			) }
 			description={
-				<p className="gla-asset-group-section__primary-description">
-					{ __(
-						'Create ads that effectively boost visibility and generate maximum conversions. Google will mix and match assets to create optimized ads in a variety of formats— maximizing your campaign’s performance.',
-						'google-listings-and-ads'
-					) }
-				</p>
+				<>
+					<p className="gla-asset-group-section__primary-description">
+						{ __(
+							'Upload text and image assets to effectively reach and engage your target shoppers. Google will mix and match your assets, continually testing combinations to create personalized and optimal shopping experiences.',
+							'google-listings-and-ads'
+						) }
+					</p>
+					<p>
+						<AppDocumentationLink
+							context="asset-group"
+							linkId="asset-group-learn-more"
+							href="https://support.google.com/google-ads/answer/10729160"
+						>
+							{ __( 'Learn more', 'google-listings-and-ads' ) }
+						</AppDocumentationLink>
+					</p>
+				</>
 			}
 		>
 			<VerticalGapLayout size="medium">

js/src/components/paid-ads/asset-group/asset-group.js

@@ -108,9 +108,12 @@ export default function AssetGroup( { campaign } ) {
 	return (
 		<StepContent>
 			<StepContentHeader
-				title={ __( 'Boost your campaign', 'google-listings-and-ads' ) }
+				title={ __(
+					'Optimize your campaign',
+					'google-listings-and-ads'
+				) }
 				description={ __(
-					'Take your campaign to the next level with dynamic ad assets',
+					'Drive greater performance by adding text and image assets to create personalized and engaging ads',
 					'google-listings-and-ads'
 				) }
 			/>

js/src/components/paid-ads/asset-group/faqs-section.js

@@ -48,13 +48,13 @@ const faqItems = [
 			<>
 				<div>
 					{ __(
-						`Dynamic ad assets can elevate your campaign by offering a variety of ad combinations that capture your audience's attention and generate maximum engagement. By leveraging Google's asset-mixing technology, your ads can be optimized to deliver the right message, to the right people, at the right time.`,
+						"Text and image assets can elevate your campaign by offering a variety of ad combinations that capture your audience's attention and generate maximum engagement. By leveraging Google's asset-mixing technology, your ads can be optimized to deliver the right message, to the right people, at the right time.",
 						'google-listings-and-ads'
 					) }
 				</div>
 				<div>
 					{ __(
-						'Compared to product ads—which showcase individual products and are designed to drive direct sales and revenue— ads with dynamic assets are typically used to highlight your business, generate interest, and attract new customers. While both types of ads can drive conversions, using them together can generate even greater results.',
+						'Compared to product ads—which showcase individual products and are designed to drive direct sales and revenue— ads with creative assets are typically used to highlight your business, generate interest, and attract new customers. While both types of ads can drive conversions, using them together can generate even greater results.',
 						'google-listings-and-ads'
 					) }
 				</div>

js/src/components/tree-select-control/index.js

@@ -152,13 +152,15 @@ const TreeSelectControl = ( {
 		cacheRef.current.filteredOptionsMap.clear();
 
 		function loadOption( option, parentId ) {
+			const { children = [] } = option;
 			option.parent = parentId;
 
-			option.children?.forEach( ( el ) =>
-				loadOption( el, option.value )
-			);
+			children.forEach( ( el ) => loadOption( el, option.value ) );
 
-			repository[ option.key ?? option.value ] = option;
+			// Only children can be rendered as selected tags.
+			if ( ! children.length ) {
+				repository[ option.key ?? option.value ] = option;
+			}
 		}
 
 		treeOptions.forEach( loadOption );

js/src/components/tree-select-control/index.test.js

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { fireEvent, render } from '@testing-library/react';
+import { fireEvent, render, screen } from '@testing-library/react';
 /**
  * Internal dependencies
  */
@@ -21,6 +21,11 @@ const options = [
 		value: 'AS',
 		label: 'Asia',
 	},
+	{
+		value: 'same-value',
+		label: 'Parent - same value',
+		children: [ { value: 'same-value', label: 'Child - same value' } ],
+	},
 ];
 
 describe( 'TreeSelectControl Component', () => {
@@ -78,6 +83,7 @@ describe( 'TreeSelectControl Component', () => {
 	} );
 
 	it( 'Renders the All Options', () => {
+		const allValues = [ 'ES', 'FR', 'IT', 'AS', 'same-value' ];
 		const onChange = jest.fn().mockName( 'onChange' );
 		const { queryByLabelText, queryByRole, rerender } = render(
 			<TreeSelectControl options={ options } onChange={ onChange } />
@@ -90,11 +96,11 @@ describe( 'TreeSelectControl Component', () => {
 		expect( allCheckbox ).toBeTruthy();
 
 		fireEvent.click( allCheckbox );
-		expect( onChange ).toHaveBeenCalledWith( [ 'ES', 'FR', 'IT', 'AS' ] );
+		expect( onChange ).toHaveBeenCalledWith( allValues );
 
 		rerender(
 			<TreeSelectControl
-				value={ [ 'ES', 'FR', 'IT', 'AS' ] }
+				value={ allValues }
 				options={ options }
 				onChange={ onChange }
 			/>
@@ -118,6 +124,31 @@ describe( 'TreeSelectControl Component', () => {
 		expect( allCheckbox ).toBeTruthy();
 	} );
 
+	it( 'Should only allow children to be rendered as selected tags', () => {
+		render(
+			<TreeSelectControl
+				value={ [ 'EU', 'AS', 'FR' ] }
+				options={ options }
+			/>
+		);
+
+		const buttons = screen.getAllByRole( 'button', { name: /remove/i } );
+
+		expect( buttons.length ).toBe( 2 );
+		expect( screen.queryByText( 'Europe' ) ).toBeFalsy();
+	} );
+
+	it( 'When a parent and a child have the same value and be selected, the rendered tag should be the child', () => {
+		render(
+			<TreeSelectControl value={ [ 'same-value' ] } options={ options } />
+		);
+
+		const buttons = screen.getAllByRole( 'button', { name: /remove/i } );
+
+		expect( buttons.length ).toBe( 1 );
+		expect( screen.queryByText( 'Child - same value' ) ).toBeTruthy();
+	} );
+
 	it( 'Filters Options on Search', () => {
 		const { queryByLabelText, queryByRole } = render(
 			<TreeSelectControl options={ options } />

js/src/dashboard/all-programs-table-card/campaign-assets-tour.js

@@ -38,7 +38,7 @@ export default function CampaignAssetsTour( { referenceElementCssSelector } ) {
 						<div className="gla-campaign-assets-tour__heading">
 							<GridiconTrending />
 							{ __(
-								'Boost your campaign',
+								'Optimize your campaign',
 								'google-listings-and-ads'
 							) }
 							<Pill>
@@ -54,7 +54,7 @@ export default function CampaignAssetsTour( { referenceElementCssSelector } ) {
 						desktop: (
 							<>
 								{ __(
-									'Create ads that boost visibility and maximize campaign performance using dynamic ad assets.',
+									'Add images, headlines, and descriptions to drive better engagement and more sales.',
 									'google-listings-and-ads'
 								) }
 								<br />