Chromy breaking when an element has position absolute css property

[andrepm06]

When a page under test has an element with position absolute property, and this element has no relative parent, BackstopJS or Chromy (i dont know) breaks.

Here`s the output:

ChromyJS returned an unexpected error while attempting to capture a selector. TypeError: Cannot read property 'length' of null at Chromy._screenshotMultipleSelectors$ (/usr/local/lib/node_modules/backstopjs/node_modules/chromy/dist/index.js:1388:27) at tryCatch (/usr/local/lib/node_modules/backstopjs/node_modules/babel-runtime/node_modules/regenerator-runtime/runtime.js:62:40) at Generator.invoke [as _invoke] (/usr/local/lib/node_modules/backstopjs/node_modules/babel-runtime/node_modules/regenerator-runtime/runtime.js:296:22) at Generator.prototype.(anonymous function) [as next] (/usr/local/lib/node_modules/backstopjs/node_modules/babel-runtime/node_modules/regenerator-runtime/runtime.js:114:21) at tryCatch (/usr/local/lib/node_modules/backstopjs/node_modules/babel-runtime/node_modules/regenerator-runtime/runtime.js:62:40) at invoke (/usr/local/lib/node_modules/backstopjs/node_modules/babel-runtime/node_modules/regenerator-runtime/runtime.js:152:20) at /usr/local/lib/node_modules/backstopjs/node_modules/babel-runtime/node_modules/regenerator-runtime/runtime.js:162:13

[dotneet]

thank you for reporting. could you attach a minimal reproduction code?

[andrepm06]

To contextualize:

I`m testing visual regression (with BackstopJS) against an application that uses react with style components

Here's the code for the issued component:

export const Wrapper = styled.div`
  position: absolute;
  margin: auto;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;`

Our paliative solution was to put a position relative on the body.

Also, if I remove the position absolute from the style, the test works fine.

[mstruensee]

I am experiencing the same issue ... #113

[kevinmpowell]

I'm using chromy in backstopjs as well and can confirm that adding:

body {
  position: relative;
}

To the page I was testing made these errors go away. Thanks @andrepm06 for the tip!