GASエディタからQiitaへの執筆が爆速に！専用のChrome拡張機能を開発・公開しました

GASエディタの「困った」を解決！専用のChrome拡張機能を作って公開しました

Google Apps Script (GAS) のV8ランタイム導入以降、WEBエディタは非常に使いやすくなりました。しかし、「特定のエディタ上だけでちょっとしたコードの整形やマークアップをしたい」「独自のショートカットを差し込みたい」と思ったことはありませんか？

今回は、GASの新しいWEBエディタ（script.google.com）上でのみ動作し、コードのマークアップを支援するChrome拡張機能**を開発し、無事ストアに公開したのでその裏側を共有します！

開発したChrome拡張機能の概要

この拡張機能は、GASエディタを開いているときだけ有効化されます。選択したコードブロックに対して、Qiitaやブログ投稿用に最適化されたマークアップ（シンタックスハイライト用の言語指定付きバッククォートなど）をワンクリックで生成・クリップボードにコピーするツールです。

主な機能

• GASエディタ限定動作: matches 属性でURLを厳密に制限し、ブラウザのメモリ負荷を最小限に。
• ワンクリック・マークアップ: エディタ内に専用のインジェクションボタン、または右クリックメニューから即座に整形。
• JSDoc自動クリーンアップ: 投稿用に不要な内部コメントをフィルタリングするオプション機能。

ストア審査で意識したこと（Manifest V3対応）

Chrome拡張機能の公開において鬼門となるのがストア審査です。今回は「最小限の権限（permissions）」に絞り、不要なスクリプトの外部読み込み（リモートコード）を一切行わない純粋なManifest V3仕様で作成したため、申請からわずか1日でスムーズに承認されました。

技術的なポイント：GASエディタへのインジェクション

GASの新エディタはMonaco Editorベースで構築されているため、単純なDOM操作ではコードの取得が難しい場合があります。今回は content_scripts を用いて、エディタの特定のセレクタが出現するのを監視（MutationObserver を利用）し、安全にボタンを埋め込むアプローチを取りました。

// manifest.json の一部
{
  "manifest_version": 3,
  "name": "GAS Editor Markupper",
  "version": "1.0.0",
  "content_scripts": [
    {
      "matches": ["[https://script.google.com/home/projects/*/edit](https://script.google.com/home/projects/*/edit)*"],
      "js": ["content.js"],
      "run_at": "document_idle"
    }
  ],
  "permissions": ["clipboardWrite"]
}

おわりに

自分で作ったツールが、毎日使うGASのエディタ上で動くのは非常に爽快です！
もし「自分好みにカスタマイズしたい」「GASエディタからQiita記事を書いてみたい」という方がいれば、ぜひインストールして使ってみてください。