Option to show CSS diff instead of imagediff output

[SamHasler]

Would using the css diff technique here make diff images easier to understand:

http://franklinta.com/2014/11/30/image-diffing-using-css/

(feel free to close this if it's not. I just wanted to point this out ot you. Also, they link to chrome extension's captureVisibleTab method and I wondered if it could be used to make a CSSCritic chrome extension that passes the rendered page back to the regression runner. NB: it's not currently supported by Firefox, and there's no bug in bugzilla for it yet, but the WebExtensions page says at the bottom that they plan to add "Ability to take images of frames/tabs (like canvas.drawWindow)" so I expect there will be a way to write a firefox extension to do it in time.)

[cburgmer]

I've seen the post, amazingly simple technique :) This might be a simplification for the display of the diff, however I don't believe we can move away from JS as we need to find out whether there are changes at all. Also one should check the proposed solution for transparency (not that the imagediff library in the background handles it too well though).

I haven't looked much into browser specific solutions so far. It might be worth a shot, but 1) I'd try to make the regression runner browser independent as much as possible 2) not require any special download via browser app store or similar. Let's see what the browser vendors are coming up with in the future. Hopefully better first-class support for what we are doing here.

[SamHasler]

I was expecting to keep the js diff for detection. I was thinking CSS diff
could be an option to turn on, like the toggle preview. Sorry if that
wasn't clear.

Agreed that no browser specific addon should be required. I was thinking it
would be a useful feature for users to enable if they need a more accurate
rendering (e.g. font tests) or for faster running over multiple tests (as
I'm assuming it would be much faster than rasterizeHTML.js).
On Oct 5, 2015 1:13 PM, "Christoph Burgmer" notifications@github.com
wrote:

I've seen the post, amazingly simple technique :) This might be a
simplification for the display of the diff, however I don't believe we can
move away from JS as we need to find out whether there are changes at all.
Also one should check the proposed solution for transparency (not that the
imagediff library in the background handles it too well though).

I haven't looked much into browser specific solutions so far. It might be
worth a shot, but 1) I'd try to make the regression runner browser
independent as much as possible 2) not require any special download via
browser app store or similar. Let's see what the browser vendors are coming
up with in the future. Hopefully better first-class support for what we are
doing here.

—
Reply to this email directly or view it on GitHub
#68 (comment).

[cburgmer]

Re point 1) I would welcome the option to switch between different diff modes. I feel there might not be a the best solution, so choice would be good.

Re point 2) Why not :) CSS Critic is written in a modular way, there's certainly room for different renderers. Not sure if I will have enough time to look into that though. Ideas and PRs welcome!

[SamHasler]

Understand about not having enough time. I wanted to make sure you'd be
interested in PRs if I find the time to work on it. Will probably look at
whatever speeds up tests before anything else.
On Oct 6, 2015 2:09 PM, "Christoph Burgmer" notifications@github.com
wrote:

Re point 1) I would welcome the option to switch between different diff
modes. I feel there might not be a the best solution, so choice would
be good.

Re point 2) Why not :) CSS Critic is written in a modular way, there's
certainly room for different renderers. Not sure if I will have enough time
to look into that though. Ideas and PRs welcome!

—
Reply to this email directly or view it on GitHub
#68 (comment).

[cburgmer]

Speeding up tests might be worth a try. I am not very good at profiling JS, there might be some insights along the way.
One improvement I have made: there is a cache "bucket" in rasterizeHTML so that repeated pieces do not need to be recalculated.