garris / garris/BackstopJS

Elements with padding

Open
#654 1 comment 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
7.2k
Forks
621
PR merge metrics
No merged PRs in 30d

Description

When: Trying to capture the screen of element with padding
Then: Backstop take screenshot of area without padding
Example:
```
{
"id": "Wiki Tests",
"viewports": [
{
"label": "desktop",
"width": 1920,
"height": 1080
}
],
"scenarios": [
{
"label": "Front-End-Wiki-Computing",
"url": "https://en.wikipedia.org/wiki/Front_end",
"selectors": [
"ul\\:nth-child(11)"
],
"misMatchThreshold": "0.1",
"onBeforeScript": "chromy/onBefore.js",
"cookiePath": "",
"referenceUrl": "",
"readyEvent": "",
"readySelector": "",
"delay": "",
"hideSelectors": [],
"removeSelectors": [],
"onReadyScript": "chromy/onReady.js",
"hoverSelector": "",
"clickSelector": "",
"postInteractionWait": "",
"selectorExpansion": "",
"requireSameDimensions": ""
}
],
"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": [],
"engine": "chrome",
"engineOptions": {
"waitTimeout": 1500,
"chromeFlags": [
"--disable-gpu",
"--force-device-scale-factor=1"
]
},
"debug": false,
"asyncCaptureLimit": 2,
"asyncCompareLimit": 8,
"debugWindow": false
}
```
Actual result
![wikitests_front-end-wiki-computing_0_ulnth-child11_0_desktop](https://user-images.githubusercontent.com/3931244/35795263-3f3d9b88-0a61-11e8-9b31-4d1e33bc81fc.png)
Expected Result
![image](https://user-images.githubusercontent.com/3931244/35795317-76d38cc4-0a61-11e8-874d-d8aaa213f31d.png)
Screend while inspecting in developer tool
![image](https://user-images.githubusercontent.com/3931244/35795275-4ea61bcc-0a61-11e8-8c00-df786fa4b1c2.png)

@garris , Maybe there is a possibility to take a screenshot of an element including padding?

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.