YouTubeのショート動画を倍速にする拡張機能を作ってみた

この記事はだいぶ前に書かれたものなので情報が古いかもしれません

この記事を三行にまとめると

manifest.json
数字のキーを押したらn倍速にする
5秒送り、5秒戻しをつけ加えたバージョン

この記事は以下の動画の中に出てきたサンプルコードを載せたものです。コピペなどが必要なときに使ってください。

manifest.json

{
  "name": "youtube shorts control",
  "description": "ショート動画のコントロール",
  "version": "1.0.0",
  "manifest_version": 3,
  "content_scripts": [{
    "matches": ["https://www.youtube.com/*"],
    "js": ["script.js"]
  }]
}

数字のキーを押したらn倍にする

document.addEventListener('keydown', function(event) {
  if(!isNaN(event.key) && event.key > 0) {
    video = document.querySelector('ytd-reel-video-renderer video');

    if(video != null) {
      video.playbackRate = event.key;
    }
  }
})

5秒送り、5秒戻しをつけ加えたバージョン

document.addEventListener('keydown', function(event) {
  arr = ['1', '2', '3', '4', '5', '6', '7', '8', '9', 'ArrowRight', 'ArrowLeft'];

  if(arr.indexOf(event.key) != -1) {
    video = document.querySelector('ytd-reel-video-renderer video');

    if(video == null) {
      return;
    }

    switch(event.key) {
      case 'ArrowRight':
        video.currentTime += 5;
        break;
      case 'ArrowLeft':
        video.currentTime -= 5;
        break;
      default:
        video.playbackRate = event.key;
    }
  }
})