Minuteur Pomodoro pour Spotify et Yandex Music

# Minuteur Pomodoro en Bookmarklet pour Services Musicaux

Les développeurs à distance luttent souvent contre les notifications distrayantes. Une astuce pour rester concentré ? La technique Pomodoro avec pauses musicales automatiques sur minuterie. Réalisé via un bookmarklet : un extrait JavaScript enregistré comme favori dans le navigateur qui met en pause votre musique après un délai défini — sans appli supplémentaire.

L'idée principale ? Mettre Spotify en pause après 25 minutes. Le code de base utilise setTimeout pour cliquer sur le bouton pause :

setTimeout(() => { document.querySelector("[data-testid='control-button-playpause']").click()}, 5000)

Ici, setTimeout prend une fonction de rappel et un délai en millisecondes. Le sélecteur [data-testid='control-button-playpause'] cible le bouton, et .click() simule un appui. Pour 25 minutes : 1000 60 25.

Problèmes du Script Simple et Leurs Solutions

Un script basique a des défauts : saisie manuelle requise, exécution uniquement en console, plantage si bouton absent, et limité à Spotify.

Vient le bookmarklet. Créez un favori avec le préfixe javascript: et votre code :

javascript:setTimeout(() => {
  document.querySelector("[data-testid='control-button-playpause']")
    .click()
}, 5000)

Ajoutez des vérifications de bouton et des alertes :

(() => {
    const stopButton = document.querySelector("[data-testid='control-button-playpause']");

    if (!stopButton) {
        alert("Aucun bouton pause trouvé 😭");
        return;
    }

    setTimeout(() => {stopButton.click()}, 5000);
    alert("Minuteur lancé 🍅⏰")
})()

Contrôles du Minuteur : Démarrer et Arrêter

Pour annuler une session, stockez l'ID du timer dans un cookie. Le code complet vérifie un timer actif, l'arrête avec clearTimeout, ou en lance un nouveau :

javascript:(() => {
    const time = 1000 * 60 * 25;
    
    const stopButton = document.querySelector("[data-testid='control-button-playpause']");

    const timerID = document.cookie.split('; ').find(row => row.startsWith('myPomodoroMusic='))?.split('=')[1];

    if (!stopButton) {
        alert("Aucun bouton pause trouvé 😭");
        return;
    }

    if (timerID) {
        clearTimeout(Number(timerID));
        alert(`Minuteur arrêté`);
        document.cookie = `myPomodoroMusic=${timerID}; expires=${ new Date().toUTCString() }; path=/;`;
        return;
    }

    window.myPomodoroMusic = setTimeout(() => {stopButton.click()}, time);

    document.cookie = `myPomodoroMusic=${window.myPomodoroMusic}; expires=${ new Date(Date.now() + time).toUTCString() }; path=/;`;

    alert(`Minuteur lancé pour ${time / 1000 / 60} min`);
})()

Les cookies conservent l'ID jusqu'à expiration ou arrêt. Rechargez la page, ça marche toujours.

Support des Services Musicaux Populaires

Étendez à plusieurs plateformes avec une fonction getPauseButton qui associe le domaine au bon sélecteur :

• Spotify : [data-testid='control-button-playpause']
• Yandex Music : [aria-label='Pause']
• Zvuk : [id='theme-provider'] > div > div > div:nth-of-type(2) > div > div > div:nth-of-type(2) > div > button:nth-of-type(2)
• VK Music : [data-testid='audio-player-controls-state-button']
• YouTube : [aria-keyshortcuts='k']

Code final complet :

javascript:(() => {
    const time = 1000 * 60 * 25;

    const getPauseButton = () => {
        const url = window.location.href;
        const domain = new URL(url).hostname;
        switch (domain) {
            case "open.spotify.com":
                return document.querySelector("[data-testid='control-button-playpause']");
            case "music.yandex.ru":
                return document.querySelector("[aria-label='Pause']");
            case "zvuk.com":
                return document.querySelector("[id='theme-provider'] > div > div > div:nth-of-type(2) > div > div > div:nth-of-type(2) > div > button:nth-of-type(2)");
            case "vk.com":
                return document.querySelector("[data-testid='audio-player-controls-state-button']");
            case "www.youtube.com":
                return document.querySelector("[aria-keyshortcuts='k']");
            default:
                return null;
        }
    }
    
    const stopButton = getPauseButton();

    const timerID = document.cookie.split('; ').find(row => row.startsWith('myPomodoroMusic='))?.split('=')[1];

    if (!stopButton) {
        alert("Aucun bouton pause trouvé 😭");
        return;
    }

    if (timerID) {
        clearTimeout(Number(timerID));
        alert(`Minuteur arrêté`);
        document.cookie = `myPomodoroMusic=${timerID}; expires=${ new Date().toUTCString() }; path=/;`;
        return;
    }

    window.myPomodoroMusic = setTimeout(() => {stopButton.click()}, time);

    document.cookie = `myPomodoroMusic=${window.myPomodoroMusic}; expires=${ new Date(Date.now() + time).toUTCString() }; path=/;`;

    alert(`Minuteur lancé pour ${time / 1000 / 60} min`);
})()

Points Clés

• Le bookmarklet utilise des cookies pour stocker l'ID du timer, permettant l'arrêt sans recharger la page.
• Un switch par domaine sélectionne le bon sélecteur pour Spotify, Yandex Music, Zvuk, VK et YouTube.
• Vérifications des boutons évitent les erreurs ; alertes indiquent l'état.
• Fonctionne dans n'importe quel navigateur sans extension — idéal pour devs confirmés.
• Sélecteurs basés sur data-testid, aria-label et aria-keyshortcuts pour fiabilité.

— Editorial Team