Update E2E documentation for Playwright

[allie500]

Fixes #10334

Changes proposed in this Pull Request

This PR updates the E2E documentation to reflect our recently completed migration from Puppeteer to Playwright. It also removes the Readme file that was located in tests/e2e-pw. This is a documentation update only so there are no tests included in this PR.

Testing instructions

• Review the updated README file for accuracy and readability.

---

• Run npm run changelog to add a changelog file, choose patch to leave it empty if the change is not significant. You can add multiple changelog files in one PR by running this command a few times.
• Covered with tests (or have a good reason not to test in description ☝️)
• Tested on mobile (or does not apply)

Post merge

• Link to testing instructions from release testing doc following these instructions : Add link here / 'QA Testing Not Applicable'
• Add or update critical flows and testing instructions for critical flows, if applicable.
• Add what's changed (description, screenshot, demo videos etc.) to the release announcement post, if applicable.

[botwoo]

Test the build

Option 1. Jetpack Beta

• Install and activate Jetpack Beta.
• Use this build by searching for PR number 10354 or branch name dev/10334-update-playwright-e2e-docs in your-test.site/wp-admin/admin.php?page=jetpack-beta&plugin=woocommerce-payments

Option 2. Jurassic Ninja - available for logged-in A12s

🚀 Launch a JN site with this branch 🚀

ℹ️ Install this Tampermonkey script to get more options.

---

Build info:

• Latest commit: 6fe56ea
• Build time: 2025-02-13 19:17:36 UTC

Note: the build is updated when a new commit is pushed to this PR.

[github-actions]

Size Change: 0 B

Total Size: 1.29 MB

ℹ️ View Unchanged

