Twitter Userscript - no unread bothers in title & favicon

twitter-no-bother.user.js

// ==UserScript==
// @name         Twitter - no unread bothers in title & favicon
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  Wanting to leave a tweet open for reference but the (1)
//               in the title or the red dot in the favicon make you check
//               notifications? This script removes both!
// @author       @Malcolm_Ocean
// @match        https://twitter.com/*
// @grant        none
// ==/UserScript==

// shoutout to the folks in https://stackoverflow.com/questions/2497200/how-to-listen-for-changes-to-the-title-element
// for the idea of using document.__defineSetter__ and MutationObserver

(() => {
  'use strict'

  // this fixes the unread notification count in the title
  setTimeout(() => {
    document.__defineSetter__('title', (val='') => {
      if (document.querySelector('title')) {
        document.querySelector('title').childNodes[0].nodeValue = val.replace(/^\(\d+.?\) */, '')
      }
    })
  }, 300) // don't init immediately because title elem doesn't exist initially

  // this removes the red pip that appears when you have a new notification
  // https://abs.twimg.com/favicons/twitter-pip.ico
  const faviconElement = document.querySelector('[rel="shortcut icon"]')
  const observer = new MutationObserver((mutationsList, observer) => {
    if (faviconElement.href !== 'https://abs.twimg.com/favicons/twitter.ico') {
      faviconElement.href = 'https://abs.twimg.com/favicons/twitter.ico'
    }
  })
  observer.observe(faviconElement, {attributes: true})


  let styles = ''
  
  // these next couple lines hide the unread count on the word Notifications
  // on the left side sidebar. remove or comment them out if unwanted
  styles += `
    [aria-label*="Notifications"] [aria-label*=" unread item"] {
      display: none !important;
    }
  `
  // this bit in the if statement hides the entire sidebar & back button at the top
  // when you've loaded a single tweet directly
  // so that you're also not seeing the notification count in the sidebar,
  // nor can you easily click to go back to the feed.
  // if you don't want that, just comment out or remove this section
  if (/status/.test(location.href)) {
    styles += `header[role="banner"] {display:none}
                   div[aria-label="Back"] {display: none;}
                   /*div.r-18qmn74 {display: none;}*/ /* this breaks other stuff... */
                   main {margin-left: 30px;}
     `
  }

  let stylesheet = document.createElement('style')
  stylesheet.appendChild(document.createTextNode(""))
  stylesheet.innerHTML = styles
  stylesheet.rel = 'stylesheet'
  document.body.appendChild(stylesheet)
})()