dotnet-podcasts/docs/demos/playwright-tests

Testing with Playwright

The .NET Podcast app is set up to automatically run e2e tests using Playwright in GitHub Actions. The URL of the site to test is set via an environment variable BASEURL. In GitHub Actions, this variable is set using the value of WEBAPP_NAME e.g. https://dotnetpodcasts.azurewebsites.net

To run tests locally, you can use the cross-platform CLI, or our VS code extension.

Prerequisites

• Node
• npm

CLI

By default tests will be run on Microsoft Edge. This can be configured in the playwright.config file. Tests are run in headless mode meaning no browser will open up when running the tests. Results of the tests will be shown in the terminal and the HTML report. The HTML report automatically opens if there are are failures.

1. Open your favorite terminal.

2. Set environment variable BASEURL to the url of your site:

   Bash:

   export BASEURL='paste-the-key-value'
   

   PowerShell:

   $env:BASEURL = 'paste-the-key-value'
   

3. Navigate to the tests:

   cd src/Web/E2E/
   

4. Install the package dependencies in your local directory:

   npm install
   

5. Run this command to run all of the Playwright tests:

   npx playwright test 
   

6. Open the HTML report to see more info about the results:

   npx playwright show-report
   

VS Code

1. Install the Playwright Test for VS Code extension from the marketplace.

2. Set the value for BASEURL in playwright.config

   e.g.

     use: {
       baseURL: 'https://dotnetpodcasts.azurewebsites.net',
     },
   

3. Open any of the test spec files in the tests folder.

4. Click the play button on any of the test cases.

View the docs to learn more: https://playwright.dev/docs/next/getting-started-vscode