webdriver icon indicating copy to clipboard operation
webdriver copied to clipboard

Absolute positioned elements not taken into account for screenshot dimension

Open whimboo opened this issue 6 years ago • 4 comments

With the issue for geckodriver filed by @juangj already 2 years ago we still have the problem in how to determine the correct screenshot dimension when elements have an absolute position, which means that they can be located outside of the documentElement's bounds.

In chapter 17. Screen capture, section 17.1 Take Screenshot:

Let root rect be the current top-level browsing context’s document element’s rectangle

Given the spec we never would be able to get those elements drawn as part of the screenshot. And in some cases the root element can have a zero height, which means the result is a empty screenshot with only some pixels in height.

The example as given on the other issue is:

<div style="position: absolute; width: 200px; height: 200px; background-color: blue;"></div>

whimboo avatar Sep 24 '19 13:09 whimboo

So with Firefox 70 we actually had to change our internal API for capturing screenshots to make it aware of process isolation (https://bugzilla.mozilla.org/show_bug.cgi?id=1559592). With that change we inappropriately changed the way how we determine the rect of the screenshot. Instead of using the documentElement's bounding rect, we now use the visible viewport, which means:

    rect = new DOMRect(
      win.pageXOffset,
      win.pageYOffset,
      win.innerWidth,
      win.innerHeight
    );

With that change (which is actually identical to what Puppeteer is using by default as layoutViewport), capturing absolute elements works now with the caveat that the screenshot is way larger than the actual elements size. But I think that this is the only option in how a capture of such an element can be done. Otherwise it will never appear.

I wonder if we want to use this approach from Puppeteer and make it the default behavior with WebDriver too. @andreastt what do you think?

whimboo avatar Jan 03 '20 10:01 whimboo

@JohnChen0 or @juangj what is the behavior of chromedriver in this situation? Does it use the approach from Puppeteer, or does it also only captures the documentElement's rect? Given that @juangj filed https://github.com/mozilla/geckodriver/issues/931 it sounds like Chromedriver behaves differently. Thanks.

whimboo avatar Jan 03 '20 10:01 whimboo

If it is the case that chromedriver and geckodriver’s behaviour now matches to capture the visible viewport, and not just the document element’s bounding rect which may under some circumstances be smaller, we should consider changing the specification to reflect this.

I think it’s likely we never wrote a WPT test for the original wording of the specification. I would say the original intention was always to return a screenshot of the visible viewport, so let’s hope no one relies on the (old) behaviour of Gecko in this case.

andreastt avatar Jan 03 '20 10:01 andreastt

@sadym-chromium could you maybe follow-up to my above question in how chromedriver handles this situation? It would be good to know. Thanks a lot.

whimboo avatar Jan 13 '22 15:01 whimboo