Run webdriverIO typescript tests using githubActions

GithubActions is a CI/CD platform to automate build, test and deploy.

We need to create workflows to trigger using githubActions, the trigger can happen on adhoc, on push to a specific branch or when someone raised a pull-request.

Workflows are represented as yml / yaml file with one or more jobs in each workflow reside inside .github/workflows of current repository.

Refer githubActions workflow to know more about the terms used.

Let’s use githubActions workflow to create pipeline to do pre setup and run the webdriverIO tests.

let’s understand the steps to run the tests (think of manual steps) –

• Checkout / Pull the wdio project from github
• Install nodeJS
• Install dependencies
• Run the tests using wdio command
• Report creation

Let’s try to replicate the steps in githubActions –

1st let’s consider this wdio project

Clone the project to your local system and create a workflow with CI.yml file under .github/workflows directory in our current project

CI.yml

name: CI
#on: [push, pull_request] #applicable to any branch 
on:
  push:
    branches:
      - main
  pull_request:
    # Sequence of patterns matched against refs/heads
    branches:    
      - main
jobs:
  build:
    runs-on: ubuntu-latest
    steps:
        - name: Checkout
          uses: actions/checkout@v3
        - uses: actions/setup-node@v3
          with:
            node-version: 18
        - name: Install
          run: npm install
        - name: Test
          run: npm run wdio
          continue-on-error: true
        - uses: actions/upload-artifact@v3
          with:
            name: allureReport
            path: ./reports/allure/allure-report

Explanation –

on: specifies how to trigger this workflow

It can be manual trigger / on push / on pull-request to a specific branch or any branch.

You can also specify list of branches on which it trigger the workflow, example –

name: CI
#on: [push, pull_request] #applicable to any branch 
on:
  push:
    branches:
      - main
      - e2e_dev
      - regression

one file can have 1 or multiple jobs that will run in parallel by default, but we can customise to run in sequence (out of scope for this post), we will look into single job i.e build

runs-on – this specifies which OS image from github hosted runners

A job can have multiple steps with

name – provide any name to your step

uses – the actual action to perform, github provides a marketplace to chose the actions for the steps to perform.
Each actions are like methods which has specific uses and can accept parameters.

Example –

  - uses: actions/setup-node@v3
          with:
            node-version: 18

setup-node@v3 accepts node-version as parameter to install specific version of nodeJS.

run: npm run wdio

This command actually runs the wdio tests, fetches the tests from config file path specified in package.json script section.

In between steps, we can add conditions as well like continue-on-error which tells to run next steps even the current step throws any error.

uses: actions/upload-artifact@v3

This above action helps to publish the artifact with the files/folders specified under path

Here we are capturing the reports directory which created after running the tests.

Now that we are ready with the workflow file, let’s push the changes to the github repo.

Upon push, it will trigger the actions and can be viewed under github repo > Actions tab

You can click on each runs, and get the steps, in our case it’s build and artifacts

Now click on the build to see details of the actions performed along with console output of the test run.

Hope this helps!