🚨 OUTDATED AND BROKEN ON CURRENT DESIGN 🚨 Tampermonkey userscript to hide comments on YouTube with a toggle on/off button

tampermonkey-hide-youtube-comments.js

// ==UserScript==
// @name         Hide YouTube comments
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Hides YouTube comments.
// @author       gpoole
// @match        https://www.youtube.com/*
// @run-at       document-end
// @grant        none
// ==/UserScript==

/**
 * THIS SCRIPT DOESN'T WORK ANYMORE ON THE CURRENT VERSION OF YOUTUBE.
 * See: https://gist.github.com/gpoole/80bdf1161ab550f8429db31172a6e299?permalink_comment_id=5175033#gistcomment-5175033
 */

(function() {
    function injectStyles(styles) {
        const head = document.querySelector('head');
        const style = document.createElement('style');
        style.innerText = styles;
        head.appendChild(style);
    }

    async function getComments() {
      return new Promise((resolve) => {
            const interval = setInterval(() => {
                const comments = document.querySelector('ytd-comments');
                if (comments) {
                    resolve(comments);
                    clearInterval(interval);
                }
            }, 100);
        });
    }

    function template(html) {
      const el = document.createElement('div');
      el.innerHTML = html;
      return el;
    }

    window.hideComments = () => {
      document.documentElement.classList.add('comments-hidden');
    };

    window.showComments = () => {
      document.documentElement.classList.remove('comments-hidden');
    };

    async function init() {
        injectStyles(`
          .comments-hidden ytd-comments {
              display: none;
          }

          .comment-toggle {
            padding: 10px;
            border-radius: 3px;
            border: 0;
            font-weight: bold;
            text-transform: uppercase;
            margin: 0 auto;
            display: block;
            background-color: #242424;
            color: white;
          }

          html[dark="true"] .comment-toggle {
            background-color: #fafafa;
            color: black;
          }

          .show-comments {
            display: none;
          }

          .comments-hidden .hide-comments {
            display: none;
          }

          .comments-hidden .show-comments {
            display: block;
          }
        `);

        window.hideComments();

        const controls = template(`
          <button onclick="showComments();" class="show-comments comment-toggle">Show comments</button>
          <button onclick="hideComments();" class="hide-comments comment-toggle">Hide comments</button>
        `);

        const comments = await getComments();
        comments.before(controls);
    }

    init();
})();

Very nice, works great. Like the toggle option :)

Thx!

can u update this script it not showing the button anymore thanks

Sorry @folvos I don't use it anymore so it's out of date. I'll update to leave a note about that. I recommend https://github.com/DMCS20/improve-youtube if you're using a supported browser.