PHPackages                             rareloop/primer-backstop - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Testing & Quality](/categories/testing)
4. /
5. rareloop/primer-backstop

ActiveLibrary[Testing & Quality](/categories/testing)

rareloop/primer-backstop
========================

Automated regression testing for Primer, using BackstopJS

010PHP

Since Feb 22Pushed 10y agoCompare

[ Source](https://github.com/Rareloop/primer-backstop)[ Packagist](https://packagist.org/packages/rareloop/primer-backstop)[ RSS](/packages/rareloop-primer-backstop/feed)WikiDiscussions master Synced 4w ago

READMEChangelogDependenciesVersions (1)Used By (0)

Primer Backstop
===============

[](#primer-backstop)

A module for [Primer](https://github.com/Rareloop/primer) that provides simple visual regression testing using [BackstopJS](https://github.com/garris/BackstopJS).

Pre-requisites
--------------

[](#pre-requisites)

BackstopJS requires a few NPM modules to be installed globally:

```
sudo npm install -g gulp
sudo npm install -g phantomjs
sudo npm install -g casperjs

```

*This module assumes you're using a Unix based system (e.g. Linux, Mac OS X). It hasn't been tested on Windows but almost certainly won't work without some tweaking!*

Installation
------------

[](#installation)

Add the following to your `composer.json` object:

```
"rareloop/primer-backstop": "dev-master"
```

We also need to install some non PHP dependencies so add the following to your `composer.json`:

```
"scripts": {
    "post-install-cmd": [
        "cd vendor/rareloop/primer-backstop && npm install"
    ],

    "post-update-cmd": [
        "cd vendor/rareloop/primer-backstop && npm install"
    ]
}
```

Update your dependencies:

```
composer update

```

Usage
-----

[](#usage)

Once installed you'll need to add some commands to Primer. Edit your `bootstrap/start.php` and add the following:

```
Event::listen('cli.init', function ($cli) {
    $cli->add(new \Rareloop\Primer\Backstop\Commands\ConfigCommand);
    $cli->add(new \Rareloop\Primer\Backstop\Commands\ReferenceCommand);
    $cli->add(new \Rareloop\Primer\Backstop\Commands\TestCommand);
});
```

This will add 3 commands to the Primer CLI.

### Configuration

[](#configuration)

```
php primer backstop:config

```

This will create a file in the root of your project called `backstop.config.js`. Edit this file to update the viewports you wish to test.

### Reference Images

[](#reference-images)

```
php primer backstop:reference

```

This creates reference images for all elements and components at each viewport size and stores them in `backstop/bitmaps_reference`. These images are the baseline images that future tests will be run against.

By default reference images will be created for all your `elements` and `components`. You can change this by adding which sections you want to test to the CLI, e.g.

```
# Test templates and components but not elements
php primer backstop:reference --templates --components

```

### Run Test

[](#run-test)

```
php primer backstop:test

```

This creates reference images for all elements and components at each viewport size and compares them against the reference images already created. Depending on the settings in `backstop.config.js` this will present a report via the CLI and/or open a browser for more visual feedback.

###  Health Score

20

—

LowBetter than 13% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity5

Limited adoption so far

Community6

Small or concentrated contributor base

Maturity41

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

### Community

Maintainers

![](https://avatars.githubusercontent.com/u/1554376?v=4)[Rareloop](/maintainers/rareloop)[@Rareloop](https://github.com/Rareloop)

---

Top Contributors

[![joelambert](https://avatars.githubusercontent.com/u/644362?v=4)](https://github.com/joelambert "joelambert (12 commits)")

### Embed Badge

![Health badge](/badges/rareloop-primer-backstop/health.svg)

```
[![Health](https://phpackages.com/badges/rareloop-primer-backstop/health.svg)](https://phpackages.com/packages/rareloop-primer-backstop)
```

###  Alternatives

[dms/phpunit-arraysubset-asserts

This package provides ArraySubset and related asserts once deprecated in PHPUnit 8

14228.7M341](/packages/dms-phpunit-arraysubset-asserts)[phpbenchmark/phpbenchmark

Easy to use benchmark toolkit for your PHP-application. This library contains classes for comparing algorithms as well as benchmarking application responses

8011.5k2](/packages/phpbenchmark-phpbenchmark)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)