better-meet.js

// ==UserScript==
// @name         Better meet
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Just some UI adjustments.
// @author       anonymous
// @match        https://meet.google.com/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';
    const JOIN_LABEL = 'Join now';
    const PARTICIPANTS_LABEL = 'Participants';
    // simple helpers
    const getName = (node) => node.children[0].children[1].innerText.match(/(.+)(\n)?/)[1];

    // this will attach to the participants list if exists
    const runAttachList = (node) => {
        // UI ref to list
        const participants = node.querySelector(`[aria-label="${PARTICIPANTS_LABEL}"]`); // [role="list"]
        if (!participants) return false;

        console.info(`[better-meet] Attaching to the list of participants...`);

        const items = participants.children;
        // yourself
        const myself = items[0];
        const myName = getName(myself);
        let found = false;
        // anybody else
        for (let i = 1; i < items.length; i++) {
            const someone = items[i];
            const someoneName = getName(someone);
            if (myName < someoneName) {
                found = true;
                participants.insertBefore(myself, someone);
                console.info(`[better-meet] You are before "${someoneName}"`);
            }
        }
        // otherwise you are last
        if (!found) {
            participants.appendChild(myself);
            console.info(`[better-meet] You are the last!`);
        }

        return true;
    }

    // observe for DOM changes
    const observer = new MutationObserver((mutations) => {
        mutations.forEach((mutation) => {
            if (!mutation.addedNodes) return;

            for (let i = 0; i < mutation.addedNodes.length; i++) {
                const node = mutation.addedNodes[i]
                // console.log(node);
                // run attach list
                runAttachList(node);
            }
        });
    });
    // what to observe
    observer.observe(document.body, {
        childList: true,
        subtree: true,
        attributes: false,
        characterData: false
    });

    // stop watching using:
    //observer.disconnect()
})();