YouTrack User JS - Add buttons for easier keyboard navigation of YouTrack.

youtrack.user.js

// ==UserScript==
// @name         YouTrack
// @namespace    https://gist.github.com/nfreear
// @version      0.1
// @description  Add buttons for easier keyboard navigation of YouTrack.
// @author       Nick Freear
// @match        https://*.myjetbrains.com/youtrack/issue*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=myjetbrains.com
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // Your code here...
    const QA_BTN_SELECTOR = 'button[ data-test = "Internal - QA" ]';
    const ADD_COMMENT_SEL = 'yt-add-comment';

    // const PG_FOOT;
    const BTNS = `
    <style>
    #an-ujs-buttons {
      background: rgba(240,240,240, .7);
      padding: .3rem;
      position: fixed;
      z-index: 99999;
    }
    #an-ujs-buttons > * {
      font-size: .9rem;
      padding: .2rem .5rem;
    }

    #an-ujs-foot { position: relative; z-index: 99999; border: 3px solid red; X-bottom: 0; }

    [data-an-focused = true ] {
      outline: 3px solid red;
      X-outline-offset: .5rem;
      transition: all 1s;
    }
    </style>
    <div id="an-ujs-buttons">
      <button data-act="goto-add-com">Goto comment form</button> |
      <button data-act="goto-qa">Goto QA - internal field</button>
    </div
    `;
    const BTN_WRAP = document.createElement('div');
    BTN_WRAP.innerHTML = BTNS;

    document.body.prepend(BTN_WRAP);

    const FOOT_EL = document.createElement('a');
    FOOT_EL.id = 'an-ujs-foot';
    FOOT_EL.href = '#';
    FOOT_EL.textContent = '[ foot ]';

    setTimeout(() => {
        const APP = document.querySelector('.app__container');

        APP.appendChild(FOOT_EL);
    },
    2000);

    BTN_WRAP.addEventListener('click', ev => {
        ev.preventDefault();

        if (!/(A|BUTTON)/.test(ev.target.tagName)) return;

        const ACT = ev.target.dataset.act;

        if (ACT === 'goto-qa') {
            const QA_BTN = document.querySelector(QA_BTN_SELECTOR);

            QA_BTN.dataset.anFocused = true;
            QA_BTN.focus();
        }

        if (ACT === 'goto-add-com') { // (ACT === 'goto-foot') {
            const ADD_COMMENT = document.querySelector(ADD_COMMENT_SEL);

            ADD_COMMENT.setAttribute('tabindex', '-1');
            ADD_COMMENT.focus();

            // FOOT_EL.focus();
        }

        console.debug('click', ACT, ev.target, ev);
    });

    console.debug('Hello tampermoney!, x');

    // Deprecated.
    function addFooterElem () {
        const FOOT_EL = document.createElement('a');
        FOOT_EL.id = 'an-ujs-foot';
        FOOT_EL.href = '#';
        FOOT_EL.textContent = '[ foot ]';

        setTimeout(() => {
            const APP = document.querySelector('.app__container');

            APP.appendChild(FOOT_EL);
        },
        2000);
    }
})();