Whatsapp Emoji-Replacer

whatsapp-emoji-replacer.user.js

// ==UserScript==
// @name         WhatsApp Emoji-Replacer
// @namespace    https://leonbrandt.com
// @homepage     https://leonbrandt.com
// @updateURL    https://gist.github.com/leonbrandt/92c0bd9fc2d26ca14100073557310ef5/raw/whatsapp-emoji-replacer.user.js
// @version      1.0.0
// @description  Don't ask
// @author       Leon Brandt
// @match        http*://web.whatsapp.com/*
// @grant        none
// @run-at       document-idle
// ==/UserScript==

const MESSAGE_SPACE_SELECTOR = `div#main div[data-tab="8"]`;

const replacements = [
    { from: "🤷🏼‍♂️", to: "/img/ca4d318e0a1519cffe6030ba0fbd2bf1_w_2471-64.png" }
];

let injectionObserver;

function applyReplacements() {
    console.log("APPLYING REPLACEMENTS");

    const buildWhatsappEmojiQuerySelector = (from) => `img[data-plain-text="${from}"]`;

    replacements.forEach(r => {
        document.querySelectorAll(buildWhatsappEmojiQuerySelector(r.from)).forEach(e => {
            e.setAttribute("src", r.to);
        });
    });
}

function inject() {
    console.log("INJECTING");

    injectionObserver.disconnect();

    applyReplacements();

    new MutationObserver(() => {
        applyReplacements();
    }).observe(document.querySelectorAll(MESSAGE_SPACE_SELECTOR)[0], { childList: true });
}

function observeReady() {
    injectionObserver = new MutationObserver(() => {
        if(document.querySelectorAll(MESSAGE_SPACE_SELECTOR).length > 0) {
            inject();
        }
    });

    injectionObserver.observe(document.documentElement || document.body, { childList: true, subtree: true });
}

(function() {
    'use strict';

    observeReady();
})();