Filename	Size
release/woocommerce-payments/assets/css/admin.css	1.38 kB
release/woocommerce-payments/assets/css/admin.rtl.css	1.38 kB
release/woocommerce-payments/assets/css/success.css	189 B
release/woocommerce-payments/assets/css/success.rtl.css	190 B
release/woocommerce-payments/dist/blocks-checkout-rtl.css	2.67 kB
release/woocommerce-payments/dist/blocks-checkout.css	2.67 kB
release/woocommerce-payments/dist/blocks-checkout.js	55.3 kB
release/woocommerce-payments/dist/cart-block.js	17.2 kB
release/woocommerce-payments/dist/cart.js	5.73 kB
release/woocommerce-payments/dist/checkout-rtl.css	1.28 kB
release/woocommerce-payments/dist/checkout.css	1.28 kB
release/woocommerce-payments/dist/checkout.js	34.6 kB
release/woocommerce-payments/dist/express-checkout-rtl.css	236 B
release/woocommerce-payments/dist/express-checkout.css	236 B
release/woocommerce-payments/dist/express-checkout.js	15.7 kB
release/woocommerce-payments/dist/frontend-tracks.js	854 B
release/woocommerce-payments/dist/index-rtl.css	35.5 kB
release/woocommerce-payments/dist/index.css	35.5 kB
release/woocommerce-payments/dist/index.js	233 kB
release/woocommerce-payments/dist/multi-currency-analytics.js	1.08 kB
release/woocommerce-payments/dist/multi-currency-rtl.css	4.29 kB
release/woocommerce-payments/dist/multi-currency-switcher-block.js	61.1 kB
release/woocommerce-payments/dist/multi-currency.css	4.29 kB
release/woocommerce-payments/dist/multi-currency.js	59.1 kB
release/woocommerce-payments/dist/order-rtl.css	740 B
release/woocommerce-payments/dist/order.css	740 B
release/woocommerce-payments/dist/order.js	42.5 kB
release/woocommerce-payments/dist/payment-gateways-rtl.css	1.34 kB
release/woocommerce-payments/dist/payment-gateways.css	1.34 kB
release/woocommerce-payments/dist/payment-gateways.js	40.1 kB
release/woocommerce-payments/dist/plugins-page-rtl.css	386 B
release/woocommerce-payments/dist/plugins-page.css	386 B
release/woocommerce-payments/dist/plugins-page.js	20.1 kB
release/woocommerce-payments/dist/product-details-rtl.css	433 B
release/woocommerce-payments/dist/product-details.css	436 B
release/woocommerce-payments/dist/product-details.js	12.5 kB
release/woocommerce-payments/dist/settings-rtl.css	12 kB
release/woocommerce-payments/dist/settings.css	11.9 kB
release/woocommerce-payments/dist/settings.js	229 kB
release/woocommerce-payments/dist/subscription-edit-page.js	703 B
release/woocommerce-payments/dist/subscription-product-onboarding-modal-rtl.css	524 B
release/woocommerce-payments/dist/subscription-product-onboarding-modal.css	524 B
release/woocommerce-payments/dist/subscription-product-onboarding-modal.js	20.2 kB
release/woocommerce-payments/dist/subscription-product-onboarding-toast.js	730 B
release/woocommerce-payments/dist/subscriptions-empty-state-rtl.css	120 B
release/woocommerce-payments/dist/subscriptions-empty-state.css	120 B
release/woocommerce-payments/dist/subscriptions-empty-state.js	19.3 kB
release/woocommerce-payments/dist/tokenized-express-checkout-rtl.css	236 B
release/woocommerce-payments/dist/tokenized-express-checkout.css	236 B
release/woocommerce-payments/dist/tokenized-express-checkout.js	16.7 kB
release/woocommerce-payments/dist/tos-rtl.css	235 B
release/woocommerce-payments/dist/tos.css	235 B
release/woocommerce-payments/dist/tos.js	21.8 kB
release/woocommerce-payments/dist/woopay-direct-checkout.js	6.13 kB
release/woocommerce-payments/dist/woopay-express-button.js	23.3 kB
release/woocommerce-payments/dist/woopay-rtl.css	4.31 kB
release/woocommerce-payments/dist/woopay.css	4.28 kB
release/woocommerce-payments/dist/woopay.js	71 kB
release/woocommerce-payments/includes/subscriptions/assets/css/plugin-page.css	625 B
release/woocommerce-payments/includes/subscriptions/assets/js/plugin-page.js	814 B
release/woocommerce-payments/vendor/automattic/jetpack-assets/build/i18n-loader.js	2.46 kB
release/woocommerce-payments/vendor/automattic/jetpack-assets/build/jetpack-script-data.js	772 B
release/woocommerce-payments/vendor/automattic/jetpack-assets/src/js/i18n-loader.js	1.02 kB
release/woocommerce-payments/vendor/automattic/jetpack-assets/src/js/script-data.js	69 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/babel.config.js	163 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/identity-crisis.css	2.47 kB
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/identity-crisis.js	14.2 kB
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/identity-crisis.rtl.css	2.47 kB
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-connection.css	10 kB
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-connection.js	28.4 kB
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-connection.rtl.css	10 kB
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-sso-admin-create-user.css	198 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-sso-admin-create-user.js	280 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-sso-admin-create-user.rtl.css	198 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-sso-login.css	625 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-sso-login.js	333 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-sso-login.rtl.css	626 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-sso-users.js	424 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/tracks-ajax.js	521 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/tracks-callables.js	585 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/src/sso/jetpack-sso-admin-create-user.css	215 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/src/sso/jetpack-sso-admin-create-user.js	521 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/src/sso/jetpack-sso-login.css	721 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/src/sso/jetpack-sso-login.js	412 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/src/sso/jetpack-sso-users.js	632 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/about.css	1.04 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/admin-empty-state.css	294 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/admin-order-statuses.css	408 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/admin.css	3.59 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/checkout.css	301 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/modal.css	746 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/view-subscription.css	574 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/wcs-upgrade.css	414 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/admin-pointers.js	543 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/admin.js	9.4 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/jstz.js	6.78 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/jstz.min.js	3.84 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/meta-boxes-coupon.js	545 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/meta-boxes-subscription.js	2.52 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/moment.js	22.2 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/moment.min.js	11.7 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/payment-method-restrictions.js	1.29 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/wcs-meta-boxes-order.js	507 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/frontend/payment-methods.js	358 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/frontend/single-product.js	428 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/frontend/view-subscription.js	1.38 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/frontend/wcs-cart.js	782 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/modal.js	1.09 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/wcs-upgrade.js	1.26 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/build/index.css	391 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/build/index.js	3.04 kB

_{compressed-size-action}

[eduardoumpierre]

The changes in the README are looking very good! I left a comment about the "running tests in group" section since I'm not being able to get the env variables set only by running the commands.

[eduardoumpierre]

The changes are looking good. Thanks for updating the E2E documentation! Let's 🚢 it!

[alopezari]

Hi @allie500, @eduardoumpierre!

While reviewing this PR, I missed that we still define the @woocommerce/e2e-environment and @woocommerce/e2e-utils packages as a devDependency in our package.json. However, it seems we no longer use them, as they provide resources for the Jest-Puppeteer setup.

Can we safely remove them?

[alopezari]

Btw thanks for adding that FAQ, @allie500! That's a great idea.

[eduardoumpierre]

Hey @alopezari! We left the @woocommerce/e2e-environment dependency because we were planning to add the same implementation for the Slack integration we had with Puppeteer. It was added on #10362. Could you please check it?

[alopezari]

Thanks @eduardoumpierre!

Nothing pending from my side then in this PR, I shared my thoughts on the e2e-environment dependency in #10362 👍

[allie500]

Btw thanks for adding that FAQ, @allie500! That's a great idea.

Thanks, @alopezari. I copied it over from the old Playwright (tests/e2e-pw) Readme file. After that all I needed to do was update the last answer.