garris / BackstopJS

Catch CSS curve balls.
http://backstopjs.org
MIT License
6.71k stars 602 forks source link

Screenshots obtained are cropped #847

Open andrepm06 opened 6 years ago

andrepm06 commented 6 years ago

I need to check several pieces of a given page, so i'm justing grabbing all the selectors on the same test. But for some reason some of screenshots obtained are a bit weird. Some are okay.

captura de tela 2018-08-31 as 15 36 41

{
    "label": "Corporate Foreign Exchange - One group with one pending signer",
    "url": "localhost:8080/exchanges/unsigned",
    "selectors": ["[data-test=ContractSummary-001]", "[data-test=ContractSummary-002]", "[data-test=ContractSummary-003]", "[data-test=ContractSummary-009]", "[data-test=ContractSummary-006]", "[data-test=ContractSummary-007]", "[data-test=ContractSummary-008]", "[data-test=ContractSummary-010]", "[data-test=ContractSummary-011]", "[data-test=ContractSummary-012]", "[data-test=ContractSummary-013]", "[data-test=ContractSummary-014]", "[data-test=ContractSummary-017]"],
    "hideSelectors": [],
    "selectorExpansion": true,
    "misMatchThreshold": 1.0,
    "requireSameDimensions": true
  }
"report": ["browser"],
 "engine": "puppeteer",
 "engineFlags": [],
 "asyncCaptureLimit": 1,
 "asyncCompareLimit": 5,
 "debug": true,
  "debugWindow": false

Does anyone knows why this happens?

andrepm06 commented 6 years ago

This shocked to me:

I've changed the order of the selectors on the array backwards, and suddenly everything works!


{
    "label": "Corporate Foreign Exchange - One group with one pending signer",
    "url": "http://40.121.58.75/exchanges/unsigned",
    "selectors": ["[data-test=ContractSummary-017]", "[data-test=ContractSummary-014]", "[data-test=ContractSummary-013]", "[data-test=ContractSummary-012]",  "[data-test=ContractSummary-011]", "[data-test=ContractSummary-010]", "[data-test=ContractSummary-008]", "[data-test=ContractSummary-009]", "[data-test=ContractSummary-007]", "[data-test=ContractSummary-006]", "[data-test=ContractSummary-003]", "[data-test=ContractSummary-002]", "[data-test=ContractSummary-001]"],
    "selectorExpansion": true,
    "misMatchThreshold": 1.0,
    "requireSameDimensions": true
  }
garris commented 6 years ago

"selectorExpansion": true, <== are you actively using this feature?

I wonder if setting to false would avoid the issue?

andrepm06 commented 6 years ago

Actually, i'm not. I accidentally copied this from somewhere. But i really did not understood this tag.

But removing, didn't solved the original problem =(