Email or username:

Password:

Forgot your password?
Terence Eden

Boring technical question which neither the documentation nor ChatGPT can answer.

I want to automate screenshots using #Python's #Selenium Webdriver with #Chrome.

This works - but the non-logged in experience of Twitter forces dark-mode.

I want a light-mode screenshot.

I can't find a way to set SEC-CH-PREFERS-COLOR-SCHEME in Selenium. Nor can I find a light-mode toggle for non-logged in Twitter users.

Any clues gang?

(I want to automate replacing my Twitter embeds with a screenshot.)

8 comments
Terence Eden

Aha! There's a way to cheat!

The old Twitter embed API lets you manually specify colour scheme - and is easy to screenshot.

For example: platform.twitter.com/embed/Twe

Hopefully I can replace all the Twitter embeds on my website with images (and, yes, I will add alt text).

Thanks @samir for giving me the inspiration.

Terence Eden

Any #Selenium experts in the house?

All my screenshots are slightly fuzzy. Why?!?!

I'm using the Chromium webdriver. Grabbing the area with `element.screenshot_as_png`

Is it because I have fractional scaling? Wayland?

I have set `chrome_options.add_argument("--ozone-platform=wayland")` but to no avail.

This'll be a two-drink minimum problem, I reckon.

Terence Eden

OK, if you have lots of Twitter embeds in your website, I've written an easy(ish) way to replace them with static images & alt text.

github.com/edent/Tweet2Img

Run:
`python tweet2img.py 1234`

And you'll get a ready-to-paste piece of HTML with a data-encoded image.

`<a href="https:/ /twitter.com/edent/status/123"><img src="data:image/webp;base64,Ukl..." width="550" height="439" alt="text from tweet."/></a>`

It also saves the WebP and alt text if you need them.

OK, if you have lots of Twitter embeds in your website, I've written an easy(ish) way to replace them with static images & alt text.

github.com/edent/Tweet2Img

Run:
`python tweet2img.py 1234`

And you'll get a ready-to-paste piece of HTML with a data-encoded image.

`<a href="https:/ /twitter.com/edent/status/123"><img src="data:image/webp;base64,Ukl..." width="550" height="439" alt="text from tweet."/></a>`

Terence Eden

Someone complained that an image with decent alt text wasn't accessible.

So now I'm practising Spite-Driven-Development to create a semantic HTML embed.

Doesn't look *totally* accurate - but not bad for a dozen lines of CSS.

Terence Eden

Spite-Driven-Development continues.

I now have a scrap of semantic HTML which adequately replicates an embedded Tweet.

TODO:

* Add images
* Add entities (hashtags, mentions, links)
* Add parent of thread
* Add quoted tweet
* Add ... whatever else

Should be able to hijack the embed API to get most metadata (no number or replies / retweets though).

Terence Eden

Parents and Quotes are just <blockquotes> within <blockquotes>. So that was easy!

Terence Eden

I think that's good enough for the basics.

This code will (eventually) convert all your embedded Tweets into proper semantic HTML without any tracking back to Twitter.

Rough code at:
github.com/edent/Tweet2Embed

Terence Eden

OK gang! This is ready for you to test.

python tweet2html.py --css 1234

That will take a Twitter ID and return HTML and CSS for you to embed in your website with no calling back to Twitter.

Features:
🗣 Avatars inlined as Base64 WebP
📸 All attached photos inlined
🎥 Video poster inline, <video> to original source
🔗 Hyperlinks don't use t.co
#️⃣ Hashtags and @ mentions linked
🕰 Semantic time
♥ and 🗨 counts

Try it out at github.com/edent/Tweet2Embed

Feedback and pull requests very welcome!

OK gang! This is ready for you to test.

python tweet2html.py --css 1234

That will take a Twitter ID and return HTML and CSS for you to embed in your website with no calling back to Twitter.

Features:
🗣 Avatars inlined as Base64 WebP
📸 All attached photos inlined
🎥 Video poster inline, <video> to original source
🔗 Hyperlinks don't use t.co
#️⃣ Hashtags and @ mentions linked
🕰 Semantic time
♥ and 🗨 counts

Go Up