From afac2aefab4c3c84c49994a9ace465f32e37ff86 Mon Sep 17 00:00:00 2001 From: zhongruige Date: Wed, 3 Mar 2021 09:45:16 -0700 Subject: [PATCH 1/6] Added etests around merchant email flows --- tests/e2e/core-tests/specs/index.js | 3 + .../merchant/wp-admin-order-emails.test.js | 73 +++++++++++++++++++ tests/e2e/docker/initialize.sh | 3 + tests/e2e/specs/wp-admin/test-order-emails.js | 6 ++ tests/e2e/utils/src/components.js | 38 +++++++++- tests/e2e/utils/src/flows/merchant.js | 6 ++ tests/e2e/utils/src/page-utils.js | 16 ++++ 7 files changed, 144 insertions(+), 1 deletion(-) create mode 100644 tests/e2e/core-tests/specs/merchant/wp-admin-order-emails.test.js create mode 100644 tests/e2e/specs/wp-admin/test-order-emails.js diff --git a/tests/e2e/core-tests/specs/index.js b/tests/e2e/core-tests/specs/index.js index 19d00828394..e793947a483 100644 --- a/tests/e2e/core-tests/specs/index.js +++ b/tests/e2e/core-tests/specs/index.js @@ -31,6 +31,7 @@ const runOrderApplyCouponTest = require( './merchant/wp-admin-order-apply-coupon const runProductEditDetailsTest = require( './merchant/wp-admin-product-edit-details.test' ); const runProductSearchTest = require( './merchant/wp-admin-product-search.test' ); const runMerchantOrdersCustomerPaymentPage = require( './merchant/wp-admin-order-customer-payment-page.test' ); +const runMerchantOrderEmailsTest = require( './merchant/wp-admin-order-emails.test' ); // REST API tests const runExternalProductAPITest = require( './api/external-product.test' ); @@ -69,6 +70,7 @@ const runMerchantTests = () => { runProductEditDetailsTest(); runProductSearchTest(); runMerchantOrdersCustomerPaymentPage(); + runMerchantOrderEmailsTest(); } const runApiTests = () => { @@ -107,6 +109,7 @@ module.exports = { runProductEditDetailsTest, runProductSearchTest, runMerchantOrdersCustomerPaymentPage, + runMerchantOrderEmailsTest, runMerchantTests, runApiTests, }; diff --git a/tests/e2e/core-tests/specs/merchant/wp-admin-order-emails.test.js b/tests/e2e/core-tests/specs/merchant/wp-admin-order-emails.test.js new file mode 100644 index 00000000000..d2d29076808 --- /dev/null +++ b/tests/e2e/core-tests/specs/merchant/wp-admin-order-emails.test.js @@ -0,0 +1,73 @@ +/* eslint-disable jest/no-export, jest/no-disabled-tests, jest/no-standalone-expect */ +/** + * Internal dependencies + */ +const { + merchant, + updateOrder, + createSimpleOrder, + selectOrderAction, + deleteAllEmailLogs, +} = require( '@woocommerce/e2e-utils' ); + +const config = require( 'config' ); +const simpleProductName = config.get( 'products.simple.name' ); +const customerEmail = config.get( 'addresses.customer.billing.email' ); +const adminEmail = 'admin@woocommercecoree2etestsuite.com'; +const storeName = 'WooCommerce Core E2E Test Suite'; + +let orderId; + +const runMerchantOrderEmailsTest = () => { + + describe('Merchant > Order Action emails received', () => { + beforeAll( async () => { + await merchant.login(); + + // Clear out the existing email logs if any + await deleteAllEmailLogs(); + + orderId = await createSimpleOrder( 'Processing' ); + + await Promise.all( [ + // Select the billing email address field and add the customer billing email from the config + await page.click( 'div.order_data_column:nth-child(2) > h3:nth-child(1) > a:nth-child(1)' ), + await expect( page ).toFill( '#_billing_email', customerEmail ), + await updateOrder( 'Order updated.' ), + ] ); + } ); + + afterEach( async () => { + // Clear out any emails after each test + await deleteAllEmailLogs(); + } ); + + // New order emails are sent automatically when we create the simple order above, so let's verify we get these emails + it('can receive new order email', async () => { + await merchant.openEmailLog(); + await expect( page ).toMatchElement( '.column-receiver', { text: adminEmail } ); + await expect( page ).toMatchElement( '.column-subject', { text: `[${storeName}]: New order #${orderId}` } ); + } ); + + it('can resend new order notification', async () => { + await merchant.goToOrder( orderId ); + await selectOrderAction( 'send_order_details_admin' ); + + await merchant.openEmailLog(); + await expect( page ).toMatchElement( '.column-receiver', { text: adminEmail } ); + await expect( page ).toMatchElement( '.column-subject', { text: `[${storeName}]: New order #${orderId}` } ); + } ); + + it('can email invoice/order details to customer', async () => { + await merchant.goToOrder( orderId ); + await selectOrderAction( 'send_order_details' ); + + await merchant.openEmailLog(); + await expect( page ).toMatchElement( '.column-receiver', { text: customerEmail } ); + await expect( page ).toMatchElement( '.column-subject', { text: `Invoice for order #${orderId} on ${storeName}` } ); + } ); + + } ); +} + +module.exports = runMerchantOrderEmailsTest; diff --git a/tests/e2e/docker/initialize.sh b/tests/e2e/docker/initialize.sh index c5cbea47181..0a9592f5379 100755 --- a/tests/e2e/docker/initialize.sh +++ b/tests/e2e/docker/initialize.sh @@ -8,3 +8,6 @@ wp user create customer customer@woocommercecoree2etestsuite.com --user_pass=pas # we cannot create API keys for the API, so we using basic auth, this plugin allows that. wp plugin install https://github.com/WP-API/Basic-Auth/archive/master.zip --activate + +# install the WP Mail Logging plugin to test emails +wp plugin install wp-mail-logging --activate diff --git a/tests/e2e/specs/wp-admin/test-order-emails.js b/tests/e2e/specs/wp-admin/test-order-emails.js new file mode 100644 index 00000000000..e0597074bda --- /dev/null +++ b/tests/e2e/specs/wp-admin/test-order-emails.js @@ -0,0 +1,6 @@ +/* + * Internal dependencies + */ +const { runMerchantOrderEmailsTest } = require( '@woocommerce/e2e-core-tests' ); + +runMerchantOrderEmailsTest(); diff --git a/tests/e2e/utils/src/components.js b/tests/e2e/utils/src/components.js index 04a7b4a3e02..dbc96765ac1 100644 --- a/tests/e2e/utils/src/components.js +++ b/tests/e2e/utils/src/components.js @@ -6,7 +6,7 @@ * Internal dependencies */ import { merchant } from './flows'; -import { clickTab, uiUnblocked, verifyCheckboxIsUnset, evalAndClick, selectOptionInSelect2 } from './page-utils'; +import { clickTab, uiUnblocked, verifyCheckboxIsUnset, evalAndClick, selectOptionInSelect2, setCheckbox } from './page-utils'; import factories from './factories'; const config = require( 'config' ); @@ -435,6 +435,40 @@ const createCoupon = async ( couponAmount = '5', discountType = 'Fixed cart disc return couponCode; }; +/** + * Update an order. + * + * @param noticeText The text that appears in the notice after updating the order. + */ +const updateOrder = async ( noticeText ) => { + // Wait for auto save + await page.waitFor( 2000 ); + + // PUpdate order + await expect( page ).toClick( 'button.save_order' ); + await page.waitForSelector( '.updated.notice' ); + + // Verify + await expect( page ).toMatchElement( '.updated.notice', { text: noticeText } ); +}; + +/** + * Delete all email logs in the WP Mail Logging plugin page. + */ +const deleteAllEmailLogs = async () => { + await merchant.openEmailLog(); + + // Make sure we have emails to delete. If we don't, this selector will return null. + if ( await page.$( '#bulk-action-selector-top' ) !== null ) { + await setCheckbox( '#cb-select-all-1' ); + await expect( page ).toSelect( '#bulk-action-selector-top', 'Delete' ); + await Promise.all( [ + page.click( '#doaction' ), + page.waitForNavigation( { waitUntil: 'networkidle0' } ), + ] ); + } +}; + export { completeOnboardingWizard, createSimpleProduct, @@ -444,4 +478,6 @@ export { verifyAndPublish, addProductToOrder, createCoupon, + updateOrder, + deleteAllEmailLogs, }; diff --git a/tests/e2e/utils/src/flows/merchant.js b/tests/e2e/utils/src/flows/merchant.js index df4fae99d68..242a42c171d 100644 --- a/tests/e2e/utils/src/flows/merchant.js +++ b/tests/e2e/utils/src/flows/merchant.js @@ -169,6 +169,12 @@ const merchant = { await expect( page ).toMatchElement( 'label[for="customer_user"] a[href*=user-edit]', { text: 'Profile' } ); } }, + + openEmailLog: async () => { + await page.goto( `${baseUrl}wp-admin/tools.php?page=wpml_plugin_log`, { + waitUntil: 'networkidle0', + } ); + } }; module.exports = merchant; diff --git a/tests/e2e/utils/src/page-utils.js b/tests/e2e/utils/src/page-utils.js index 7679c15f2b7..c96ab2f6010 100644 --- a/tests/e2e/utils/src/page-utils.js +++ b/tests/e2e/utils/src/page-utils.js @@ -209,6 +209,21 @@ const selectOptionInSelect2 = async ( value, selector = 'input.select2-search__f await page.keyboard.press('Enter'); }; +/** + * + * Select and perform an order action in the `Order actions` postbox. + * + * @param {string} action The action to take on the order. + */ +const selectOrderAction = async ( action ) => { + await page.select( 'select[name=wc_order_action]', action ); + await Promise.all( [ + page.click( '.wc-reload' ), + page.waitForNavigation( { waitUntil: 'networkidle0' } ), + ] ); +} + + export { clearAndFillInput, clickTab, @@ -225,4 +240,5 @@ export { moveAllItemsToTrash, evalAndClick, selectOptionInSelect2, + selectOrderAction, }; From 4610d5cf162734662e2244f018e00cbadcb4bf8d Mon Sep 17 00:00:00 2001 From: zhongruige Date: Wed, 3 Mar 2021 09:57:11 -0700 Subject: [PATCH 2/6] Updated READMEs and CHANGELOGs --- tests/e2e/core-tests/CHANGELOG.md | 1 + tests/e2e/core-tests/README.md | 1 + tests/e2e/env/CHANGELOG.md | 1 + tests/e2e/utils/CHANGELOG.md | 4 ++++ tests/e2e/utils/README.md | 4 +++- 5 files changed, 10 insertions(+), 1 deletion(-) diff --git a/tests/e2e/core-tests/CHANGELOG.md b/tests/e2e/core-tests/CHANGELOG.md index 9923b9a3111..348fb4c4371 100644 --- a/tests/e2e/core-tests/CHANGELOG.md +++ b/tests/e2e/core-tests/CHANGELOG.md @@ -16,6 +16,7 @@ - Merchant Orders Customer Checkout Page - Shopper Cart Apply Coupon - Shopper Variable product info updates on different variations +- Merchant order emails flow ## Fixed diff --git a/tests/e2e/core-tests/README.md b/tests/e2e/core-tests/README.md index cb16278e222..d744426dbca 100644 --- a/tests/e2e/core-tests/README.md +++ b/tests/e2e/core-tests/README.md @@ -58,6 +58,7 @@ The functions to access the core tests are: - `runProductEditDetailsTest` - Merchant can edit an existing product - `runProductSearchTest` - Merchant can search for a product and view it - `runMerchantOrdersCustomerPaymentPage` - Merchant can visit the customer payment page + - `runMerchantOrderEmailsTest` - Merchant can receive order emails and resend emails by Order Actions ### Shopper diff --git a/tests/e2e/env/CHANGELOG.md b/tests/e2e/env/CHANGELOG.md index 94be2bfd1f8..8e6272ba44b 100644 --- a/tests/e2e/env/CHANGELOG.md +++ b/tests/e2e/env/CHANGELOG.md @@ -11,6 +11,7 @@ - support for custom container name - Insert a 12 hour delay in using new docker image tags - Package `bin` script `wc-e2e` +- WP Mail Log plugin as part of container initialization ## Fixed diff --git a/tests/e2e/utils/CHANGELOG.md b/tests/e2e/utils/CHANGELOG.md index 3bb027f92f7..2457b00d649 100644 --- a/tests/e2e/utils/CHANGELOG.md +++ b/tests/e2e/utils/CHANGELOG.md @@ -17,6 +17,10 @@ - `createCoupon( couponAmount )` component which accepts a coupon amount string (it defaults to 5) and creates a basic coupon. Returns the generated coupon code. - `evalAndClick( selector )` use Puppeteer page.$eval to select and click and element. - `selectOptionInSelect2( selector, value )` util helper method that search and select in any select2 type field +- `selectOrderAction( action )` util helper method to selcct and initiate an order action in the Order Action postbox +- `merchant.openEmailLog()` go to the WP Mail Log page +- `deleteAllEmailLogs` delete all email logs in the WP Mail Log plugin +- `updateOrder()` util helper that clicks the `Update` button on an order ## Changes diff --git a/tests/e2e/utils/README.md b/tests/e2e/utils/README.md index 12f814aa992..540e2f8591d 100644 --- a/tests/e2e/utils/README.md +++ b/tests/e2e/utils/README.md @@ -54,6 +54,7 @@ describe( 'Cart page', () => { | `openSettings` | | Go to WooCommerce -> Settings | | `runSetupWizard` | | Open the onboarding profiler | | `updateOrderStatus` | `orderId, status` | Update the status of an order | +| `openEmailLog` | | Open the WP Mail Log page | ### Shopper `shopper` @@ -101,7 +102,8 @@ describe( 'Cart page', () => { | `clickFilter` | `selector` | Click on a list page filter | | `moveAllItemsToTrash` | | Moves all items in a list view to the Trash | | `verifyAndPublish` | `noticeText` | Verify that an item can be published | -| `selectOptionInSelect2` | `selector, value` | helper method that searchs for select2 type fields and select plus insert value inside +| `selectOptionInSelect2` | `selector, value` | helper method that searches for select2 type fields and select plus insert value inside | +| `selectOrderAction` | `action` | Helper method to select an order action in the `Order Actions` postbox | ### Test Utilities From d6b2a6caddc662f88e7410510b42e8cc5c272044 Mon Sep 17 00:00:00 2001 From: zhongruige Date: Wed, 3 Mar 2021 10:01:31 -0700 Subject: [PATCH 3/6] Fix minor type in changelog --- tests/e2e/utils/CHANGELOG.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/e2e/utils/CHANGELOG.md b/tests/e2e/utils/CHANGELOG.md index 2457b00d649..77ce1b1a3f7 100644 --- a/tests/e2e/utils/CHANGELOG.md +++ b/tests/e2e/utils/CHANGELOG.md @@ -17,7 +17,7 @@ - `createCoupon( couponAmount )` component which accepts a coupon amount string (it defaults to 5) and creates a basic coupon. Returns the generated coupon code. - `evalAndClick( selector )` use Puppeteer page.$eval to select and click and element. - `selectOptionInSelect2( selector, value )` util helper method that search and select in any select2 type field -- `selectOrderAction( action )` util helper method to selcct and initiate an order action in the Order Action postbox +- `selectOrderAction( action )` util helper method to select and initiate an order action in the Order Action postbox - `merchant.openEmailLog()` go to the WP Mail Log page - `deleteAllEmailLogs` delete all email logs in the WP Mail Log plugin - `updateOrder()` util helper that clicks the `Update` button on an order From c960edb786f577ad8b0e66308d24fce14f54c8f5 Mon Sep 17 00:00:00 2001 From: zhongruige Date: Wed, 3 Mar 2021 10:49:06 -0700 Subject: [PATCH 4/6] Code review feedback --- .../core-tests/specs/merchant/wp-admin-order-emails.test.js | 4 ++-- tests/e2e/utils/CHANGELOG.md | 2 +- tests/e2e/utils/README.md | 1 + tests/e2e/utils/src/components.js | 6 +++--- 4 files changed, 7 insertions(+), 6 deletions(-) diff --git a/tests/e2e/core-tests/specs/merchant/wp-admin-order-emails.test.js b/tests/e2e/core-tests/specs/merchant/wp-admin-order-emails.test.js index d2d29076808..ad18a8de6d1 100644 --- a/tests/e2e/core-tests/specs/merchant/wp-admin-order-emails.test.js +++ b/tests/e2e/core-tests/specs/merchant/wp-admin-order-emails.test.js @@ -4,7 +4,7 @@ */ const { merchant, - updateOrder, + clickUpdateOrder, createSimpleOrder, selectOrderAction, deleteAllEmailLogs, @@ -33,7 +33,7 @@ const runMerchantOrderEmailsTest = () => { // Select the billing email address field and add the customer billing email from the config await page.click( 'div.order_data_column:nth-child(2) > h3:nth-child(1) > a:nth-child(1)' ), await expect( page ).toFill( '#_billing_email', customerEmail ), - await updateOrder( 'Order updated.' ), + await clickUpdateOrder( 'Order updated.' ), ] ); } ); diff --git a/tests/e2e/utils/CHANGELOG.md b/tests/e2e/utils/CHANGELOG.md index 77ce1b1a3f7..70d1b5e95c4 100644 --- a/tests/e2e/utils/CHANGELOG.md +++ b/tests/e2e/utils/CHANGELOG.md @@ -20,7 +20,7 @@ - `selectOrderAction( action )` util helper method to select and initiate an order action in the Order Action postbox - `merchant.openEmailLog()` go to the WP Mail Log page - `deleteAllEmailLogs` delete all email logs in the WP Mail Log plugin -- `updateOrder()` util helper that clicks the `Update` button on an order +- `clickUpdateOrder()` util helper that clicks the `Update` button on an order ## Changes diff --git a/tests/e2e/utils/README.md b/tests/e2e/utils/README.md index 540e2f8591d..ec21657a7e8 100644 --- a/tests/e2e/utils/README.md +++ b/tests/e2e/utils/README.md @@ -104,6 +104,7 @@ describe( 'Cart page', () => { | `verifyAndPublish` | `noticeText` | Verify that an item can be published | | `selectOptionInSelect2` | `selector, value` | helper method that searches for select2 type fields and select plus insert value inside | | `selectOrderAction` | `action` | Helper method to select an order action in the `Order Actions` postbox | +| `clickUpdateOrder` | | Helper method to click the Update button on the order details page ### Test Utilities diff --git a/tests/e2e/utils/src/components.js b/tests/e2e/utils/src/components.js index dbc96765ac1..57dff726b28 100644 --- a/tests/e2e/utils/src/components.js +++ b/tests/e2e/utils/src/components.js @@ -436,11 +436,11 @@ const createCoupon = async ( couponAmount = '5', discountType = 'Fixed cart disc }; /** - * Update an order. + * Click the Update button on the order details page. * * @param noticeText The text that appears in the notice after updating the order. */ -const updateOrder = async ( noticeText ) => { +const clickUpdateOrder = async ( noticeText ) => { // Wait for auto save await page.waitFor( 2000 ); @@ -478,6 +478,6 @@ export { verifyAndPublish, addProductToOrder, createCoupon, - updateOrder, + clickUpdateOrder, deleteAllEmailLogs, }; From be47060e86e7a403582e4d4022c389519e8d018f Mon Sep 17 00:00:00 2001 From: zhongruige Date: Wed, 3 Mar 2021 10:52:50 -0700 Subject: [PATCH 5/6] Add flag for clicking to update an order --- tests/e2e/utils/CHANGELOG.md | 2 +- tests/e2e/utils/README.md | 2 +- tests/e2e/utils/src/components.js | 8 +++++--- 3 files changed, 7 insertions(+), 5 deletions(-) diff --git a/tests/e2e/utils/CHANGELOG.md b/tests/e2e/utils/CHANGELOG.md index 70d1b5e95c4..09af6a5f851 100644 --- a/tests/e2e/utils/CHANGELOG.md +++ b/tests/e2e/utils/CHANGELOG.md @@ -20,7 +20,7 @@ - `selectOrderAction( action )` util helper method to select and initiate an order action in the Order Action postbox - `merchant.openEmailLog()` go to the WP Mail Log page - `deleteAllEmailLogs` delete all email logs in the WP Mail Log plugin -- `clickUpdateOrder()` util helper that clicks the `Update` button on an order +- `clickUpdateOrder( noticeText, waitForSave )` util helper that clicks the `Update` button on an order ## Changes diff --git a/tests/e2e/utils/README.md b/tests/e2e/utils/README.md index ec21657a7e8..7871a416ea8 100644 --- a/tests/e2e/utils/README.md +++ b/tests/e2e/utils/README.md @@ -104,7 +104,7 @@ describe( 'Cart page', () => { | `verifyAndPublish` | `noticeText` | Verify that an item can be published | | `selectOptionInSelect2` | `selector, value` | helper method that searches for select2 type fields and select plus insert value inside | | `selectOrderAction` | `action` | Helper method to select an order action in the `Order Actions` postbox | -| `clickUpdateOrder` | | Helper method to click the Update button on the order details page +| `clickUpdateOrder` | `noticeText`, `waitForSave` | Helper method to click the Update button on the order details page ### Test Utilities diff --git a/tests/e2e/utils/src/components.js b/tests/e2e/utils/src/components.js index 57dff726b28..8076ad0bd70 100644 --- a/tests/e2e/utils/src/components.js +++ b/tests/e2e/utils/src/components.js @@ -439,10 +439,12 @@ const createCoupon = async ( couponAmount = '5', discountType = 'Fixed cart disc * Click the Update button on the order details page. * * @param noticeText The text that appears in the notice after updating the order. + * @param waitForSave Optionally wait for auto save. */ -const clickUpdateOrder = async ( noticeText ) => { - // Wait for auto save - await page.waitFor( 2000 ); +const clickUpdateOrder = async ( noticeText, waitForSave = false ) => { + if ( waitForSave ) { + await page.waitFor( 2000 ); + } // PUpdate order await expect( page ).toClick( 'button.save_order' ); From 5bf3e8ed9868762cd84c6cd990352dc1666bbc6c Mon Sep 17 00:00:00 2001 From: zhongruige Date: Thu, 4 Mar 2021 14:17:43 -0700 Subject: [PATCH 6/6] Code review feedback --- tests/e2e/core-tests/specs/index.js | 1 - .../wp-admin/{test-order-emails.js => order-emails.test.js} | 0 2 files changed, 1 deletion(-) rename tests/e2e/specs/wp-admin/{test-order-emails.js => order-emails.test.js} (100%) diff --git a/tests/e2e/core-tests/specs/index.js b/tests/e2e/core-tests/specs/index.js index dc9db031d4c..2a59fed2696 100644 --- a/tests/e2e/core-tests/specs/index.js +++ b/tests/e2e/core-tests/specs/index.js @@ -73,7 +73,6 @@ const runMerchantTests = () => { runProductEditDetailsTest(); runProductSearchTest(); runMerchantOrdersCustomerPaymentPage(); - runMerchantOrderEmailsTest(); } const runApiTests = () => { diff --git a/tests/e2e/specs/wp-admin/test-order-emails.js b/tests/e2e/specs/wp-admin/order-emails.test.js similarity index 100% rename from tests/e2e/specs/wp-admin/test-order-emails.js rename to tests/e2e/specs/wp-admin/order-emails.test.js