Show HN: Two uBlock Origin rules to improve your Twitch experience

[Kyrio]

It might come down to taste, but I feel like a lot of the "features" Twitch has been adding have cluttered the interface while offering little of value for someone like me who just watches streams occasionally and isn't closely involved in community events.

But most importantly, I'm bothered by the non-dismissable popups that now appear over the video feed. They seem to be for extensions, but what features they provide evades me.

These two uBlock Origin rules (which you can add in the My Filters tab) will remove the main two modals that can pop up over the video:

  www.twitch.tv##.extensions-dock-card
  ext-twitch.tv##.prime-extension-root

Additionally, you may want to get back a chat frame without a leaderboard header:

  www.twitch.tv##.channel-leaderboard

Twitch generates random class names, possibly to prevent your blocking some elements, so I tried to find the topmost classes. I hope that's useful to some.

[chii]

There's an extension called https://betterttv.com/ which fixes these (you can turn off these drops and popups via the settings), and add plenty more to twitch. If you're not a casual twitch viewer, the extension is a must imho.

[scottlilly]

I added this, to get rid of the carousel of channels they're currently promoting.

twitch.tv##.front-page-carousel

[remram → scottlilly]

The one with auto-playing videos? Nice. Now Firefox blocks the auto-playing sound, but for a while this really was maddening.

[mikewhy]

> Twitch generates random class names, possibly to prevent your blocking some elements, so I tried to find the topmost classes.

I don't use Twitch, so I'm not sure what these rules are blocking, but if there's any bit of consistent text in the elements these are targeting, you can do something like

    twitch.tv##div:has-text(Text To Block):xpath(../..)

