Asana - Copy Unique Task URL

user.js

// ==UserScript==
// @name         Asana - Copy Unique URL
// @namespace    http://tampermonkey.net/
// @version      0.2
// @description  Shows the truly unique URL of the Asana task
// @author       Radoslaw Mejer <radmen [at] radmen.info>
// @match        https://app.asana.com/0/*/*
// @icon         data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==
// @grant        none
// @run-at       document-idle
// ==/UserScript==

(function() {
    'use strict';

    let taskId = null;

    function onChange() {
        const taskEl = document.querySelector('.TaskPane[data-task-id]');

        if (! taskEl) {
            taskId = null
            return;
        }

        const newTaskId = taskEl
            ? taskEl.dataset.taskId
            : null;

        if (newTaskId === taskId) {
            return;
        }

        taskId = newTaskId;

        const copyButton = taskEl.querySelector('.TaskPaneToolbar-copyLinkButton');

        if (! copyButton) {
            return;
        }

        const clonedEl = copyButton.cloneNode(true);
        clonedEl.style.fill = '#3da6f2';
        clonedEl.addEventListener('click', function () {
            prompt('', `https://app.asana.com/0/0/${taskId}/f`);
        });

        copyButton.parentNode.replaceChild(clonedEl, copyButton);
    }

    const rootEl = document.getElementById('asana_main_page')
        ?? document.getElementById('asana_full_page');

    if (! rootEl) {
        return;
    }

    const observer = new MutationObserver(onChange);
    observer.observe(rootEl, {
        subtree: true,
        childList: true,
    });
})();