Remove overlay above Instagram images and select the highest res img. - GreaseMonkey / TamperMonkey userscript.

naked-instagram.js

// ==UserScript==
// @name         Naked Instagram
// @namespace    http://www.instagram.com/
// @version      0.1
// @description  Remove overlay above Instagram images and select the highest res img.
// @author       André Kugland
// @match        http*://*.instagram.com/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    const processImage = el => {
        // Remove overlay.
        try {
            el.parentElement.parentElement.querySelector('div:empty').remove();
        } catch (err) {
            console.info(err);
        }
        // Select highest res img.
        try {
            el.sizes = '9999px';
            if (el.srcset) {
                el.src = el.srcset.split(/,/).map(url => [parseInt(url.replace(/^.* (\d+)w$/, '$1')), url.split(/ /)[0]]).sort((a, b) => b[0] - a[0])[0][1];
                el.removeAttribute('srcset');
            }
        } catch (err) {
            console.info(err);
        }
    }

    const observer = new MutationObserver(mutations => {
        const matched = [];
        for (const mutation of mutations) {
            const {addedNodes} = mutation;
            for (const n of addedNodes) {
                if (!n.tagName) {
                    continue;
                }
                if (n.matches('img')) {
                    matched.push(n);
                } else {
                    matched.push(...n.querySelectorAll('img'));
                }
            }
        }
        setTimeout(() => {
            for (const el of matched) {
                try {
                    if (el.matches('[style="object-fit: cover;"]')) {
                        processImage(el);
                    }
                } catch (err) { }
            }
        }, 100);
    });

    observer.observe(document.querySelector('#react-root'), {
        subtree: true,
        childList: true,
    });

    for (const el of document.querySelectorAll('[style="object-fit: cover;"]')) {
        processImage(el);
    }

})();