There may be ways around this, ie here's the lengths Facebook go to write the word "Sponsored":

    <a
      aria-label="label"
      class="oajrlxb2 g5ia77u1 qu0x051f esr5mh6w e9989ue4 r7d6kgcz rq0escxv nhd2j8a9 nc684nl6 p7hjln8o kvgmc6g5 cxmmr5t8 oygrvhab hcukyx3x jb3vyjys rz4wbd8a qt6c0cv9 a8nywdso i1ao9s8h esuyzwwr f1sip0of lzcic4wl gmql0nx0 gpro0wi8 b1v8xokw"
      href="/ads/about/?__cft__[0]=AZXrXEHuX_dD86iokjfchbSBrQ_82Tl3Un_9I6DwUiWYhK3t_v9M6fjRm2c2e3Ca45tcXk-oTF0IPtcCqR0T6NLHXlbRXN7QxfDwF_Xydka_MzBz8Y9MNk4b7FPb7qbFiALU6PjCE-RKXIbAwAU1uJXL3QLmPMUXDvIXi97x445-5WceUPJAKY7xekY5wDjA-TQacU37LvU3P5vATZyixPQBikeTOkPq_7EI410wzlGsoZlC1yMhE9L1lFuiwuWMK4VxsXB2zIvFjJqX0JjBHAP9ea1t9QmGKlff9cu1hO6crg&amp;__tn__=%2CP-R"
      role="link"
      tabindex="0"
    >
      <span>
        <span class="j1lvzwm4 stjgntxs ni8dbmo4 q9uorilb gpro0wi8">
          <b class="t5a262vz nc684nl6 ihxqhq3m l94mrbxd aenfhxwr l9j0dhe7 sdhka5h4">
            <b
              class="l94mrbxd aenfhxwr myohyog2 b6zbclly l9j0dhe7 sdhka5h4 ww7X6RO"
              style="display: none"
            >
              -
            </b>
            <b
              class="l94mrbxd aenfhxwr myohyog2 b6zbclly l9j0dhe7 sdhka5h4 ww7X6RO"
              style="display: none"
            >
              -
            </b>
            <b
              class="l94mrbxd aenfhxwr myohyog2 b6zbclly l9j0dhe7 sdhka5h4 ww7X6RO"
              style="display: none"
            >
              -
            </b>
            <b
              class="l94mrbxd aenfhxwr myohyog2 b6zbclly l9j0dhe7 sdhka5h4 ww7X6RO"
              style="display: none"
            >
              -
            </b>
            <b class="nc684nl6 l94mrbxd l9j0dhe7 sdhka5h4">S</b>
            <b
              class="t5a262vz nc684nl6 ihxqhq3m l94mrbxd aenfhxwr l9j0dhe7 sdhka5h4"
            >
              p
            </b>
            <b
              class="l94mrbxd aenfhxwr myohyog2 b6zbclly l9j0dhe7 sdhka5h4 ww7X6RO"
              style="display: none"
            >
              -
            </b>
            <b
              class="l94mrbxd aenfhxwr myohyog2 b6zbclly l9j0dhe7 sdhka5h4 ww7X6RO"
              style="display: none"
            >
              -
            </b>
            <b
              class="l94mrbxd aenfhxwr myohyog2 b6zbclly l9j0dhe7 sdhka5h4 ww7X6RO"
              style="display: none"
            >
              -
            </b>
            <b
              class="l94mrbxd aenfhxwr myohyog2 b6zbclly l9j0dhe7 sdhka5h4 ww7X6RO"
              style="display: none"
            >
              -
            </b>
            <b class="myohyog2 l9j0dhe7 sdhka5h4">o</b>
            <b class="b6zbclly l9j0dhe7 sdhka5h4">n</b>
            <b
              class="l94mrbxd aenfhxwr myohyog2 b6zbclly l9j0dhe7 sdhka5h4 ww7X6RO"
              style="display: none"
            >
              -
            </b>
            <b class="nc684nl6 l94mrbxd l9j0dhe7 sdhka5h4">s</b>
            <b class="myohyog2 l9j0dhe7 sdhka5h4">o</b>
            <b
              class="l94mrbxd aenfhxwr myohyog2 b6zbclly l9j0dhe7 sdhka5h4 ww7X6RO"
              style="display: none"
            >
              -
            </b>
            <b
              class="l94mrbxd aenfhxwr myohyog2 b6zbclly l9j0dhe7 sdhka5h4 ww7X6RO"
              style="display: none"
            >
              -
            </b>
            <b class="t5a262vz l94mrbxd myohyog2 l9j0dhe7 sdhka5h4">r</b>
            <b
              class="l94mrbxd aenfhxwr myohyog2 b6zbclly l9j0dhe7 sdhka5h4 ww7X6RO"
              style="display: none"
            >
              -
            </b>
            <b
              class="l94mrbxd aenfhxwr myohyog2 b6zbclly l9j0dhe7 sdhka5h4 ww7X6RO"
              style="display: none"
            >
              -
            </b>
            <b
              class="l94mrbxd aenfhxwr myohyog2 b6zbclly l9j0dhe7 sdhka5h4 ww7X6RO"
              style="display: none"
            >
              -
            </b>
            <b
              class="l94mrbxd aenfhxwr myohyog2 b6zbclly l9j0dhe7 sdhka5h4 ww7X6RO"
              style="display: none"
            >
              -
            </b>
            <b
              class="l94mrbxd aenfhxwr myohyog2 b6zbclly l9j0dhe7 sdhka5h4 ww7X6RO"
              style="display: none"
            >
              -
            </b>
            <b class="l94mrbxd aenfhxwr myohyog2 b6zbclly l9j0dhe7 sdhka5h4">e</b>
            <b class="ihxqhq3m myohyog2 l9j0dhe7 sdhka5h4">d</b>
            <b
              class="l94mrbxd aenfhxwr myohyog2 b6zbclly l9j0dhe7 sdhka5h4 ww7X6RO"
              style="display: none"
            >
              -
            </b>
            <b
              class="l94mrbxd aenfhxwr myohyog2 b6zbclly l9j0dhe7 sdhka5h4 ww7X6RO"
              style="display: none"
            >
              -
            </b>
            <b
              class="l94mrbxd aenfhxwr myohyog2 b6zbclly l9j0dhe7 sdhka5h4 ww7X6RO"
              style="display: none"
            >
              -
            </b>
          </b>
        </span>
      </span>
    </a>

[qwerpy → mikewhy]

Last time I took a peek at it, they were changing up the order of the letters in “Sponsored” in the HTML and using some front end shenanigans to reposition the letters to spell out the word. Pretty devious, but I do wish we were spending mankind’s geniuses on this kind of thing.

[wlesieutre → mikewhy]

I bet screen readers love that

[aaomidi → wlesieutre]

Hmm if it's actually impacting screen readers this is an ADA violation probably.

[mikewhy → aaomidi]

Looking back at my adblock rules[1], FB used to use `aria-label=Sponsored`. Seems they stopped doing that, most likely because it was crazy simple to target and remove.

[1]: https://github.com/mikew/adblock-rules/blob/ed8f0b0511d66c44...

[austhrow743]

If you just want to watch videos you can also stream straight to a video player.

I think there’s also an application designed to let you find your streams to do so without visiting the twitch website although I haven’t used that.

[anotheryou]

what do i need to block the video ads properly?