前提・実現したいこと
こちらのChrome拡張(Netflixのページ上で動作します)が動かなくなりました。
Subadub (Chromeウェブストア)
rsimmons/subadub: Chrome+Firefox extension for studying foreign languages using Netflix subtitles (GitHub)
JavaScriptは学習中の身ですが、幸い比較的単純なソースコードで動いているようでしたので自力での改修を試みました。
問題・試したこと
今まではNetflixで動画を開くと最終的にenableDownloadButton()関数が実行されてボタンを押せるようになっていたはずが、enable状態にならなくなってしまいました。この問題を解決したいです。
まず
const WEBVTT_FMT = 'webvtt-lssdh-ios8';
という部分を
const WEBVTT_FMT = 'nflx-cmisc';
に書き換えたほうが良さそうということは突き止めたのですが、その後苦手なthenに関する問題を発見しました。
該当のソースコード
こちらは該当すると思われる箇所を抜き出したものです。(全コードは上述のgithubにあります)
ここでwebvttCache.set()関数およびrenderAndReconcile()関数を実行するところまで到達できればよいのですが、到達しません。
JavaScript
1 if (!webvttCache.has(cacheKey)) { 2 const trackInfo = getSelectedTrackInfo(); 3 const url = trackInfo.bestUrl; 4 5 fetch(url).then(function(response) { 6 if (response.ok) { 7 console.log('あああ'); 8 return response.blob(); 9 } 10 throw new Error('Bad response to WebVTT request'); 11 }).then(function(blob) { 12 console.log('いいい'); 13 webvttCache.set(cacheKey, new Blob([blob], {type: 'text/vtt'})); // set type to avoid warning 14 renderAndReconcile(); 15 }).catch(function(error) { 16 console.error('Failed to fetch WebVTT file', error.message); 17 }); 18 }
console.log('あああ')とconsole.log('いいい')は自分で追加したものです。
Chromeのデベロッパーツールでコンソールを見ると、
あああ
は表示されるのですが
Bad response to WebVTT request
いいい
Failed to fetch WebVTT file
はいずれも表示されません。
このことから、response.okではあるもののその後のthen(2回目のthen)にうまく繋がっていないようです。
fetch(url).thenに関する初歩的な問題のような気もしますが、この辺りには疎く…
どういった理由が考えられるでしょうか?
追記
何故なのかはまだちゃんと検証できていませんが、GitHubのIssueにてコメントをいただいたところ
Language Learning with Netflix
という拡張と併用することでひとまずSubadubの動作も復活するようです。