Email or username:

Password:

Forgot your password?
Terence's posts Post Back to profile
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.)

7 August at 9:50 | Open on mastodon.social
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.

7 August at 10:08 | Open on mastodon.social
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.

A slightly blurry screenshot from Twitter.
8 August at 21:17 | Open on mastodon.social
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>`

9 August at 12:46 | Open on mastodon.social
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.

Screenshot of an HTML page and source code.
9 August at 20:54 | Open on mastodon.social
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).
10 August at 7:31 | Open on mastodon.social
Terence Eden

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

HTML page showing a simulation of embedded Tweets.
10 August at 7:47 | Open on mastodon.social
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

An embedded Tweet in a website. It looks almost like - but not identical - to the real thing.
10 August at 10:35 | Open on mastodon.social
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

Screenshot of an embedded Tweet - there is a video attached with a native player. All links, hashtags, and user mentions work.
10 August at 17:20 | Open on mastodon.social
Go Up