Hide blocked user in Youtube Live

Youtubeのライブでブロック済みのユーザのチャットを動的に非表示に変更

As of 2020-07-02. See the latest version.

// ==UserScript==
// @name         Hide blocked user in Youtube Live
// @namespace    https://twitter.com/rin_jugatla
// @version      0.1
// @description  Youtubeのライブでブロック済みのユーザのチャットを動的に非表示に変更
// @author       rin_jugatla
// @match        https://www.youtube.com/*
// @grant        none
// ==/UserScript==

// ブロックしたユーザの確認
// https://myaccount.google.com/blocklist

// 【Javascript】XPathを使う(document.evaluate)
// https://www.softel.co.jp/blogs/tech/archives/2067
document.getElementsByXPath = function (expression, parentElement) {
    var r = []
    var x = document.evaluate(expression, parentElement || document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null)
    for (var i = 0, l = x.snapshotLength; i < l; i++) {
        r.push(x.snapshotItem(i))
    }
    return r
}

// ページの読み込み完了後にフック
window.addEventListener('load', function () {
    var watchTree = document.getElementsByXPath('//div[@id="items" and @class="style-scope yt-live-chat-item-list-renderer"]')[0]

    // 非表示でないブロック済みのメッセージのみ取得するXPath
    var targetsXPath = '//yt-live-chat-text-message-renderer[@class="style-scope yt-live-chat-item-list-renderer" and not(@style="display: none;")]/div[@id="content"]/span[@id="deleted-state" and not(text() = "")]'

    function hideBlockedUser() {
            var targets = document.getElementsByXPath(targetsXPath)
            for(var i = 0; i < targets.length; i++)
            {
                targets[i].parentElement.parentElement.style = "display: none;";
            }
    }

    var mo = new MutationObserver(hideBlockedUser);
    mo.observe(watchTree, { childList: true });
}, false);