DEV Community

loading...
Cover image for AI-powered visual regression testing with Applitools and GitHub Actions
GitHub

AI-powered visual regression testing with Applitools and GitHub Actions

bdougieyo profile image Brian Douglas ・1 min read

Applitools provides several SDKs that allow you to integrate them into your existing workflow easily. Using tools like Cypress, Espresso, Selenium, Appium, and a wide variety of others, web and native platforms can get automated visual testing coverage with the power of Applitools Eyes.

GitHub logo colbyfayock / applitools-eyes-action

GitHub Action to add automated, AI-powered Visual Testing to your app

Applitools Eyes GitHub Action

Instantly add AI-powered visual regression testing to your site with Applitools Eyes and GitHub Actions.

Not officially supported by Applitools

Getting Started

Include the package as a step directly in an Action Workflow:

steps
- uses: colbyfayock/applitools-eyes-action@main
  with
    APPLITOOLS_API_KEY: ${{secrets.APPLITOOLS_API_KEY}}
    baseUrl: https://demo.applitools.com/

The action requires 2 parameters to work:

  • APPLITOOLS_API_KEY: your Applitools API Key (recommend to be stored in a GitHub secret)
  • baseUrl: the URL of the website or web app that you want to test

What's Inside

This Action relies on 3 core pieces to provide visual testing coverage to a website or web app:

Cypress is used as the test runner, providing the ability to spin up an instance of Chrome (or other configured browser) to run visual regression testing.

Sitemap Generator is used to crawl the website (baseUrl), providing a sitemap of pages to test…

GitHub Actions allows you to automate, customize and execute your software development workflows inside your repository.

You can configure your workflows to run when specific activity on GitHub happens, at a scheduled time, or when an event outside of GitHub occurs.

With the applitools-eyes-action you can identify visual changes at the time of PR using this in your workflows. This is beneficial for folks making visual changes to the UI and ensuring specific elements are not removed or broken.

Demo

Watch @colbyfayock explain how to instantly add AI-powered visual regression testing to your site with Applitools Eyes and GitHub Actions.

Open Source Fridays

Come along to our Open Source Friday live streams. We go live on the GitHub Twitch Channel most Fridays. Join the Meetup Group to stay up to date and see the topics each week.

Discussion (0)

pic
Editor guide