【Playwright】uiモードでテストコードを読み込めない場合の対処法

結論

ローカルサーバーとuiモードを同時に起動すると解決した。

対処法

1. PowerShellで対象のフォルダに移動し、npm run devを実行する
2. VS Codeのコンソールでnpx playwright test --uiを実行する
3. uiモードの画面で再生ボタンを押下する
   

参考図書

入門　WebフロントエンドE2Eテスト
https://www.amazon.co.jp/%EF%BC%BB%E5%85%A5%E9%96%80%EF%BC%BDWeb%E3%83%95%E3%83%AD%E3%83%B3%E3%83%88%E3%82%A8%E3%83%B3%E3%83%89-E2E-%E3%83%86%E3%82%B9%E3%83%88%E2%80%95%E2%80%95Playwright%E3%81%AB%E3%82%88%E3%82%8BWeb%E3%82%A2%E3%83%97%E3%83%AA%E3%81%AE%E8%87%AA%E5%8B%95%E3%83%86%E3%82%B9%E3%83%88%E3%81%8B%E3%82%89%E8%89%AF%E3%81%84%E3%83%86%E3%82%B9%E3%83%88%E3%81%AE%E6%9B%B8%E3%81%8D%E6%96%B9%E3%81%BE%E3%81%A7-%E3%82%A8%E3%83%B3%E3%82%B8%E3%83%8B%E3%82%A2%E9%81%B8%E6%9B%B8-%E3%82%88%E3%81%97%E3%81%8D/dp/4297142201