Raw Source Toggle Dropdown

• Minified Source

wuz / Twitter Show Alt Text

// ==UserScript==
// @name         Twitter Show Alt Text
// @namespace    https://wuz.sh/
// @version      0.1
// @description  See alt text on images on Twitter
// @author       Wuz
// @match        https://*.twitter.com/*
// @grant        none
// @copyright    2021, wuz (https://openuserjs.org/users/wuz)
// @license      MIT
// ==/UserScript==

(function() {
    'use strict';
    const targetNode = document.body;
    const callback = () => {
        const photos = Array.from(targetNode.querySelectorAll('[data-testid="tweetPhoto"]'));
        photos.forEach((photo) => {
            if(!photo.querySelector(".altDiv")) {
                const img = photo.querySelector("img");
                if(img.alt === 'Image') {
                    return;
                }
                const altDiv = document.createElement("div");
                altDiv.classList = "altDiv r-1qd0xha";
                altDiv.title = img.alt;
                altDiv.style.background = 'rgba(0, 0, 0, 0.6)';
                altDiv.style.color = "#fff";
                altDiv.style.padding = '10px';
                altDiv.style.display='grid';
                altDiv.style.placeItems= 'center';

                altDiv.appendChild(document.createTextNode(img.alt.slice(0, 47)+"..."));
                photo.appendChild(altDiv);
                console.log(altDiv);
            }
        });
    };
    const observer = new MutationObserver(callback);
    observer.observe(targetNode, { subtree: true, childList: true });
})();