Screenshot comparison...

169 views
Skip to first unread message

Laurent David

unread,
Jun 23, 2011, 4:18:48 PM6/23/11
to Fighting Layout Bugs
Hi All,

I couple of years ago I used Selenium and started to implement a
screenshot comparison extension as it is sometimes difficult to check
that a layout "declared" is a layout "displayed".
It is really far from finished work and I think it would need a really
good redesign/thinking bu I am quite interested some of the features
provided by Fighting Layout Bugs as it gives an answer to similar
issues.

Julian Harty pointed me to your direction and I am interested in
participating in any way that you would find useful to this project.

Michael Tamm

unread,
Jun 24, 2011, 8:14:07 AM6/24/11
to fighting-l...@googlegroups.com, lau...@tdm.info
Hi Laurent,

I'm currently working on a screenshot comparer too :)

I would be more than glad if you like to contribute to FLB (Fighting Layout Bugs).

I see several possibilities to work together, depending on how much time you would like to invest:
No time -- just send me your code and I will see how I can refactor/redesign and finally integrate it,
Just some time -- send me your code with some explanations ;)
Some more time -- I would like to explain you the architecture of FLB and tell you my ideas how such
a feature could be integrated so we could work together on integrating this feature ...

What do you think?

Kind regards, Michael

2011/6/23 Laurent David <lau...@tdm.info>

kumar abhinav

unread,
Aug 29, 2013, 3:50:08 PM8/29/13
to fighting-l...@googlegroups.com, lau...@tdm.info, michae...@googlemail.com
Hi Michael,

I was going through FLB and found your post. In my company we are doing cross browser testing. We have to compare html page from different browsers and highlight the differences. 
How we are thinking is, we will baseline one browser eg IE and compare IE page with different browsers. Comparison may be first take the screenshot and then compare different screen shot and highlight the difference.
I saw you did something similar. Can you please help me in that. i am really stuck right now and not able to proceed further.

Thanks
Abhinav

Michael Tamm

unread,
Aug 30, 2013, 4:27:53 AM8/30/13
to fighting-l...@googlegroups.com, lau...@tdm.info
Hi,

yes I did some experiments with comapring screenshots, but (as you experienced yourself) its really not easy because of too many false alarms.

So my advice is (as strange as it might seem): Do not use screenshots for corss browser testing.

Well, that's not really helpful I guess. ;) So here is another advice, what you actually could do:

Use JavaScript to analyse the page: (x,y offesets as well as width and height properties of those DOM-Elements, propably some <div> elements with known ids and/or classes, that are important for the layout of your webpage). This can be done in multiple browsers and then all you need to do is to compare the offsets and dimensions of those elements gathered in different browsers.

By the way, when I started the FLB project I thought taking screenshots is a good idea to detect layout bugs (and maybe it was), but its also very problemtatic because of animations on websites. So I plan (when I have time) to follow my own advice and implement some layout bug detectors based on using JavaScript and DOM properties only ...

Kind regards, Michael

Laurent David

unread,
Sep 4, 2013, 9:51:26 AM9/4/13
to fighting-l...@googlegroups.com, lau...@tdm.info
Hi,

Yes, definitely agree with Michael.
I made an attempt but it was not working the way I wanted.
Suggestion though are maybe to have a sort of mask for each screenshot that allow you to ignore changes that are not important in the process of deciding if the test has passed or not.
Imagemagik has got a nice comparison tool that could be helpful in this sense (http://www.imagemagick.org/Usage/compare/) and probably applying a mask before the comparison could help sort out false "positives".
Not sure it helps but...




--
You received this message because you are subscribed to the Google Groups "Fighting Layout Bugs" group.
To unsubscribe from this group and stop receiving emails from it, send an email to fighting-layout-...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.

Reply all
Reply to author
Forward
0 new messages