Update readme

README.md

@@ -73,6 +73,8 @@ Enable xdebug via `$ ddev xdebug`, and press `Start Listening for PHP Debug Conn
 After creating the server in the PHPStorm dialog, you need to set the local project path for the server plugin path.
 It should look [like this](https://i.imgur.com/ofsF1Mc.png).
 
+See [tests/playwright](tests/playwright) for e2e (browser-based) tests.
+
 ## Test account setup
 
 You will need a PayPal sandbox merchant and customer accounts to configure the plugin and make test purchases with it.

package.json

@@ -43,10 +43,9 @@
     "ddev:composer-update": "ddev composer update && ddev composer update --lock",
     "ddev:unit-tests": "ddev exec phpunit",
     "ddev:e2e-tests": "cp -n .env.e2e.example .env.e2e && ddev php tests/e2e/PHPUnit/setup.php && ddev exec phpunit -c tests/e2e/phpunit.xml.dist",
-    "ddev:pw-install": "ddev exec npx playwright install --with-deps",
-    "ddev:pw-tests-ci": "ddev exec npx playwright test --grep @ci",
-    "ddev:pw-tests-headed": "ddev exec npx playwright test --headed",
-    "ddev:test": "yarn run ddev:unit-tests && yarn run ddev:e2e-tests && yarn run ddev:pw-tests-ci",
+    "ddev:pw-install": "ddev yarn playwright install --with-deps",
+    "ddev:pw-tests": "ddev yarn playwright test",
+    "ddev:test": "yarn run ddev:unit-tests && yarn run ddev:e2e-tests && yarn run ddev:pw-tests",
     "ddev:lint": "yarn ddev:phpcs && yarn ddev:psalm",
     "ddev:phpcs": "ddev exec phpcs --parallel=8 -s",
     "ddev:psalm": "ddev exec psalm --show-info=false --threads=8 --diff",
@@ -54,6 +53,9 @@
     "ddev:xdebug-on": "ddev xdebug",
     "ddev:xdebug-off": "ddev xdebug",
     "ddev:build-package": "ddev yarn build",
+    "pw-install": "yarn playwright install --with-deps",
+    "pw-tests": "yarn playwright test",
+    "pw-tests-headed": "yarn playwright test --headed",
     "prebuild": "rm -rf ./vendor && find . -name 'node_modules' -type d -maxdepth 3 -exec rm -rf {} +",
     "build": "composer install --no-dev && yarn install && yarn run archive",
     "prearchive": "rm -rf $npm_package_name.zip",

tests/playwright/README.md

@@ -1,15 +1,40 @@
 # Playwright Testing
 
-## Local Environment Variables
-Allows using environment variables inside the tests.
+## Set Environment Variables
 
-- Duplicate `.env.e2e.example` and rename it as `.env.e2e`, set values and add new variables if needed.
+Duplicate [.env.e2e.example](/.env.e2e.example) and rename it to `.env.e2e`, set the values needed for the tests, like account credentials, card numbers.
+
+## Install Playwright dependencies (browsers)
+
+```
+$ yarn ddev:pw-install
+```
 
 ## Run Tests
 ```
-$ npx playwright test
-$ npx playwright test --grep @ci
-$ npx playwright test example.spec.js --headed
-$ npx playwright test example.spec.js --debug
-$ npx playwright test -g "Test name here"
+$ yarn ddev:pw-tests
 ```
+
+You can also choose which tests to run filtering by name
+```
+$ yarn ddev:pw-tests --grep "Test name or part of the name"
+```
+
+Or run without the headless mode (show the browser)
+```
+$ yarn pw-tests-headed
+```
+
+Or run with [the test debugger](https://playwright.dev/docs/debug)
+```
+$ yarn playwright test --debug
+```
+
+For the headed/debug mode (currently works only outside DDEV) you may need to re-install the deps if you are not on Linux.
+
+```
+$ yarn pw-install
+```
+
+---
+See [Playwright docs](https://playwright.dev/docs/intro) for more info.

tests/playwright/place-order.spec.js

@@ -72,7 +72,7 @@ test('PayPal button place order from Product page', async ({page}) => {
     await expect(title).toHaveText('Order received');
 });
 
-test('Advanced Credit and Debit Card (ACDC) place order from Checkout page @ci', async ({page}) => {
+test('Advanced Credit and Debit Card (ACDC) place order from Checkout page', async ({page}) => {
 
     await page.goto(PRODUCT_URL);
     await page.locator('.single_add_to_cart_button').click();