Testcafe: Improve t.takeElementScreenshot to work with color corrected displays

[AndreyBelym]

Are you requesting a feature or reporting a bug?

Bug

What is the current behavior?

The t.takeElementScreenshot action fails to crop the taken screenshot to the specified element's dimensions, and displays the Can't detect page area ... warning.

It can happen because of

• non-integer ratio between physical and love pixel sizes on HighDPI

• screen color correction that leads to changes in intensities of black and white colors

• slow rendering on low-power machines and VMs

What is the expected behavior?

Page area detection mechanism must be improved to get more reliable results.

[htho]

I have this problem with Firefox on Android where the screenshots are taken through adb.
Please see my stackoverflow post on this topic.

The black marks are rendered as #010101 instead of #000.

My first Idea was to accept a threshold in crop.js:20. This would require a completely different implementation, where each pixel is checked if it is in a certain range. I think this might become slow and hard to read.

My second idea is to transform the screenshot instead. Each pixel in the screenshot is checked if its color is darker than - lets say #0f0f0f. Then the pixels color is set to #000 otherwise it is set to #fff.

I think I can implement that approach.

[htho]

I implemented this approach.
https://github.com/htho/testcafe/commit/26c83d582940fb6b0995a21b39dddcd9f0baf7bb

Please tell me how I can improve it. I will follow the contribution guidelines then.

[Farfurix]

@htho.

Hello.

Thank you for your implementation, the approach looks good. Please submit your changes as a Pull Request to this repository. We will review it.

[htho]

I added a Pull-Request. But I don't know how to write a Test for this specific case.

[lock[bot]]

This thread has been automatically locked since it is closed and there has not been any recent activity. Please open a new issue for related bugs or feature requests. We recommend you ask TestCafe API, usage and configuration inquiries on StackOverflow.