Set up WooCommerce on settings page before running test

GoogleForCreators · Apr 27, 2022 · 17ea300 · 17ea300
1 parent 87b8f74
commit 17ea300
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 3 deletions.
diff --git a/packages/e2e-tests/src/specs/dashboard/settings/adminUser/shoppingProvider.js b/packages/e2e-tests/src/specs/dashboard/settings/adminUser/shoppingProvider.js
@@ -40,7 +40,7 @@ describe('Shopify settings', () => {
       text: 'None',
     });
 
-    await expect(page).toClick('li', { text: 'Shopify' });
+    await expect(page).toClick('[role="listbox"] li', { text: 'Shopify' });
     await expect(page).toMatchElement(shoppingProviderDropdownSelector, {
       text: 'Shopify',
     });
@@ -49,7 +49,7 @@ describe('Shopify settings', () => {
     await expect(page).toClick(shoppingProviderDropdownSelector, {
       text: 'Shopify',
     });
-    await expect(page).toClick('li', { text: 'None' });
+    await expect(page).toClick('[role="listbox"] li', { text: 'None' });
     await expect(page).toMatchElement(shoppingProviderDropdownSelector, {
       text: 'None',
     });

diff --git a/packages/e2e-tests/src/specs/editor/shopping/woocommerce.js b/packages/e2e-tests/src/specs/editor/shopping/woocommerce.js
@@ -24,6 +24,7 @@ import {
   minWPVersionRequired,
   previewStory,
   withPlugin,
+  visitSettings,
 } from '@web-stories-wp/e2e-test-utils';
 
 /**
@@ -32,9 +33,20 @@ import {
 import * as schema from './schema.json';
 
 async function insertProduct(product) {
-  await expect(page).toClick('[aria-controls="library-pane-shopping"]');
+  // Switch to the Products tab and wait for initial list of products to be fetched.
+  await Promise.all([
+    page.waitForResponse(
+      (response) =>
+        response.url().includes('web-stories/v1/products') &&
+        response.status() === 200
+    ),
+    expect(page).toClick('[aria-controls="library-pane-shopping"]'),
+  ]);
+
+  // This clicks on the Product dropdown and waits for the dropdown menu to open.
   await expect(page).toClick('[aria-label="Product"]');
   await page.waitForSelector('[aria-label="Search"]');
+
   await page.type('[aria-label="Search"]', product);
   await page.keyboard.press('ArrowDown');
   await page.keyboard.press('Enter');
@@ -48,6 +60,26 @@ describe('Shopping', () => {
   describe('WooCommerce', () => {
     withPlugin('woocommerce');
 
+    beforeAll(async () => {
+      await visitSettings();
+
+      // Small trick to ensure we scroll to this input.
+      const shoppingProviderDropdown = await page.$(
+        'button[aria-label="Shopping provider"]'
+      );
+      await shoppingProviderDropdown.focus();
+
+      // eslint-disable-next-line jest/no-standalone-expect
+      await expect(page).toClick('button[aria-label="Shopping provider"]');
+      // eslint-disable-next-line jest/no-standalone-expect
+      await expect(page).toClick('[role="listbox"] li', {
+        text: 'WooCommerce',
+      });
+
+      // eslint-disable-next-line jest/no-standalone-expect
+      await expect(page).toMatch('Setting saved.');
+    });
+
     describe('Schema Validation', () => {
       it('should match a valid schema', async () => {
         await createNewStory();