はてな匿名ダイアリー（増田）のトラバツリーを開閉するTamperMonkeyスクリプト

増田でこの記事を見つけて、TamperMonkeyで出来そうだったからやってみました。

anond.hatelabo.jp

動作保証もサポートもする気はないので、使い方が分からなかった人とか環境か何かで動かなかった人は潔く諦めてくださいね。

// ==UserScript==
// @name         増田のトラバツリーを開閉
// @namespace    http://tampermonkey.net/
// @version      2024-05-06
// @description  try to take over the world!
// @author       You
// @match        https://anond.hatelabo.jp/*
// @icon         https://anond.hatelabo.jp/images/favicon.ico
// @grant        none
// ==/UserScript==

(function() {
  'use strict';
  if (location.pathname.match('/[0-9]+(/|$)') == null) {
    return
  }

  const buttonClicked = e => {
    if (e.target != null) {
      if (e.target.textContent == '🔽') {
        e.target.textContent = '🔺'
        e.target.parentNode.parentNode.className = 'trackback-closed'
      } else if (e.target.textContent == '🔺') {
        e.target.textContent = '🔽'
        e.target.parentNode.parentNode.className = ''
      }
    }
  }

  const processListItem = li => {
    if (li.querySelectorAll(':scope > ul > li').length <= 0) {
      return
    }

    const header = li.querySelector('.trackback-header')
    if (header != null) {
      header.insertAdjacentHTML('beforeend', `
        <button type="button" class="close-trackback">🔽</button>
      `)
      header.querySelector('.close-trackback')
        .addEventListener('click', buttonClicked)
    }
    Array.from(li.querySelectorAll(':scope > ul > li'))
      .map(child => processListItem(child))
  }

  Array.from(document.querySelectorAll('.refererlist > ul > li'))
    .map(li => processListItem(li))

  document.head.insertAdjacentHTML('beforeend', `
    <style>
      .close-trackback { border: 0 }
      .trackback-closed > ul { display: none }
    </style>
  `)
})();