ANanother-dave·Sep 8, 2017
See frameworks like:
* Galen: http://slides.com/netzartist-de/galen-tdd-css
* Quixote: https://github.com/jamesshore/quixote
It does sound interesting to me (well testing with good coverage on appropriate elements, rather than 'TDD' per se), but I've never had a chance to get it running on a project. It feels like the type of thing you'd need to do from the beginning if at all.
Could be useful especially around 'baseline' things on the site, that you're not expecting to change, e.g. do font-sizes, block-level padding, grid alignment, brand colours, etc.
EDIT:
Just to add, so I think the basic premise of this type of visual testing is that you're testing imperatively (i.e. "when I'm on the homepage, the navigation should be flush to the top of the screen and should have a 100px gap between it and the primary header") vs using something lik
Read the rest
e Wraith where you're testing declaratively (here is a screenshot of the homepage; the actual homepage should look exactly like this ±5% variance).
It's roughly equivalent to integration tests (how does my nav 'integrate with' the Window, the header, etc.) vs functional end-to-end tests (does the homepage as a whole work). Given your point of view, that can either give great savings in debugging things (as you've more specificity about what has changed that caused your funky layout) or could be a complete waste of effort. The answer is probably somewhere in between :)
I would be interested to hear if there's anyone using a CSS test framework like Cucumber/BDD style tests — as the Galen slides above mention, your designer is probably subconsciously checking things on the page, but they're being exact about it — if we could distill that precision into BDD tests and allow our test framework building blocks to grow over time, would you be able to create a suite of reusable test statements that can be written up by design by themselves?