Problem with many selectors - test images are blank or not exactly on selector
Open
- Dominant language
- JavaScript
- Stars
- 7.2k
- Forks
- 621
- PR merge metrics
- No merged PRs in 30d
Description
Hi everyone,
We have a problem rendering test images with backstop and puppeteer.
We have many selectors to test and everytime we run _backstop test_ rendered images are blank, not well positioned and some are good...
Here is a screenshot of the result


Heres the backstop.json:
{
"id": "backstop_default",
"viewports": [
{
"label": "phone",
"width": 320,
"height": 480
},
{
"label": "tablet",
"width": 1024,
"height": 768
}
],
"onBeforeScript": "puppet/onBefore.js",
"onReadyScript": "puppet/onReady.js",
"scenarios": [
{
"label": "BackstopJS Homepage",
"cookiePath": "backstop_data/engine_scripts/cookies.json",
"url": "https://icomoon.io/#preview-free",
"referenceUrl": "",
"readyEvent": "",
"readySelector": "#glyphs3",
"delay": 10000,
"hideSelectors": [],
"removeSelectors": [],
"hoverSelector": "",
"clickSelector": "",
"postInteractionWait": 0,
"scrollToSelector": "div.unit.glyph",
"selectors": ["div.unit.glyph"],
"selectorExpansion": true,
"misMatchThreshold": 0.1,
"requireSameDimensions": true
}
],
"paths": {
"bitmaps_reference": "backstop_data/bitmaps_reference",
"bitmaps_test": "backstop_data/bitmaps_test",
"engine_scripts": "backstop_data/engine_scripts",
"html_report": "backstop_data/html_report",
"ci_report": "backstop_data/ci_report"
},
"report": ["browser"],
"engine": "puppeteer",
"engineOptions": {
"args": ["--no-sandbox"]
},
"asyncCaptureLimit": 1,
"asyncCompareLimit": 1,
"debug": false
}
BTW, the url in this exemple reproduce the same problem we have on our app ( private ).
Thank you for your help all!
Contributor guide
Assessment
This issue has not been assessed yet.