floodmeadows / Jira copy descriptive link

// ==UserScript==
// @name         Jira copy descriptive link
// @namespace    https://openuserjs.org/users/floodmeadows
// @description  Adds a button to copy the issue name, key, and link, ready to paste into messages etc.
// @copyright    2023, floodmeadows (https://openuserjs.org/users/floodmeadows)
// @license      MIT
// @version      0.3
// @include      https://jira.*.uk/browse/*
// @updateURL    https://openuserjs.org/meta/floodmeadows/Jira_copy_descriptive_link.meta.js
// @downloadURL  https://openuserjs.org/install/floodmeadows/Jira_copy_descriptive_link.user.js
// @grant        none
// ==/UserScript==

/* jshint esversion: 6 */

(function () {
    'use strict';

    const target = document.getElementById('key-val').parentElement.parentElement; //<ol>
    addButton("Copy descriptive link", target, copyTextToClipboard);
    applyAdditionalFormatting();
})();

function constructTextForClipboard() {
    const issueKey = document.getElementById("key-val").childNodes[0].nodeValue;
    const issueName = document.getElementById("summary-val").childNodes[0].nodeValue;

    var textForClipboard = new Object();
    textForClipboard.text = `'${issueName}' (${document.URL})`;
    textForClipboard.html = `<a href="${document.URL}">'${issueName}' (${issueKey})</a>`;

    return textForClipboard;
}

function addButton(buttonText, target, callbackFunction) {
    const button = document.createElement("button");
    button.addEventListener("click", callbackFunction);
    button.setAttribute("id","copy-descriptive-link");
    button.setAttribute("class","aui-button");
    target.after(button);
    const textNode = document.createTextNode(buttonText);
    button.appendChild(textNode);
}

function applyAdditionalFormatting() {
    document.getElementById('key-val').parentElement.parentElement.style.display = "inline-block";
    document.getElementById('summary-val').style.display = "block";
    document.getElementById('copy-descriptive-link').style.display = "inline-block";
    document.getElementById('copy-descriptive-link').style.border = "none";
    document.getElementById('copy-descriptive-link').style.padding = "0.4em 0.8em";
}

function copyTextToClipboard() {
    console.log("copyTextToClipboard() called.");

    const textForClipboard = constructTextForClipboard();

    const contentTypeText = "text/plain";
    const contentTypeHtml = "text/html";
    const blobText = new Blob([textForClipboard.text], { type: contentTypeText });
    const blobHtml = new Blob([textForClipboard.html], { type: contentTypeHtml });
    const data = new ClipboardItem({
        [contentTypeText]: blobText,
        [contentTypeHtml]: blobHtml
    });

    navigator.clipboard
        .write([data])
        .then(
            (response) => {
                console.log("Success writing to the clipboard.");
                console.log(new Array(textForClipboard.text, textForClipboard.html));
            },
            (response) => {
                console.log("Error writing to the clipboard: " + response.text);
            }
        );
}