RangeError: "size" argument must not be negative

[hai-le-niteco]

I got a strange error while taking screenshot of a particular page. It happens in ".screenshot()" command. Other steps using "matchScreenshot" works perfectly except this step. Could you please help ? Thank you. Note: It takes a screenshot but render a empty .png file (0 kB) and cannot move it to the match screenshot folder.

RangeError: "size" argument must not be negative at Function.Buffer.allocUnsafe (buffer.js:253:3) at Jimp.cropQuiet (C:\Users\hai.le\AppData\Local\Cypress\Cache\3.4.0\Cypress\resources\app\packages\server\node_modules\@jimp\plugin-crop\dist\index.js:43:27) at Jimp.(anonymous function) [as crop] (C:\Users\hai.le\AppData\Local\Cypress\Cache\3.4.0\Cypress\resources\app\packages\server\node_modules\@jimp\core\dist\index.js:1222:23) at crop (C:\Users\hai.le\AppData\Local\Cypress\Cache\3.4.0\Cypress\resources\app\packages\server\lib\screenshots.js:145:26) at C:\Users\hai.le\AppData\Local\Cypress\Cache\3.4.0\Cypress\resources\app\packages\server\lib\screenshots.js:209:22 at arrayEach (C:\Users\hai.le\AppData\Local\Cypress\Cache\3.4.0\Cypress\resources\app\packages\server\node_modules\lodash\lodash.js:516:11) at Function.forEach (C:\Users\hai.le\AppData\Local\Cypress\Cache\3.4.0\Cypress\resources\app\packages\server\node_modules\lodash\lodash.js:9344:14) at stitchScreenshots (C:\Users\hai.le\AppData\Local\Cypress\Cache\3.4.0\Cypress\resources\app\packages\server\lib\screenshots.js:206:7) at C:\Users\hai.le\AppData\Local\Cypress\Cache\3.4.0\Cypress\resources\app\packages\server\lib\screenshots.js:350:21 at runCallback (timers.js:789:20) at tryOnImmediate (timers.js:751:5) at processImmediate [as _immediateCallback] (timers.js:722:5)

[Keysox]

I ran into this same issue due to having the following CSS on the element I was trying to take a snapshot of: height: calc(100% - 66px);. When I changed it to max-height, the test is now passing!

Additionally, I was able to get better error messages after upgrading to Cypress 3.5.0 or higher, so you may want to give that a try! https://github.com/cypress-io/cypress/issues/5149

[hai-le-niteco]

I ran into this same issue due to having the following CSS on the element I was trying to take a snapshot of: height: calc(100% - 66px);. When I changed it to max-height, the test is now passing!

Additionally, I was able to get better error messages after upgrading to Cypress 3.5.0 or higher, so you may want to give that a try! cypress-io/cypress#5149

Could you please specify how to change height: calc(100% - 66px); to max-height ? Is it in HTML of website or cypress-match-screenshot library ?

[Keysox]

It'll be in your HTML or CSS file. Try searching for any instances of height: calc( and see if you can refactor away from using it.

Definitely a short-term solution but looks like the bug is either coming from cypress or jimp as many of these plugins have the same issue

[Keysox]

I went ahead and filed this issue for the cypress team to weight in on as it's not an issue with this particular plugin: https://github.com/cypress-io/cypress/issues/6099.

I realized that using the CSS properties scale and transition can also cause this issue to occur so you may want to check for those in your codebase as well until a real solution is in place.