Chromiumベースのブラウザでマウスジェスチャーによる翻訳の切り替えを実現してみた
Chromiumベースのブラウザに実装されていることが多い翻訳機能ですが、どのブラウザでももっと手軽に切り替えられるようにならないものかと考えていました。というのもCatsxpというChromiumベース(Braveのフォーク)のブラウザにはショートカットキー及びマウスジェスチャーの機能として「現在のページを翻訳」が用意されており、この使い心地、特にマウスジェスチャーで翻訳を実行するのは自分にとってかなり快適で、原語に戻すこともマウスジェスチャーで実現したいと考えるようになりました（Catsxpに原語に戻すアクションは実装されてない）。また他のブラウザでもマウスジェスチャーで翻訳が実行できたらなあと思い、それを実現する拡張機能とネイティブアプリ (.bat + Pythonスクリプト) を作ってみました。名前は単純ですが Chromium Translation Toggler としました。
https://github.com/ryo-fujinone/chromium-translation-togglerきっかけとなったのは、Chromeの翻訳の切り替えは「Shift+F10 → T → Enter → Esc」をマクロツールに登録すれば良いとする以下の記事です。
https://qiita.com/kyosinari/items/740cd1825a8d8c9a966dこれを見て、ならネイティブメッセージングで拡張機能と自前のスクリプトを連携させて自前のスクリプトからこの記事で紹介されているようなことをやれば、マウスジェスチャーで切り替えというのが実現できるのではないかと思い、開発に至りました。
正直なところ、多ボタンのマウスがあるならそれにマクロを登録すればマウスを使った翻訳の切り替えというのは実現できるかもしれませんし、わざわざ作らなくても良かったんじゃ…という感じもしますけど、私の持つマウスには特殊ボタンが戻る/進むしか無いので… まあネイティブメッセージングというのを初めて活用したので、良い経験になったと思っています。
Pythonのスクリプト含めネイティブメッセージング関連のことはGoogleがGitHubで公開しているネイティブメッセージングのサンプルを参考に実装しました。
https://github.com/GoogleChrome/chrome-extensions-samples/tree/main/api-samples/nativeMessaging
ネイティブメッセージングのために拡張機能のIDを固定した方が都合が良かったので、以下を参考にmanifest.jsonにkeyフィールドを追加するということもやっています。
https://developer.chrome.com/docs/extensions/reference/manifest/key
ブラウザ上でやっていることとしては、予め各ページにトリガー用の要素を仕込んで監視しておき、その要素の属性が操作されたらネイティブメッセージングを使うという感じです。属性の操作にJavaScriptのコードの実行が必要なので、ユーザースクリプトマネージャーや、JavaScriptのコード実行をサポートしたマウスジェスチャーの拡張機能の使用を想定しています。
私はAutoControlというマウスジェスチャーの拡張機能を使用して動作を確認しました。マウスジェスチャーは他にもCrxMouseやminiGestures、simpleGesturesといった拡張機能がありますが、任意のJavaScriptのコードを実行する機能が無く、AutoControlを使用することになりました。軽く調べたところ以前はCrxMouseにJavaScriptの実行機能があったようですが、Manifest V3への移行に伴い廃止になったっぽい？です。ただManifest V3では最近 chrome.userScripts というAPIが使えるようになったのでこの辺りの事情は今後変わってくるかもしれません。
AutoControlがManifest V2ということに不安があったので、Manifest V3でオープンソースなマウスジェスチャー拡張機能であるsimpleGesturesを改造して自前のコードを実行するようにということもやりました。残念なことにsimpleGesturesはマウスジェスチャーのアクションをユーザーが追加することを前提とした設計ではなく、やりたいことをハードコードで書いていく必要がありましたが… 仮にフォークとして公開するとしたらその辺りの問題を解決出来たらですかね… 流石にそこまでのやる気は自分には無いですが。
翻訳の切り替えはChrome、Brave、SRWare Iron、Catsxp、Edgeで検証しました。Edgeは他のChromiumベースのブラウザとは挙動が異なるようで、専用のモードを用意する必要がありました。
Chromium Translation Togglerのインストール方法や実行方法についてはreadmeをご確認ください。様々なケースが考えられるブラウザに対して自動化のライブラリ(pywinauto)を使用しているため、Edge専用のモードに限らず自分の環境以外でうまく機能するかどうかがイマイチ分からないのは痛いですね…
まあとりあえずやりたいことは実現できたので満足しています。マウスジェスチャーで翻訳の切り替えはマジで快適です。
ちなみに、ブックマークレットでGoogle翻訳を使用してページに翻訳を適用するというのも知ってはいますし活用もしていますが、少なくとも私にとってはブラウザの翻訳機能を使ったほうが都合が良い場面も存在するため、それもChromium Translation Togglerを作った理由になっています。