PoC #09: 雑ドロップダウン撲滅キャンペーン

お役所のフォーム、 なんでこんなに長くて 無駄が多いの

ドロップダウン！ 情報１つに クリック2回さ せるな！

ドロップダウン嫌いな の、私だけ？

いえ、怒りは正当です

GOV.UK Design System では selectは 『最後の手段』扱いです

最後の手段を最初 から使うな！

select の代わりに、 5 個以下ならラジオ、 10 個以上なら autocomplete

これは、ユーザーへの 罰ゲームです

『東京』と2文字。 それで十分です

撲滅キャンペーン しよう！

ただし、撲滅対象は──

雑なドロップダウンです

雑ドロップダウン 撲滅キャンペーン！

……で、これ、 Claude Code で埋められない？

Claude Code は Docker コンテナの中

ブラウザを直接 クリックできません

Playwright は？

できます。ただ Chrome を デバッグモードで起動 する必要があります

はい、めんどい

もう一つ手があります。 Tampermonkey という──

あー、入れてある

ChatGPT、全文 くれって頼んでも出さない

切れたり要約したり、 セッション切れる と忘れるし

だから前に Tampermonkey で書いた。 Markdown一括保存

Tampermonkey スクリプトはこんな形 をしています

私のはこれ。 ChatGPT の ドメインだけで動く

先頭の metadata header で、どのサイトで動く か・どこに通信するか を宣言します

会話の DOM を 回って、 Markdown に 整形してダウンロード

ここで、Web の 基本ルールを一つ

ページ内 JS は、 別オリジンに自由に 通信できません

ないと、悪意ある ページが好き勝手に リクエストを送れる

……だから普通のJS じゃ、Docker の Claude Code に 繋げないわけね

はい、そのままでは

そこで Tampermonkey の特権関数、GM_ xmlhttpRequest

拡張機能の権限で、 `@connect` の先へリクエスト を送れます

ブラウザの中から、 Docker の Claude Code に到達できます

あー、それで Docker の中の Claude Code に つながる訳ね

ただし、信頼できない スクリプトに権限を 渡すのは危険です

包丁と同じね

料理にも、事故にも

`@match` と `@connect` は絞ります

便利ね。じゃあ次から 全部これで

本来はフォームを直す のが筋ですが──

お役所が直すわけ なくない？

……応急処置で済ま せますか