DEV Community

vast cow
vast cow

Posted on

Restoring Hidden Playback Buttons in YouTube Music

Overview

This user script is designed to fix an issue in YouTube Music where certain playback controls—specifically the rewind and fast-forward buttons—may become hidden. It works by periodically scanning the page and restoring the visibility of these buttons when necessary.

Purpose

In some cases, YouTube Music’s interface may hide key controls such as:

  • The rewind (10 seconds back) button
  • The fast-forward (30 seconds ahead) button

When these controls are not visible, it can disrupt normal playback navigation. This script ensures that those buttons remain accessible, improving overall usability.

How to Use

1. Set Up a User Script Manager

To run this script, you need a browser extension that supports user scripts. A commonly used option is:

  • Tampermonkey (available for Chrome, Edge, Firefox, and others)

2. Install the Script

  1. Open the Tampermonkey dashboard
  2. Create a new script
  3. Paste the provided code into the editor and save it

3. Open YouTube Music

The script automatically runs when you visit:

No additional configuration is required.

How It Works (Briefly)

  • The script looks for playback buttons associated with rewind and fast-forward actions
  • If these elements have a hidden attribute, it removes it
  • This process runs every 5 seconds to ensure the buttons stay visible

Notes

  • If YouTube Music updates its interface, the script may need adjustments
  • The script runs periodically, but the performance impact is minimal

Summary

This simple user script helps maintain access to essential playback controls in YouTube Music. By automatically restoring hidden buttons, it provides a smoother and more consistent listening experience.

// ==UserScript==
// @name         YouTube Music Hidden Buttons Fix
// @namespace    http://tampermonkey.net/
// @version      1.1
// @description  Unhide rewind/forward buttons periodically
// @match        https://music.youtube.com/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    function unhideButtons() {
        // yt-icon-button elements that have a replay_10 icon as a descendant
        document.querySelectorAll(
            'yt-icon-button:has(yt-icon[icon="yt-sys-icons\\:replay_10"])'
        ).forEach(el => {
            el.removeAttribute("hidden");
        });

        // yt-icon-button elements that have a skip_forward_30 icon as a descendant
        document.querySelectorAll(
            'yt-icon-button:has(yt-icon[icon="yt-sys-icons\\:skip_forward_30"])'
        ).forEach(el => {
            el.removeAttribute("hidden");
        });
    }

    // Initial execution
    unhideButtons();

    // Re-run every 5 seconds
    setInterval(unhideButtons, 5000);
})();
Enter fullscreen mode Exit fullscreen mode

Top comments (0)