Bug: When screenshotting a very long element, text at the bottom of the image is saved with a black background

[void4]

System

• Version: geckodriver 0.33.0 (a80e5fd61076 2023-04-02 18:31 +0000)
• Platform: Ubuntu 20.04.6 LTS
• Firefox: Mozilla Firefox 117.0 is installed on the system
• Selenium: 4.1.3 (pretty old (?), but newer versions don't work in my specific setup)

Problem

When taking a screenshot of a very long (vertically large) element on a page (e.g. https://icebergcharts.com/i/The_Complete_Geometry_Dash?watermark=true), text at the bottom of the page gets a black background in the image that isn't there on the original page. Note that in this case this only affects four "rows" at the very bottom of the page.

Testcase

from time import sleep

from selenium import webdriver

def snap(url, target):

    geckopath = "/home/test/geckodriver"

    opt = webdriver.FirefoxOptions()
    opt.add_argument('-headless')
    opt.add_argument("--width=1920")
    opt.add_argument("--height=1080")

    if DEBUG:
        print("starting webdriver")

    driver = webdriver.Firefox(executable_path=geckopath, options=opt)
    try:
        print("getting url")
        driver.get(url)

        print("sleeping")
        sleep(3)

        print("taking screenshot")
        element = driver.find_element_by_id("iceberg")
        element_png = element.screenshot_as_png
        with open(target, "wb") as file:
            file.write(element_png)

    finally:
        driver.quit()

snap("https://icebergcharts.com/i/The_Complete_Geometry_Dash?watermark=true", "snapshot.png")

[whimboo]

For me only the very last line, which is the footer, is not getting a background. Is that what you mean? I do not see 4 rows. Does the screenshot work when you only screenshot this particular element? If you could test that I would appreciate. Thanks!

[void4]

Ah, sorry, should have been more specific, I mean this:

The black rectangles behind the text are not there on the page

[whimboo]

I can see that now as well. The internal print as PDF feature of Firefox doesn't seem to produce that. Interesting is that we basically use the exact same API for it. Would you mind to maybe reduce this very huge test case? It would be much easier to investigate or point to a specific known bug when the HTML / CSS would be minimized.

[void4]

I can, but give me a few days. There seem to be more text-related problems when it comes to long pages, such as incompletely rendered text (see the "Exen is legi?" entry on the left), and also text not appearing at all on very long pages.

I can't tell if this is a problem with the Geckodriver, or maybe just due to rendering taking so long for the browser, and me waiting not long enough to take a screenshot (?), or maybe something related to the full view not being always rendered for efficiency, which then causes elements to be missing in the screenshot.

[whimboo]

Sure no worries. It most likely wont be a priority right now for geckodriver, but in case its a bug in Gecko itself we could more easily find a solution then. Thanks!

[whimboo]

@void4 I wanted to check back if you had a chance to find / create a minimized testcase for this scenario. If not we may have to work with the full page to figure out what's wrong. Thanks.

[void4]

No, not yet - I'm currently focusing on other things, so this isn't a priority for me, though it would be nice to see a solution