Last modified: 2014-08-07 12:37:43 UTC
Once we have proper CSS hooked up as discussed in bug 51245 we should start automated visual comparisons between PHP parser HTML + CSS and Parsoid HTML + CSS. The easiest way to scale & surface this is likely testreduce. Some promising tools mentioned in a recent wikitech thread titled 'CSS regressions': * https://github.com/Huddle/PhantomCSS * http://pdiff.sourceforge.net/ * https://github.com/BBC-News/wraith * https://github.com/igorescobar/automated-screenshot-diff
(In reply to Gabriel Wicke from comment #0) > Once we have proper CSS hooked up as discussed in bug 51245 we should start > automated visual comparisons between PHP parser HTML + CSS and Parsoid HTML > + CSS. The easiest way to scale & surface this is likely testreduce. > > Some promising tools mentioned in a recent wikitech thread titled 'CSS > regressions': > > * https://github.com/Huddle/PhantomCSS JS code driven by PhantomCSS (JS) and Resemble.js > * http://pdiff.sourceforge.net/ C++ code .. probably standalone. > * https://github.com/BBC-News/wraith Ruby code driven by phantomjs + ImageMagick > * https://github.com/igorescobar/automated-screenshot-diff nodejs library and has a dependency on a C library (cairo). Not sure if it will work with https://www.npmjs.org/package/image-diff which is ImageMagick binding. It looks like huddle's solution will fit neatly within our nodejs setup. But, worth experimenting with a couple solns to see what works best in terms of: performance, quality, ease of use.
(In reply to ssastry from comment #1) > (In reply to Gabriel Wicke from comment #0) > > Once we have proper CSS hooked up as discussed in bug 51245 we should start > > automated visual comparisons between PHP parser HTML + CSS and Parsoid HTML > > + CSS. The easiest way to scale & surface this is likely testreduce. > > > > Some promising tools mentioned in a recent wikitech thread titled 'CSS > > regressions': > > > > * https://github.com/Huddle/PhantomCSS > > JS code driven by PhantomCSS (JS) and Resemble.js Downloaded phantomcss and started looking at the code. PhantomCSS seems like a wrapper to work with casper to acquire screenshots, etc. capserjs can be run in nodejs using spookyjs. I'll try experimenting with this tomorrow. But, I'm now wondering whether the generated images might be too big and/or if we'll get too many trivial rendering diffs, and whether running a normalizing html diff on PHP and Parsoid HTML should be considered as well.
The repo @ https://github.com/subbuss/parsoid_visual_diffs is now ready for deploy.
Now deployed and mostly working ... still has some issues, but it is more in the realm of tweaking and bug fixing.
