TypeScript

Selenium・自動化

Playwright MCPの「プロファイル」を理解する：persistent(既定)/isolated/extensionの3モードでログイン状態は毎回消えるのか残るのか

Playwright MCPは既定でpersistentプロファイルを使い、ワークスペースごとにCookieやログイン状態を自動保存します。isolated/extensionモードとの違い、storage-stateでの初期状態注入、名前付きセッション管理がまだfeature request段階である点まで整理しました。

2026.08.30

Selenium・自動化

PlaywrightのテストでTypeScriptに最初につまずくところ：Cannot find module(TS2307)を順番に片づける

import { test } from '@playwright/test' が赤線、自作ヘルパーが@/utilsで読めない。Playwright + TypeScriptで1年目がテストのロジックより先につまずくCannot find moduleを、原因ごとに切り分けて片づけます。

2026.08.28

Selenium・自動化

AIに書かせたテストをリポジトリのどこに置くか：tests-ai/で分けてCIを止めない運用にする

AIに書かせたPlaywrightテストは、レビューを通しても一定割合は不安定です。tests-ai/でディレクトリを分け、retriesでフレークを吸収し、不安定なものは消さず一時skipして再生成キューに回す。CIを止めない運用ルールをコード付きでまとめました。

2026.08.25

Selenium・自動化

StorybookのポータブルストーリーがPlaywright Component Testingにそのまま持ち込めるようになった：composeStoriesで「Storybookで書いた話とPlaywrightで書くテストが別物」を終わらせる

Storybookのcompose Storiesでストーリーがそのままplaywright component testingで動くようになった話。jsdomとブラウザ前提のテストの違い、composeStoriesの使い方、ResizeObserver/Canvas/WebGLなどブラウザAPI依存コンポーネントの使い分けまで解説します。

2026.08.16

Selenium・自動化

Playwright 1.62でMCPサーバーが本体同梱に：npx playwright mcpだけで動くようになった話

Playwright 1.62でMCPサーバーとplaywright-cliが本体に同梱されました。npx playwright mcpだけで動くようになり、@playwright/mcpを別途インストールしてバージョンを手で合わせる手順はもう要りません。

2026.08.10

Selenium・自動化

AIにテストを書かせる：codegenの録画をgetByRole/getByLabelへ書き換えてもらう（Generator）

playwright codegenで録画したテストがCSSセレクタだらけで壊れやすい、という悩みをAIエージェント(Generator)に書き換えさせる方法をまとめました。codegen自体もrole系ロケータを優先しますが、実際のアプリでは限界があります。その先をAIにどう任せるか、実例のコードとともに正直に書いています。

2026.07.27

Selenium・自動化

【初心者向け・保存版】SeleniumからPlaywrightへの移行ガイド：API対応表と書き換えパターン

Seleniumのテストが増えてきたら一度は考える話Seleniumで書いたテストコードがそこそこの本数になってきて、そろそろPlaywrightに移行すべきかという相談を最近よく受けます。私自身、長年RubyとSelenium WebDr...

2026.07.26

Selenium・自動化

AIが生成したPlaywrightテスト、そのまま信じていい？レビューの落とし穴

Playwright MCPやAIエージェントに書かせたテストは、パスしたからといって中身が正しいとは限りません。弱いアサーション・幻覚セレクタ・ハードコード待機・テスト名と中身の不一致という4つの落とし穴を、悪い例と直した例のコードで具体的にまとめました。

2026.07.23

Selenium・自動化

自己修復（Healer）を試す：壊れたテストをAIが直す

ロケータが変わるたびにテストが赤くなる。Playwrightの公式テストエージェント「Healer」を使うと、失敗したテストの修復案をAIが提案してくれます。仕組みと使い方、そして任せてはいけない部分を実演しながら整理しました。

2026.07.21

Selenium・自動化

【初心者向け】Playwright MCP入門：AIにブラウザを触らせてテストを書いてもらう

Playwrightのテストコードを自分で書き続けるのではなく、AIにブラウザを触らせながら書いてもらう「Playwright MCP」を実際に手元で動かしてみた入門記事です。MCPの仕組み、なぜスクリーンショットではなくアクセシビリティツリーを見るのか、手元での立ち上げ方、できること・まだ苦手なことを正直にまとめました。

2026.07.20

Selenium・自動化