QR Send

スマホとPCのChrome間で、URLやテキストをQRコード1回のペアリングで送り合える自作Chrome拡張。アカウント不要・無料。

使ってみる →
個人開発

Chrome拡張に組み込みAI(Gemini Nano)を積む:サーバーもAPIキーも要らないAI機能の足し方

Chrome拡張にAI機能を足したいがサーバーもAPIキー課金も用意したくない、という個人開発者向けに、ブラウザ同梱のGemini NanoをPrompt APIから呼び出す方法と要件・注意点をまとめました。
AI活用

Claude Codeの公式Chrome拡張で、フロント修正のたびに自分でChromeを開いて確認するのをやめた話

CSSを直すたびに手でChromeを開いて確認する往復を、Claude Code公式のChrome拡張機能にやらせてみました。claude --chromeでの有効化・権限の仕組み・Windowsでのつまずきまで実体験ベースでまとめます。
テスト自動化

toBeTruthyを卒業する:Playwrightのexpectで意味のあるマッチャーを選ぶ

とりあえずtoBeTruthy()で通していませんか。web-firstマッチャーへの乗り換えと、expect.extendで自作マッチャーを作る一歩目をまとめました。
AI活用

AIにPlaywrightテストを書かせると実際いくらかかるのか:MCP経由とCLI経由でトークンが4倍違うという話

「AIに任せれば無料でしょ」と言われがちですが、実際はモデルのトークン代がかかっています。MCP経由とCLI経由でトークン消費が約4倍違うという2026年の複数の記事を照らし合わせて調べました。
AI活用

Claude Codeの「Agent Teams」って何?subagent・git worktreeとの違いと使い分け

subagentは1セッション内で動き親に要約だけ返しますが、Agent Teamsは各メンバーが独立したセッションとして起動し、共有タスクリスト経由で直接メッセージし合います。git worktreeとの組み合わせ方まで、実際に触って確認しました。
テスト自動化

テストが落ちた時、ブラウザUIを開かずCLIだけで追う:npx playwright traceとVideo Receipts

トレースビューアを毎回開くのが面倒。AIエージェントに直させた結果を人間がどう検証するか。npx playwright traceのopen/merge/infoと、動画で証跡を残すVideo Receiptsを試しました。
個人開発

Chrome拡張のMV3、個人開発者が本当にハマるのはservice worker・CSP・最小権限でした

2026年8月末でManifest V2がChromeウェブストアから完全に削除されます。自作のMV3拡張「QR Send」の開発と審査対応で実際にハマったservice worker・CSP・最小権限のポイントを、公式ドキュメントの裏取り付きで整理しました。
AI活用

PlaywrightのTest Agentsは結局いつから使えるのか:npx playwright init-agentsを公式リリースノートで確認する

Planner・Generator・HealerのTest Agentsは1.56/1.59/1.60と出典によってバージョン表記が揺れています。公式リリースノートを実際に遡って読み、npx playwright init-agentsがいつから使えるようになったのかを確認しました。
AI活用

AIはスクリーンショットではなくアクセシビリティツリーを見ている:getByRoleが壊れにくい理由

「getByRoleを使え」とはよく聞くけど、CSSセレクタと何がそんなに違うのか。AIエージェントがブラウザをどう見ているかという視点から、その理由を一本につなげて整理しました。
AI活用

OpenAI Codex CLIのスラッシュコマンド総まとめ:Claude Codeユーザーが乗り換えて戸惑ったところ

普段Claude Codeをメインで使っている私が、Codex CLIのスラッシュコマンドを公式ドキュメントベースで整理しました。/model・/status・/approve・/planなど、Claude Codeとの対応関係も添えています。