Open Bug 1497100 Opened 6 years ago Updated 2 years ago

Screenshot of root element taken with Marionette is cropped to visible viewport

Categories

(Firefox :: Headless, defect, P3)

62 Branch
defect

Tracking

()

UNCONFIRMED

People

(Reporter: matt, Unassigned)

Details

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36

Steps to reproduce:

Ubuntu Server 18.04.1 64bit
Firefox 62.0.3
Geckodriver 0.23.0


Run firefox in headless mode and use the element screenshot command to screenshot the html element on the page: https://en.wikipedia.org/wiki/Firefox


Actual results:

Image result:

https://imgur.com/a/vOYsSdn

Gecko driver trace:
1538957296571   webdriver::httpapi      DEBUG   Creating routes
1538957296577   geckodriver     DEBUG   Listening on 127.0.0.1:48505
1538957300642   webdriver::server       DEBUG   -> POST /session {"capabilities": {
                    "alwaysMatch": {
                        "acceptInsecureCerts": true,"moz:webdriverClick": false, "moz:firefoxOptions":{"args":["-headless"], "prefs":{}}}}}
1538957300642   geckodriver::capabilities       DEBUG   Trying to read firefox version from ini files
1538957300643   geckodriver::capabilities       DEBUG   Found version 62.0.3
1538957300645   mozrunner::runner       INFO    Running command: "/usr/bin/firefox" "-marionette" "-headless" "-foreground" "-no-remote" "-profile" "/tmp/rust_mozprofile.R7spKBBY2taE"
1538957300646   geckodriver::marionette DEBUG   Waiting 60s to connect to browser on 127.0.0.1:42363
*** You are running in headless mode.
1538957301340   Marionette      DEBUG   Received observer notification profile-after-change
1538957301375   Marionette      DEBUG   Received observer notification command-line-startup
1538957301375   Marionette      DEBUG   Received observer notification nsPref:changed
1538957301375   Marionette      DEBUG   Init aborted (running=false, enabled=true, finalUIStartup=false)
1538957302441   Marionette      DEBUG   Received observer notification sessionstore-windows-restored
1538957302441   Marionette      DEBUG   Waiting for delayed startup...
1538957302955   Marionette      DEBUG   Setting recommended pref apz.content_response_timeout to 60000
1538957302956   Marionette      DEBUG   Setting recommended pref browser.download.panel.shown to true
1538957302957   Marionette      DEBUG   Setting recommended pref browser.pagethumbnails.capturing_disabled to true
1538957302958   Marionette      DEBUG   Setting recommended pref browser.search.update to false
1538957302959   Marionette      DEBUG   Setting recommended pref browser.showQuitWarning to false
1538957302959   Marionette      DEBUG   Setting recommended pref toolkit.cosmeticAnimations.enabled to false
1538957302960   Marionette      DEBUG   Setting recommended pref browser.tabs.disableBackgroundZombification to false
1538957302961   Marionette      DEBUG   Setting recommended pref browser.tabs.warnOnCloseOtherTabs to false
1538957302961   Marionette      DEBUG   Setting recommended pref browser.tabs.warnOnOpen to false
1538957302962   Marionette      DEBUG   Setting recommended pref browser.usedOnWindows10.introURL to
1538957302962   Marionette      DEBUG   Setting recommended pref browser.urlbar.suggest.searches to false
1538957302964   Marionette      DEBUG   Setting recommended pref datareporting.policy.dataSubmissionPolicyAccepted to false
1538957302964   Marionette      DEBUG   Setting recommended pref dom.disable_beforeunload to true
1538957302965   Marionette      DEBUG   Setting recommended pref dom.disable_open_during_load to false
1538957302966   Marionette      DEBUG   Setting recommended pref dom.file.createInChild to true
1538957302966   Marionette      DEBUG   Setting recommended pref dom.max_chrome_script_run_time to 0
1538957302966   Marionette      DEBUG   Setting recommended pref dom.max_script_run_time to 0
1538957302968   Marionette      DEBUG   Setting recommended pref extensions.getAddons.cache.enabled to false
1538957302968   Marionette      DEBUG   Setting recommended pref extensions.webservice.discoverURL to http://%(server)s/dummy/discoveryURL
1538957302969   Marionette      DEBUG   Setting recommended pref network.http.prompt-temp-redirect to false
1538957302969   Marionette      DEBUG   Setting recommended pref network.http.speculative-parallel-limit to 0
1538957302970   Marionette      DEBUG   Setting recommended pref security.fileuri.strict_origin_policy to false
1538957302971   Marionette      DEBUG   Setting recommended pref security.notification_enable_delay to 0
1538957302971   Marionette      DEBUG   Setting recommended pref signon.autofillForms to false
1538957302972   Marionette      DEBUG   Setting recommended pref signon.rememberSignons to false
1538957303041   Marionette      INFO    Listening on port 42363
1538957303042   Marionette      DEBUG   Remote service is active
1538957303050   geckodriver::marionette DEBUG   Connection established on 127.0.0.1:42363. Waiting for Marionette handshake
1538957303065   Marionette      DEBUG   Accepted connection 0 from 127.0.0.1:52576
1538957303066   geckodriver::marionette DEBUG   Connected to Marionette
1538957303068   Marionette      TRACE   0 -> [0,1,"WebDriver:NewSession",{"acceptInsecureCerts":true,"moz:webdriverClick":false}]
1538957303069   Marionette      WARN    TLS certificate errors will be ignored for this session
1538957303155   Marionette      DEBUG   [2147483649] Frame script loaded
1538957303167   Marionette      DEBUG   [2147483649] Frame script registered
1538957303190   Marionette      TRACE   0 <- [1,1,null,{"sessionId":"7105b163-ab6d-4b0e-9fba-2b6042f2668c","capabilities":{"browserName":"firefox","browserVersion":"62.0. ... ,"moz:profile":"/tmp/rust_mozprofile.R7spKBBY2taE","moz:useNonSpecCompliantPointerOrigin":false,"moz:webdriverClick":false}}]
1538957303199   webdriver::server       DEBUG   <- 200 OK {"value":{"sessionId":"7105b163-ab6d-4b0e-9fba-2b6042f2668c","capabilities":{"acceptInsecureCerts":true,"browserName":"firefox","browserVersion":"62.0.3","moz:accessibilityChecks":false,"moz:geckodriverVersion":"0.23.0","moz:headless":true,"moz:processID":31588,"moz:profile":"/tmp/rust_mozprofile.R7spKBBY2taE","moz:useNonSpecCompliantPointerOrigin":false,"moz:webdriverClick":false,"pageLoadStrategy":"normal","platformName":"linux","platformVersion":"4.15.0-33-generic","rotatable":false,"timeouts":{"implicit":0,"pageLoad":300000,"script":30000}}}}
1538957304233   webdriver::server       DEBUG   -> POST /session/7105b163-ab6d-4b0e-9fba-2b6042f2668c/url {"url": "https:\/\/en.wikipedia.org\/wiki\/Firefox"}
1538957304235   Marionette      TRACE   0 -> [0,2,"WebDriver:Navigate",{"url":"https://en.wikipedia.org/wiki/Firefox"}]
1538957304243   Marionette      DEBUG   [2147483649] Received DOM event beforeunload for about:blank
1538957305293   Marionette      DEBUG   [2147483649] Received DOM event pagehide for about:blank
1538957306454   Marionette      DEBUG   [2147483649] Received DOM event DOMContentLoaded for https://en.wikipedia.org/wiki/Firefox
1538957307058   Marionette      DEBUG   [2147483649] Received DOM event pageshow for https://en.wikipedia.org/wiki/Firefox
1538957307061   Marionette      TRACE   0 <- [1,2,null,{"value":null}]
1538957307062   webdriver::server       DEBUG   <- 200 OK {"value":null}
1538957307063   webdriver::server       DEBUG   -> POST /session/7105b163-ab6d-4b0e-9fba-2b6042f2668c/element {"using":"tag name","value": "html"}
1538957307066   Marionette      TRACE   0 -> [0,3,"WebDriver:FindElement",{"using":"tag name","value":"html"}]
1538957307258   Marionette      TRACE   0 <- [1,3,null,{"value":{"element-6066-11e4-a52e-4f735466cecf":"aafffe0a-7a28-458e-b159-d73575f4987f","ELEMENT":"aafffe0a-7a28-458e-b159-d73575f4987f"}}]
1538957307259   webdriver::server       DEBUG   <- 200 OK {"value":{"element-6066-11e4-a52e-4f735466cecf":"aafffe0a-7a28-458e-b159-d73575f4987f"}}
1538957307264   webdriver::server       DEBUG   -> GET /session/7105b163-ab6d-4b0e-9fba-2b6042f2668c/element/aafffe0a-7a28-458e-b159-d73575f4987f/name
1538957307266   Marionette      TRACE   0 -> [0,4,"WebDriver:GetElementTagName",{"id":"aafffe0a-7a28-458e-b159-d73575f4987f"}]
1538957307326   Marionette      TRACE   0 <- [1,4,null,{"value":"html"}]
1538957307327   webdriver::server       DEBUG   <- 200 OK {"value":"html"}
1538957307329   webdriver::server       DEBUG   -> GET /session/7105b163-ab6d-4b0e-9fba-2b6042f2668c/element/aafffe0a-7a28-458e-b159-d73575f4987f/screenshot
1538957307330   Marionette      TRACE   0 -> [0,5,"WebDriver:TakeScreenshot",{"element":{"element-6066-11e4-a52e-4f735466cecf":"aafffe0a-7a28-458e-b159-d73575f4987f"},"full":false,"highlights":[]}]
1538957307479   Marionette      TRACE   0 <- [1,5,null,{"value":"iVBORw0KGgoAAAANSUhEUgAABUwAAAK2CAYAAACVVtY/AAAgAElEQVR4nOzdd3hb953ne+29++TO7ObZ3SnZTMnOJt7szGRnMsnOJHcmy ... Qsh0KhQIZKhd179ojhlo5vGUwpjSCDKaVUKhlMCSGEEBILcP9CnxbtvQ5MmDABHR36MZlv/foSlJRsiPr7pk/uWOzd/gHFgBNY6FKZ1AAAAABJRU5ErkJggg=="}]
1538957307531   webdriver::server       DEBUG   <- 200 OK {"value":"REMOVED BASE64 IMAGE TO CUT SPACE"}


Expected results:

You should have gotten a full page screenshot since the html element contains all the content. If you run firefox without headless mode enabled, you will receive a full page screenshot instead of the cropped one above.

I tested this on Windows 64bit & Ubuntu Server, it happens on both platforms with the same gecko driver version and firefox version.
(In reply to matt from comment #0)
> User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36
> (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36
> 
> Steps to reproduce:
> 
> Ubuntu Server 18.04.1 64bit
> Firefox 62.0.3
> Geckodriver 0.23.0
> 
> 
> Run firefox in headless mode and use the element screenshot command to
> screenshot the html element on the page:
> https://en.wikipedia.org/wiki/Firefox
> 
> 
> Actual results:
> 
> Image result:
> 
> https://imgur.com/a/vOYsSdn
> 
> Gecko driver trace:
> 1538957296571   webdriver::httpapi      DEBUG   Creating routes
> 1538957296577   geckodriver     DEBUG   Listening on 127.0.0.1:48505
> 1538957300642   webdriver::server       DEBUG   -> POST /session
> {"capabilities": {
>                     "alwaysMatch": {
>                         "acceptInsecureCerts": true,"moz:webdriverClick":
> false, "moz:firefoxOptions":{"args":["-headless"], "prefs":{}}}}}
> 1538957300642   geckodriver::capabilities       DEBUG   Trying to read
> firefox version from ini files
> 1538957300643   geckodriver::capabilities       DEBUG   Found version 62.0.3
> 1538957300645   mozrunner::runner       INFO    Running command:
> "/usr/bin/firefox" "-marionette" "-headless" "-foreground" "-no-remote"
> "-profile" "/tmp/rust_mozprofile.R7spKBBY2taE"
> 1538957300646   geckodriver::marionette DEBUG   Waiting 60s to connect to
> browser on 127.0.0.1:42363
> *** You are running in headless mode.
> 1538957301340   Marionette      DEBUG   Received observer notification
> profile-after-change
> 1538957301375   Marionette      DEBUG   Received observer notification
> command-line-startup
> 1538957301375   Marionette      DEBUG   Received observer notification
> nsPref:changed
> 1538957301375   Marionette      DEBUG   Init aborted (running=false,
> enabled=true, finalUIStartup=false)
> 1538957302441   Marionette      DEBUG   Received observer notification
> sessionstore-windows-restored
> 1538957302441   Marionette      DEBUG   Waiting for delayed startup...
> 1538957302955   Marionette      DEBUG   Setting recommended pref
> apz.content_response_timeout to 60000
> 1538957302956   Marionette      DEBUG   Setting recommended pref
> browser.download.panel.shown to true
> 1538957302957   Marionette      DEBUG   Setting recommended pref
> browser.pagethumbnails.capturing_disabled to true
> 1538957302958   Marionette      DEBUG   Setting recommended pref
> browser.search.update to false
> 1538957302959   Marionette      DEBUG   Setting recommended pref
> browser.showQuitWarning to false
> 1538957302959   Marionette      DEBUG   Setting recommended pref
> toolkit.cosmeticAnimations.enabled to false
> 1538957302960   Marionette      DEBUG   Setting recommended pref
> browser.tabs.disableBackgroundZombification to false
> 1538957302961   Marionette      DEBUG   Setting recommended pref
> browser.tabs.warnOnCloseOtherTabs to false
> 1538957302961   Marionette      DEBUG   Setting recommended pref
> browser.tabs.warnOnOpen to false
> 1538957302962   Marionette      DEBUG   Setting recommended pref
> browser.usedOnWindows10.introURL to
> 1538957302962   Marionette      DEBUG   Setting recommended pref
> browser.urlbar.suggest.searches to false
> 1538957302964   Marionette      DEBUG   Setting recommended pref
> datareporting.policy.dataSubmissionPolicyAccepted to false
> 1538957302964   Marionette      DEBUG   Setting recommended pref
> dom.disable_beforeunload to true
> 1538957302965   Marionette      DEBUG   Setting recommended pref
> dom.disable_open_during_load to false
> 1538957302966   Marionette      DEBUG   Setting recommended pref
> dom.file.createInChild to true
> 1538957302966   Marionette      DEBUG   Setting recommended pref
> dom.max_chrome_script_run_time to 0
> 1538957302966   Marionette      DEBUG   Setting recommended pref
> dom.max_script_run_time to 0
> 1538957302968   Marionette      DEBUG   Setting recommended pref
> extensions.getAddons.cache.enabled to false
> 1538957302968   Marionette      DEBUG   Setting recommended pref
> extensions.webservice.discoverURL to http://%(server)s/dummy/discoveryURL
> 1538957302969   Marionette      DEBUG   Setting recommended pref
> network.http.prompt-temp-redirect to false
> 1538957302969   Marionette      DEBUG   Setting recommended pref
> network.http.speculative-parallel-limit to 0
> 1538957302970   Marionette      DEBUG   Setting recommended pref
> security.fileuri.strict_origin_policy to false
> 1538957302971   Marionette      DEBUG   Setting recommended pref
> security.notification_enable_delay to 0
> 1538957302971   Marionette      DEBUG   Setting recommended pref
> signon.autofillForms to false
> 1538957302972   Marionette      DEBUG   Setting recommended pref
> signon.rememberSignons to false
> 1538957303041   Marionette      INFO    Listening on port 42363
> 1538957303042   Marionette      DEBUG   Remote service is active
> 1538957303050   geckodriver::marionette DEBUG   Connection established on
> 127.0.0.1:42363. Waiting for Marionette handshake
> 1538957303065   Marionette      DEBUG   Accepted connection 0 from
> 127.0.0.1:52576
> 1538957303066   geckodriver::marionette DEBUG   Connected to Marionette
> 1538957303068   Marionette      TRACE   0 ->
> [0,1,"WebDriver:NewSession",{"acceptInsecureCerts":true,"moz:webdriverClick":
> false}]
> 1538957303069   Marionette      WARN    TLS certificate errors will be
> ignored for this session
> 1538957303155   Marionette      DEBUG   [2147483649] Frame script loaded
> 1538957303167   Marionette      DEBUG   [2147483649] Frame script registered
> 1538957303190   Marionette      TRACE   0 <-
> [1,1,null,{"sessionId":"7105b163-ab6d-4b0e-9fba-2b6042f2668c","capabilities":
> {"browserName":"firefox","browserVersion":"62.0. ...
> ,"moz:profile":"/tmp/rust_mozprofile.R7spKBBY2taE","moz:
> useNonSpecCompliantPointerOrigin":false,"moz:webdriverClick":false}}]
> 1538957303199   webdriver::server       DEBUG   <- 200 OK
> {"value":{"sessionId":"7105b163-ab6d-4b0e-9fba-2b6042f2668c","capabilities":
> {"acceptInsecureCerts":true,"browserName":"firefox","browserVersion":"62.0.
> 3","moz:accessibilityChecks":false,"moz:geckodriverVersion":"0.23.0","moz:
> headless":true,"moz:processID":31588,"moz:profile":"/tmp/rust_mozprofile.
> R7spKBBY2taE","moz:useNonSpecCompliantPointerOrigin":false,"moz:
> webdriverClick":false,"pageLoadStrategy":"normal","platformName":"linux",
> "platformVersion":"4.15.0-33-generic","rotatable":false,"timeouts":
> {"implicit":0,"pageLoad":300000,"script":30000}}}}
> 1538957304233   webdriver::server       DEBUG   -> POST
> /session/7105b163-ab6d-4b0e-9fba-2b6042f2668c/url {"url":
> "https:\/\/en.wikipedia.org\/wiki\/Firefox"}
> 1538957304235   Marionette      TRACE   0 ->
> [0,2,"WebDriver:Navigate",{"url":"https://en.wikipedia.org/wiki/Firefox"}]
> 1538957304243   Marionette      DEBUG   [2147483649] Received DOM event
> beforeunload for about:blank
> 1538957305293   Marionette      DEBUG   [2147483649] Received DOM event
> pagehide for about:blank
> 1538957306454   Marionette      DEBUG   [2147483649] Received DOM event
> DOMContentLoaded for https://en.wikipedia.org/wiki/Firefox
> 1538957307058   Marionette      DEBUG   [2147483649] Received DOM event
> pageshow for https://en.wikipedia.org/wiki/Firefox
> 1538957307061   Marionette      TRACE   0 <- [1,2,null,{"value":null}]
> 1538957307062   webdriver::server       DEBUG   <- 200 OK {"value":null}
> 1538957307063   webdriver::server       DEBUG   -> POST
> /session/7105b163-ab6d-4b0e-9fba-2b6042f2668c/element {"using":"tag
> name","value": "html"}
> 1538957307066   Marionette      TRACE   0 ->
> [0,3,"WebDriver:FindElement",{"using":"tag name","value":"html"}]
> 1538957307258   Marionette      TRACE   0 <-
> [1,3,null,{"value":{"element-6066-11e4-a52e-4f735466cecf":"aafffe0a-7a28-
> 458e-b159-d73575f4987f","ELEMENT":"aafffe0a-7a28-458e-b159-d73575f4987f"}}]
> 1538957307259   webdriver::server       DEBUG   <- 200 OK
> {"value":{"element-6066-11e4-a52e-4f735466cecf":"aafffe0a-7a28-458e-b159-
> d73575f4987f"}}
> 1538957307264   webdriver::server       DEBUG   -> GET
> /session/7105b163-ab6d-4b0e-9fba-2b6042f2668c/element/aafffe0a-7a28-458e-
> b159-d73575f4987f/name
> 1538957307266   Marionette      TRACE   0 ->
> [0,4,"WebDriver:GetElementTagName",{"id":"aafffe0a-7a28-458e-b159-
> d73575f4987f"}]
> 1538957307326   Marionette      TRACE   0 <- [1,4,null,{"value":"html"}]
> 1538957307327   webdriver::server       DEBUG   <- 200 OK {"value":"html"}
> 1538957307329   webdriver::server       DEBUG   -> GET
> /session/7105b163-ab6d-4b0e-9fba-2b6042f2668c/element/aafffe0a-7a28-458e-
> b159-d73575f4987f/screenshot
> 1538957307330   Marionette      TRACE   0 ->
> [0,5,"WebDriver:TakeScreenshot",{"element":{"element-6066-11e4-a52e-
> 4f735466cecf":"aafffe0a-7a28-458e-b159-d73575f4987f"},"full":false,
> "highlights":[]}]
> 1538957307479   Marionette      TRACE   0 <-
> [1,5,null,{"value":"iVBORw0KGgoAAAANSUhEUgAABUwAAAK2CAYAAACVVtY/
> AAAgAElEQVR4nOzdd3hb953ne+29++TO7ObZ3SnZTMnOJt7szGRnMsnOJHcmy ...
> Qsh0KhQIZKhd179ojhlo5vGUwpjSCDKaVUKhlMCSGEEBILcP9CnxbtvQ5MmDABHR36MZlv/
> foSlJRsiPr7pk/uWOzd/gHFgBNY6FKZ1AAAAABJRU5ErkJggg=="}]
> 1538957307531   webdriver::server       DEBUG   <- 200 OK {"value":"REMOVED
> BASE64 IMAGE TO CUT SPACE"}
> 
> 
> Expected results:
> 
> You should have gotten a full page screenshot since the html element
> contains all the content. If you run firefox without headless mode enabled,
> you will receive a full page screenshot instead of the cropped one above.
> 
> I tested this on Windows 64bit & Ubuntu Server, it happens on both platforms
> with the same gecko driver version and firefox version.

I forgot to fill out the actual results all the way. What happens is you get a cropped screenshot of the html element instead of a full page screenshot. This is not supposed to happen as if you run Firefox without headless mode enabled you will get a full page screenshot of the html element.
Hi,

Can you please give me the exact steps of how you create the printscreen in Headless mode?
Flags: needinfo?(matt)
(In reply to David Olah from comment #2)
> Hi,
> 
> Can you please give me the exact steps of how you create the printscreen in
> Headless mode?

Sure,

I'd be happy to. Here are the exact steps I did to attempt to screenshot the entire page of this wikipedia page: https://en.wikipedia.org/wiki/Firefox
(Please note: This fails on all pages I've tested, I just chose this page for an example)

1. Run Geckodriver and create a new session
(I'm using version: v0.23.0)
(Firefox version: 62.0.3 (64-bit))
(Test on Linux & Windows, same results)

2. Find the html element id on the page using the (gecko driver element selector command)

3. Then take a screenshot using the (gecko driver element screenshot command) and providing the html element id.

4. Base64 decode the result and save the image to a png file.

5. Upon inspection of the png file saved, you will notice only a small top portion of the html element has been captured, the rest of the page is missing.

If you perform these exact steps with firefox not running in headless mode, you will have a png file that shows the entire html element, a full screenshot. But when running in headless mode you only get a small portion of the top.

I hope this helps, if you need any further info please let me know.

Thanks.
Flags: needinfo?(matt)
Component: Untriaged → Headless
Summary: Marionette Element Screenshot Cropped In Headless Mode on Linux → Screenshot of root element taken with Marionette is cropped to visible viewport
Priority: -- → P3
Severity: normal → S3
You need to log in before you can comment on or make changes to this bug.