KaggleのKernelにChromeの日本語翻訳をかける

記事内画像引用元

記事中の画像はこちらのKernelを撮影して使用させていただきました。
https://www.kaggle.com/dansbecker/selecting-and-filtering-in-pandas

iframe内のページへ移動する

kaggleのKernelはiframeで埋め込まれているためchromeで右クリック→日本語に翻訳を押しても翻訳されません。なのでiframeで埋め込まれているページに移動する必要があります。

以下のコードをF12→Consoleタブで実行してiframe内のページへ遷移します。

window.location.href = document.querySelector("#rendered-kernel-content").getAttribute("src")

もしくは、KernelのページでF12→Elementsタブを表示→Ctrf+Fで「iframe」で検索します。
見つけたiframeタグのsrcをダブルクリックで選択、URLにコピペして遷移します。

ページ内スクロールの無効化を無効にする・コードセルとコードの出力セルは翻訳しない

Kernelに翻訳をかけられるようになりましたが、このページはCSSでスクロールが無効化されています。
またこの状態で翻訳を実行するとコードセルとコードの出力セルも日本語に翻訳されます。
なのでjavascriptでスクロールの無効化の解除とコードセルとコードの出力セルの出力にclass="notranslate"を追加して翻訳させないようにします。

以下のコードをF12→Consoleタブで実行します。その後に翻訳を実行します。

// スクロールの無効化解除
document.querySelector("body").style.overflowY="visible"

// コードセルのclassに.notranslateを追加
document.querySelectorAll(".input").forEach((element) => {
  element.classList.add("notranslate")
})

// コードの出力セルのclassに.notranslateを追加
document.querySelectorAll(".output_wrapper").forEach((element) => {
  element.classList.add("notranslate")
})

毎回自動で実行する場合はChrome拡張のtampermonkeyの使用を推奨します。
https://chrome.google.com/webstore/detail/tampermonkey/dhdgffkkebhmkfjojejmpbldmpobfkfo?hl=ja

翻訳実行前

翻訳実行後