You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
-*Grunt fans* -- check out [grunt-backstop](https://github.com/ddluc/grunt-backstop) and this [very nicely written article by Joe Watkins](http://joe-watkins.io/css-visual-regression-testing-with-grunt-backstopjs/)
67
68
68
69
69
-
BackstopJS brochure at [http://BackstopJS.org/](http://garris.github.io/BackstopJS/).
70
+
-BackstopJS brochure at [http://BackstopJS.org/](http://garris.github.io/BackstopJS/).
70
71
71
-
72
-
73
-
##Heres how it works:
72
+
## The BackstopJS workflow
74
73
75
74
1. Set up a test config file: specify screen sizes and DOM selectors.
76
75
2. Use BackstopJS to create reference screenshots.
77
76
3. Make some changes to your CSS or add new DOM components.
78
77
4. Run a test. BackstopJS creates a set of *test* screenshots and compares them with the *reference screenshots* you made in step 2 above. Any unwanted/unforeseen changes show up in a nice report.
79
78
80
79
81
-
##Backstory:
82
-
BackstopJS is a useful wrapper around the very fabulous [Resemble.js](https://github.com/Huddle/Resemble.js) component written by [James Cryer](https://github.com/jamescryer). Other implementations of Resemble.js, namely [PhantomCSS](https://github.com/Huddle/PhantomCSS) require writing long form [CasperJS](http://casperjs.org) tests -- which is of course great for testing complex UI interactions –- but kind of cumbersome for more simple applications like static CMS templates or lots and lots of app states at different screen sizes.
83
-
84
-
BackstopJS may be just the thing if you develop custom WordPress, Drupal or other CMS templates. Tested on OSX.
85
-
86
-
BackstopJS was created by [Garris Shipon](expanded.me) during the [Art.com labs](www.art.com) years.
## Many many thanks to [all the contributors](https://github.com/garris/BackstopJS/graphs/contributors) with special thanks to...
95
-
-[Shuresh KM](https://github.com/garris/BackstopJS/commits/master?author=nobso) for help on the 1.3.2 release
96
-
-[Klaus Bayrhammer](https://github.com/klausbayrhammer) for all the incredible effort leading up to 1.0 -- the cli reports and compatibility fixes are awesome!
97
-
-[Evan Lovely](https://github.com/EvanLovely) and [Klaus Bayrhammer](https://github.com/klausbayrhammer) for help on the 0.9.0 release
98
-
-[Robert O'Rourke](https://github.com/sanchothefat) for help on the 0.8.0 release
99
-
-[Klaus Bayrhammer](https://github.com/klausbayrhammer) for help on the 0.7.0 release
100
-
-[Benedikt Rötsch](https://github.com/axe312ger) for help on the 0.6.0 release
101
-
-[Yulia Tsareva](https://github.com/YuliaTsareva) for help on the 0.5.0 release
102
-
-[Lewis Nyman](https://github.com/lewisnyman) and [Stoutie](https://github.com/jehoshua02) for help with 0.4.0 release -- you guys are responsible for really getting the ball rolling!
103
-
104
-
BackstopJS uses icons from [the Noun Project](http://thenounproject.com/)
105
-
106
-
*[Tag](https://thenounproject.com/term/tag/164558/) by [Straw Dog Design](https://thenounproject.com/StrawDogDesign)
107
-
*[Hidden](https://thenounproject.com/term/hidden/63405/) by [Roberto Chiaveri](https://thenounproject.com/robertochiaveri/)
108
-
109
80
---
110
81
111
82
##Installation
@@ -620,6 +591,34 @@ To manually stop the server, from `./node_modules/backstopjs` ...
620
591
$ npm run stop
621
592
```
622
593
594
+
---
595
+
596
+
##Backstory:
597
+
BackstopJS is a useful wrapper around the very fabulous [Resemble.js](https://github.com/Huddle/Resemble.js) component written by [James Cryer](https://github.com/jamescryer). Other implementations of Resemble.js, namely [PhantomCSS](https://github.com/Huddle/PhantomCSS) require writing long form [CasperJS](http://casperjs.org) tests -- which is of course great for testing complex UI interactions –- but kind of cumbersome for more simple applications like static CMS templates or lots and lots of app states at different screen sizes.
623
598
599
+
BackstopJS may be just the thing if you develop custom WordPress, Drupal or other CMS templates. Tested on OSX.
600
+
601
+
BackstopJS was created by [Garris Shipon](expanded.me) during the [Art.com labs](www.art.com) years.
## Many many thanks to [all the contributors](https://github.com/garris/BackstopJS/graphs/contributors) with special thanks to...
610
+
-[Shuresh KM](https://github.com/garris/BackstopJS/commits/master?author=nobso) for help on the 1.3.2 release
611
+
-[Klaus Bayrhammer](https://github.com/klausbayrhammer) for all the incredible effort leading up to 1.0 -- the cli reports and compatibility fixes are awesome!
612
+
-[Evan Lovely](https://github.com/EvanLovely) and [Klaus Bayrhammer](https://github.com/klausbayrhammer) for help on the 0.9.0 release
613
+
-[Robert O'Rourke](https://github.com/sanchothefat) for help on the 0.8.0 release
614
+
-[Klaus Bayrhammer](https://github.com/klausbayrhammer) for help on the 0.7.0 release
615
+
-[Benedikt Rötsch](https://github.com/axe312ger) for help on the 0.6.0 release
616
+
-[Yulia Tsareva](https://github.com/YuliaTsareva) for help on the 0.5.0 release
617
+
-[Lewis Nyman](https://github.com/lewisnyman) and [Stoutie](https://github.com/jehoshua02) for help with 0.4.0 release -- you guys are responsible for really getting the ball rolling!
618
+
619
+
BackstopJS uses icons from [the Noun Project](http://thenounproject.com/)
620
+
621
+
*[Tag](https://thenounproject.com/term/tag/164558/) by [Straw Dog Design](https://thenounproject.com/StrawDogDesign)
622
+
*[Hidden](https://thenounproject.com/term/hidden/63405/) by [Roberto Chiaveri](https://thenounproject.com/robertochiaveri/)
0 commit comments