screener-circleci-jekyll

screener-circleci-jekyll

Download

screener-circleci-jekyll

Overview

This repo includes a CircleCI configuration that:

  • Sets up a sample Jekyll website.
  • Installs the jekyll-sitemap plugin to auto-generate sitemap.xml.
  • Runs Jekyll server on default port 4000.
  • Use xip.io dynamic DNS service to create hostname that includes Git Branch name.
  • Starts a Screener Tunnel that exposes CI server to Screener Cloud browsers.
  • Runs a Screener test that crawls the Jekyll site's sitemap.xml file, automatically capturing a snapshot of each url in the sitemap.
  • Separate snapshots by Git Branch in order to differentiate regressions found in multiple feature branches / PRs.

How To Run

Create Test in Screener

In Screener Dashboard:

  1. Create New Test Group:

  1. Add a Browser:

    • Click + Browser to open the Browser dialog.
    • Then click "Save" to add the default Chrome browser and resolution.

  2. Add path to Sitemap:

    • Click Pages to open the Pages Dialog.
    • Add the path /sitemap.xml to pages. (Screener will automatically prefix this path with the Base Url)
    • Then click "Save".

Note: Alternatively, you can add individual page paths to Screener instead of including the sitemap.xml.

Add Environment Variables

The following Environment Variables need to be added to your CircleCI project:

  • SCREENER_API_KEY
  • SCREENER_GROUP_ID

Both these values can be copied from your Screener Dashboard.

Push Code

Push code to Github to run tests in CircleCI.

When pushing to a specific Git Branch, snapshots for that branch will be labelled in the Dashboard with the branch name.

When tests are complete, you can view the results in Screener (see screenshots below). If regressions are found, Screener will notify you (via email and/or Slack).

Test Results in Dashboard.

List of Test Snapshots.

minimalacademicresumeportfoliodocumentationwikitailwindbootstrapdarkecommercegithub-pagesblog