screenshotbot / screenshotbot-oss

A Screenshot Testing service to tie with your existing Android, iOS and Web screenshot tests
https://screenshotbot.io
Mozilla Public License 2.0
238 stars 13 forks source link

Do we throw the All Pixel Comparisons away? #26

Closed liweijian closed 2 years ago

liweijian commented 2 years ago

After setup a new environment with the current repo, I noticed that the All Pixel Comparisons missed.

Somehow I found that the code still there:

https://github.com/screenshotbot/screenshotbot-oss/blob/main/src/screenshotbot/dashboard/compare.lisp#L720

And I tried to add a new button within the report(After line 697, next to <a class= "nav-link active" href= "#" data-type= "changes" >,(length changes-groups) changes</a>):

      <li class= "nav-item">
      <a class= "nav-link active" href=all-comparisons data-type= "changes" >haha</a>
      </li>   

And reload the page:

image

It looks works, but the clicking the "haha" will not load the All Pixel Comparisons page, I have the copy the link of "haha" and open it in anther tab:

image

And that's how it looks in the old version:

image

The background color looks weird, just wondering if there's anything that I'd missed?

tdrhq commented 2 years ago

Yes, sorry for the breaking changes!

It started with having to support browser screenshots. Browser screenshots are huge, so the all pixel comparisons page became impossible to maintain so I disabled in prod, and kept it only in OSS. I probably broke the link to it when I redesigned the report page.

[BUT! Since then, the diff images are now precomputed and cached, so All Pixel comparisons should be relatively cheap once the computations are completed]

As for the blue background, I changed the underlying comparison logic to only generate a transparent background image with the red pixels. This was mostly a disk-space saving mechanism (again, because browser screenshots are huge!). So on the main compare page, I'm now rendering the original image, and then overlaying the diff image on top it.

The other thing you'll notice with the main compare page is that it's now interactive. You can zoom, translate, etc. So now I have to think through how I want that to show up on the all-pixels comparisons page. (Do we want each image to be interactive? If so, do we want them to take full width? etc.)

Let me work on this today to see if I can bring it back.

liweijian commented 2 years ago

Thanks for your quick reply.

I just went through the code base, I think I could work on a quick fix in my environment with the "haha"-like button :)