Playwright End to End Tests in GitLab CI with .Net project

Banner Image

Playwright is a great tool to test your application, but how to run your tests from your Gitlab CI environment with a .Net test project ?

1- Create your .Net test project

With Nunit Or MsTest :

dotnet new nunit -n PlaywrightTests 
dotnet add package Microsoft.Playwright.NUnit

dotnet new mstest -n PlaywrightTests
dotnet add package Microsoft.Playwright.MSTest

Then, add the JunitXml.TestLogger package

It will be used later to generate your xml rapport

dotnet add package JunitXml.TestLogger

Write your first test like :

namespace PlaywrightTests;

[TestClass]
public class TitleShouldContainsPlaywright : PageTest
{
    [TestMethod]
    public async Task Apply_On_Carreer_Site()
    {
        await Page.GotoAsync("https://playwright.dev");

        await Expect(Page).ToHaveTitleAsync(new Regex("Playwright"));
    }
}

2- Write your GitLab pipeline

playwright-e2e-tests:
  stage: test
  image: mcr.microsoft.com/playwright/dotnet:v1.38.0-jammy
  variables:
    CSPROJ_FILE_PATH: "./PlaywrightTests/PlaywrightTests.csproj"
  script:
    - curl -sSL https://dot.net/v1/dotnet-install.sh | bash /dev/stdin --version 7.0.401 --install-dir /usr/share/dotnet
    - dotnet tool install --global PowerShell
    - dotnet tool install --global Microsoft.Playwright.CLI
    - dotnet restore $CSPROJ_FILE_PATH
    - dotnet build $CSPROJ_FILE_PATH -c Release --no-restore
    - pwsh ./PlaywrightTests/bin/Release/net7.0/playwright.ps1 install --with-deps
    - 'dotnet test $CSPROJ_FILE_PATH -c Release --logger:"junit;LogFilePath=..\artifacts\{assembly}-test-result.xml;MethodFormat=Class;FailureBodyFormat=Verbose"'
  artifacts:
    when: always
    reports:
      junit:
        - ./**/*test-result.xml
    expire_in: 4 days  
  only:
    refs:
      - merge_requests
  when: manual

Details, pipeline explained :

Download Playwright container :

image: mcr.microsoft.com/playwright/dotnet:v1.38.0-jammy

Download .Net 7, only .Net 6 is supported (at the moment I write this article)

- curl -sSL https://dot.net/v1/dotnet-install.sh | bash /dev/stdin --version 7.0.401 --install-dir /usr/share/dotnet

Setup powerShell in order to setup Playwright :

- dotnet tool install --global PowerShell
- dotnet tool install --global Microsoft.Playwright.CLI

Run your test with Junit output in order to user GitLab results :

- 'dotnet test $CSPROJ_FILE_PATH -c Release --logger:"junit;LogFilePath=..\artifacts\{assembly}-test-result.xml;MethodFormat=Class;FailureBodyFormat=Verbose"'

Your pipeline is Ready 🚀 :

Go back to your Merge Request, you can see your test summary:

Happy test !

Commentaires :