Running Playwright Tests with Multiple Test Types and Browsers in GitHub Actions

Introduction

When working with Playwright and GitHub Actions, one common challenge is dynamically selecting multiple test types (e.g., smoke, regression, functional) and multiple browsers (e.g., Chrome, Firefox, WebKit, Edge) in a single workflow execution. While GitHub Actions provides dropdown selections for single values, it doesn’t natively support multi-select options.

In this article, I’ll share a practical approach to achieve this using comma-separated inputs and dynamic test execution.

Problem Statement

By default, GitHub Actions inputs are designed for single-value selections, making it difficult to run tests dynamically across multiple configurations without modifying the workflow manually.

For example, if you want to run smoke and regression tests across Chrome and Firefox, there’s no built-in way to select multiple options in a workflow dispatch event.

Solution: Using Comma-Separated Inputs

By leveraging GitHub Actions workflow inputs, we can create a flexible Playwright test execution system.

• We can define TEST_TYPE and BROWSERS as comma-separated input values in our GitHub Actions workflow.

Step 1: Define Workflow Inputs

on:
  workflow_dispatch:
    inputs:
      TEST_TYPE:
        description: "Select test types (comma-separated)"
        required: true
        default: "smoke,regression,functional"
      
      BROWSERS:
        description: "Select browsers (comma-separated)"
        required: true
        default: "edge,chrome,firefox,webkit"

This allows users to enter values like smoke,regression for test types and chrome,firefox for browsers.

Step 2: Process the Inputs and Construct Commands

Next, we dynamically generate the Playwright test command based on user selections:

- name: Setup the Test Command
       id: test-command
       run: |
         TEST_TAGS=$(echo "${{ github.event.inputs.TEST_TYPE }}" | tr ',' '|')  # Convert to regex
         BROWSERS=$(echo "${{ github.event.inputs.BROWSERS }}" | tr ',' ' ')

         CMD="npx playwright test"
         # Add test type filters if provided
         if [ -n "$TEST_TAGS" ]; then
           CMD="$CMD --grep '$TEST_TAGS'"
         fi
         # Add browser filters if provided
         for BROWSER in $BROWSERS; do
           CMD="$CMD --project=$BROWSER"
         done
         echo "Final test command: $CMD"
         echo "COMMAND=$CMD" >> $GITHUB_ENV
     - name: Run Playwright tests
       run: $COMMAND

Benefits of This Approach

✅ Supports multiple test types and browsers dynamically. ✅ No need to hardcode values in the workflow. ✅ Allows testers to trigger tests efficiently via GitHub Actions UI. ✅ Works well with Playwright’s tagging mechanism (@smoke, @regression).

Conclusion

This approach enables running Playwright tests with multiple test types and browsers in GitHub Actions without complex modifications. It provides flexibility and improves test automation efficiency.