Return to Question

To my understanding the ChromeDriver itself doesn't set the background, the CSS does. Therefore if the background is transparent, why am I not getting transparent screenshots?

This is the screenshot of the supposedly transparent website: Same screenshot but with a red div in the background to show where the transparency should lie:

Here is my code:

from selenium import webdriver from selenium.webdriver.support.ui import WebDriverWait from selenium.webdriver.support import expected_conditions as EC from selenium.webdriver.common.by import By from datetime import datetime options = webdriver.ChromeOptions() options.add_argument('headless') driver = webdriver.Chrome(chrome_options=options) driver.set_window_size(2560, 1600) driver.get('https://twitter.com/realDonaldTrump/status/516382177798680576') # driver.execute_script("$('body').append(`<div style='background: red; width: 100%; height: 100%;'></div>`);") driver.save_screenshot('screenshots/' + str(datetime.now()) + '.png') driver.quit() 

How would I be able to create the transparent version of that screenshot?

*** EDIT *** I made a gist of how I accomplished this. The accepted answer helped me get to the point where I could figure it out and that is what I wanted. This gist, however, is the correct solution to my problem: https://gist.github.com/colexyz/f58834ff09ab07e3c1164667b753e77a

To my understanding the ChromeDriver itself doesn't set the background, the CSS does. Therefore if the background is transparent, why am I not getting transparent screenshots?

This is the screenshot of the supposedly transparent website: Same screenshot but with a red div in the background to show where the transparency should lie:

Here is my code:

from selenium import webdriver from selenium.webdriver.support.ui import WebDriverWait from selenium.webdriver.support import expected_conditions as EC from selenium.webdriver.common.by import By from datetime import datetime options = webdriver.ChromeOptions() options.add_argument('headless') driver = webdriver.Chrome(chrome_options=options) driver.set_window_size(2560, 1600) driver.get('https://twitter.com/realDonaldTrump/status/516382177798680576') # driver.execute_script("$('body').append(`<div style='background: red; width: 100%; height: 100%;'></div>`);") driver.save_screenshot('screenshots/' + str(datetime.now()) + '.png') driver.quit() 

How would I be able to create the transparent version of that screenshot?

*** EDIT *** I made a gist of how I accomplished this. The accepted answer helped me get to the point where I could figure it out and that is what I wanted. This gist, however, is the correct solution to my problem: https://gist.github.com/colecrtr/f58834ff09ab07e3c1164667b753e77a

To my understanding the ChromeDriver itself doesn't set the background, the CSS does. Therefore if the background is transparent, why am I not getting transparent screenshots?

This is the screenshot of the supposedly transparent website: Same screenshot but with a red div in the background to show where the transparency should lie:

Here is my code:

from selenium import webdriver from selenium.webdriver.support.ui import WebDriverWait from selenium.webdriver.support import expected_conditions as EC from selenium.webdriver.common.by import By from datetime import datetime options = webdriver.ChromeOptions() options.add_argument('headless') driver = webdriver.Chrome(chrome_options=options) driver.set_window_size(2560, 1600) driver.get('https://twitter.com/realDonaldTrump/status/516382177798680576') # driver.execute_script("$('body').append(`<div style='background: red; width: 100%; height: 100%;'></div>`);") driver.save_screenshot('screenshots/' + str(datetime.now()) + '.png') driver.quit() 

How would I be able to create the transparent version of that screenshot?

To my understanding the ChromeDriver itself doesn't set the background, the CSS does. Therefore if the background is transparent, why am I not getting transparent screenshots?

This is the screenshot of the supposedly transparent website: Same screenshot but with a red div in the background to show where the transparency should lie:

Here is my code:

from selenium import webdriver from selenium.webdriver.support.ui import WebDriverWait from selenium.webdriver.support import expected_conditions as EC from selenium.webdriver.common.by import By from datetime import datetime options = webdriver.ChromeOptions() options.add_argument('headless') driver = webdriver.Chrome(chrome_options=options) driver.set_window_size(2560, 1600) driver.get('https://twitter.com/realDonaldTrump/status/516382177798680576') # driver.execute_script("$('body').append(`<div style='background: red; width: 100%; height: 100%;'></div>`);") driver.save_screenshot('screenshots/' + str(datetime.now()) + '.png') driver.quit() 

How would I be able to create the transparent version of that screenshot?

*** EDIT *** I made a gist of how I accomplished this. The accepted answer helped me get to the point where I could figure it out and that is what I wanted. This gist, however, is the correct solution to my problem: https://gist.github.com/colexyz/f58834ff09ab07e3c1164667b753e77a

To my understanding the ChromeDriver itself doesn't set the background, the CSS does. Therefore if the background was transparent, why am I not getting transparent screenshots?

This is the screenshot of the supposedly transparent website: Same screenshot but with a red div in the background to show where the transparency should lie:

Here is my code:

from selenium import webdriver from selenium.webdriver.support.ui import WebDriverWait from selenium.webdriver.support import expected_conditions as EC from selenium.webdriver.common.by import By from datetime import datetime options = webdriver.ChromeOptions() options.add_argument('headless') driver = webdriver.Chrome(chrome_options=options) driver.set_window_size(2560, 1600) driver.get('https://twitter.com/realDonaldTrump/status/516382177798680576') # driver.execute_script("$("body").append("<div style='background: red; width: 100%; height: 100%;'></div>");") driver.save_screenshot('screenshots/' + str(datetime.now()) + '.png') driver.quit() 

How would I be able to create the transparent version of that screenshot?

To my understanding the ChromeDriver itself doesn't set the background, the CSS does. Therefore if the background is transparent, why am I not getting transparent screenshots?

This is the screenshot of the supposedly transparent website: Same screenshot but with a red div in the background to show where the transparency should lie:

Here is my code:

from selenium import webdriver from selenium.webdriver.support.ui import WebDriverWait from selenium.webdriver.support import expected_conditions as EC from selenium.webdriver.common.by import By from datetime import datetime options = webdriver.ChromeOptions() options.add_argument('headless') driver = webdriver.Chrome(chrome_options=options) driver.set_window_size(2560, 1600) driver.get('https://twitter.com/realDonaldTrump/status/516382177798680576') # driver.execute_script("$('body').append(`<div style='background: red; width: 100%; height: 100%;'></div>`);") driver.save_screenshot('screenshots/' + str(datetime.now()) + '.png') driver.quit() 

How would I be able to create the transparent version of that screenshot?