⌨️ 久しぶりにChrome拡張を書いた

ずいぶん久しぶりにChrome拡張を書いた。

icon このサイトもそうだが、自分が管理している静的サイトのほとんどはHugoで作っている。

Hugoが公式で提供しているショートコードでTweetを引用する場合、

Tweetをブラウザで表示する
URLを参照しユーザIDとTweet ID?を調べる。URLがhttps://twitter.com/SanDiegoZoo/status/1453110110599868418だとすると
{{< tweet user=“SanDiegoZoo” id=“1453110110599868418” >}}の形式でショートコードを書く

という手順となり、かなり面倒だ。作成したChrome拡張はこれを支援するもの。

上の例で言えば1でTweetを表示した状態で機能拡張を起動すれば、3のショートコードがクリップボードへコピーされる。

私が運用している横浜FC関連のサイトではTweetの引用を多用するため、この動作を行うブックマークレットを作成して使用していた。

しかし、最近常用しているArcブラウザではブックマークレットを使えないため、Chrome拡張へ変換してくれるサービスを使ってChrome拡張に変換した。

その流れで、どうせならHugoが公式で用意している他サービス向けのショートコードにも対応しようと書いたのが、このChrome拡張だ。対応しているサービスは以下の通り。

新しく開発するChrome拡張はManifest V3を前提にすることになっていて、いろいろできないことが増えており困惑した。なかでもクリップボード周りでかなりハマってしまい、以下のページはとても参考になった。

ServiceWorkerからクリップボードへのアクセスは、

となかなか厳しい状況にあるのだが、このページではアクティブタブにnavigator.clipboard.writeText()するスクリプトを挿入し、chrome.scripting.executeScriptすることで問題を回避していた。

絶対に自分では思いつかなかったと思う。感謝

🪴 namaraii.com