Low Code testing with Playwright - 1. Intro Exercise (15 min)

Exercise 1.  Install and setup you first Playwright Test

1. Verify VS Code is installed 

2. Ensure the Microsoft Playwright Extension is installed (use the default language TypeScript)

 

3. Create a folder using Windows Explorer as shown here: C:\Users\paulb\source\repos\Playwright\Mendix

4. Open the folder in VS Code and ensure the project is initialised C:\Users\paulb\source\repos\Playwright\Mendix> npm init playwright@latest --yes -- --quiet --browser=chromium --browser=webkit

5. Verify your screen looks similar to this...

Exercise 2.  Record and run your first Playwright test

1. On the "Testing" area, select "Record new"

2. The recorder opens, type in a url in my case I used "https://www.paulbeck.co.uk"

3. Click and assert text exists on the page

4. Stop the recorder and close the browser.

5. Run the test, as shown below, validate the result

Playwright Series

Playwright Post 1 - Overview of E2E testing using Playwright 

Playwright Post 2 - Continuously Test/Monitor Canvas apps and website with MFA enabled 

Playwright Post 3 - Add App Insights logging inside your Playwright tests 

Playwright Series - Post 4 - 6 Min walkthru of Playwright testing with Azure Monitor (this post)

Playwright Post 5 - Understanding how playwright works