YouTube Formatting Toolbar

YouTube Comment.md

JavaScript code to add Formatting Toolbar

Plz!! Run Script After You click an input-box of comment text!

JavaScript As URL

Add it as bookmark:

1. Drag and drop any url to bookmarks list
2. Edit Bookmark , Rename it to anything you wanna and Change URL to this:

javascript:(function(){function addButtons(){var e={strikethrough:"-",italic:"_",bold:"*"},t=Object.keys(e);for(let n=0;n<3;n++){let o=document.createElement("button");o.style.margin="0px 2px",o.textContent=t[n],o.addEventListener("click",function(){/\r?\n/.test(window.getSelection().toString().trim())?getTextElement().forEach(o=>o.textContent=o.textContent.trim().replace(/$|^/g,e[t[n]])):window.getSelection().baseNode.textContent=window.getSelection().baseNode.textContent.replace(window.getSelection().toString().trim(),window.getSelection().toString().trim().replace(/$|^/g,e[t[n]]))}),document.querySelector(".ytd-commentbox > #buttons").prepend(o)}}function getTextElement(){let e=window.getSelection().getRangeAt(0),t=document.createNodeIterator(e.commonAncestorContainer,NodeFilter.SHOW_ALL,{acceptNode:function(e){return NodeFilter.FILTER_ACCEPT}}),n=[];for(;t.nextNode()&&(0===n.length&&t.referenceNode!==e.startContainer||(t.referenceNode.constructor!=Text||/^\s$/.test(t.referenceNode.textContent)||n.push(t.referenceNode),t.referenceNode!==e.endContainer)););return n}addButtons();})()

3. After You click an input-box of comment text, run this bookmark...
4. Enjoy

Code:

function addButtons(){
var replaceTextBy = {strikethrough: "-", italic:"_", bold: "*"};
var nameOfButtons = Object.keys(replaceTextBy)
for (let i =0 ; i < 3; i++){
let button_ = document.createElement("button");
button_.style.margin = "0px 2px";
button_.textContent = nameOfButtons[i]
    button_.addEventListener("click", function(){
            if(!/\r?\n/.test(window.getSelection().toString().trim())){
                window.getSelection().baseNode.textContent = 
                window.getSelection().baseNode.textContent.replace(window.getSelection().toString().trim(), 
                window.getSelection().toString().trim().replace(/$|^/g, replaceTextBy[nameOfButtons[i]]))  
             }else{
                getTextElement().forEach((el)=> el.textContent = el.textContent.trim().replace(/$|^/g, replaceTextBy[nameOfButtons[i]]))
             }
             
    })
    document.querySelector(".ytd-commentbox > #buttons").prepend(button_)
}

}
function getTextElement(){
let range = window.getSelection().getRangeAt(0)
let _iterator = document.createNodeIterator(
    range.commonAncestorContainer,
    NodeFilter.SHOW_ALL, // pre-filter
    {
        // custom filter
        acceptNode: function (node) {
            return NodeFilter.FILTER_ACCEPT;
        }
    }
);

let _nodes = [];
while (_iterator.nextNode()) {
    if (_nodes.length === 0 && _iterator.referenceNode !== range.startContainer) continue;
    if(_iterator.referenceNode.constructor == Text && !/^\s$/.test(_iterator.referenceNode.textContent)){
        //console.log();
        _nodes.push(_iterator.referenceNode);
    }
    if (_iterator.referenceNode === range.endContainer) break;
}
return _nodes
}

addButtons()