E2E tests fix: enable the attribute lookup direct updates settings (https://github.com/woocommerce/woocommerce-blocks/pull/9029)

* Enable the attribute lookup direct updates settings

We are importing products using the batch api and we need the lookup tables
to be updated immediately for our tests to work. Enabling this setting will
do that, instead of doing it asynchronously.

* Fix customer account test classes

* Increase timeout limit for failing tests

---------

Co-authored-by: roykho <roykho77@gmail.com>

plugins/woocommerce-blocks/tests/e2e/config/setup.js

@@ -20,6 +20,7 @@ import {
 	createBlockPages,
 	enablePaymentGateways,
 	createProductAttributes,
+	enableAttributeLookupDirectUpdates,
 } from '../fixtures/fixture-loaders';
 import { PERFORMANCE_REPORT_FILENAME } from '../../utils/constants';
 
@@ -28,9 +29,12 @@ module.exports = async ( globalConfig ) => {
 	await setupPuppeteer( globalConfig );
 
 	try {
+		await enableAttributeLookupDirectUpdates();
+
 		// do setupSettings separately which hopefully gives a chance for WooCommerce
 		// to be configured before the others are executed.
 		await setupSettings();
+
 		const pages = await createBlockPages();
 
 		/**

plugins/woocommerce-blocks/tests/e2e/fixtures/fixture-loaders.js

@@ -481,7 +481,16 @@ const deleteProductAttributes = ( ids ) => {
 	return WooCommerce.post( 'products/attributes/batch', { delete: ids } );
 };
 
+const enableAttributeLookupDirectUpdates = () =>
+	WooCommerce.put(
+		'settings/products/woocommerce_attribute_lookup_direct_updates',
+		{
+			value: 'yes',
+		}
+	);
+
 module.exports = {
+	enableAttributeLookupDirectUpdates,
 	createProductAttributes,
 	deleteProductAttributes,
 	setupSettings,

plugins/woocommerce-blocks/tests/e2e/specs/backend/customer-account.test.js

@@ -15,13 +15,13 @@ import { openSettingsSidebar } from '../../utils.js';
 const block = {
 	name: 'Customer account',
 	slug: 'woocommerce/customer-account',
-	class: '.wc-block-customer-account',
+	class: '.wc-block-editor-customer-account',
 };
 
 const SELECTORS = {
 	icon: '.wp-block-woocommerce-customer-account svg',
 	label: '.wp-block-woocommerce-customer-account .label',
-	iconToggle: '.wc-block-customer-account__icon-style-toggle',
+	iconToggle: '.wc-block-editor-customer-account__icon-style-toggle',
 	displayDropdown: '.customer-account-display-style select',
 };
 

plugins/woocommerce-blocks/tests/e2e/specs/shopper/filter-products-by-attribute.test.ts

@@ -259,6 +259,7 @@ describe( `${ block.name } Block`, () => {
 		} );
 
 		it( 'should render products', async () => {
+			page.setDefaultTimeout( 200000 );
 			const products = await page.$$(
 				selectors.frontend.queryProductsList
 			);
@@ -267,6 +268,7 @@ describe( `${ block.name } Block`, () => {
 		} );
 
 		it( 'should show only products that match the filter', async () => {
+			page.setDefaultTimeout( 200000 );
 			const isRefreshed = jest.fn( () => void 0 );
 			page.on( 'load', isRefreshed );
 
@@ -299,6 +301,7 @@ describe( `${ block.name } Block`, () => {
 		} );
 
 		it( 'should refresh the page only if the user clicks on button', async () => {
+			page.setDefaultTimeout( 200000 );
 			await page.goto( editorPageUrl );
 
 			await waitForCanvas();