結論：コンポーネントテストはVitestが最適解（かもしれない）

Vitestが良い。イメージとしてはVite + Jest。テストはJestライクに書けて、コンポーネントテストもできるようになった感じ。

VitestだとLitのコンポーネントテストがここまで簡単に書けてしまう。 StackBlitzでオンライン実行する

ただ、まだv1にも達していないので今後の動向を注視していきたい。

結論にいたるまで：Litのテスト方法の調査変遷

Web Test Runnerを調べる

最近プロダクトでLitを使っていて、コンポーネントテストをどうやってやるかに悩んでいた。
まず、Litが推している、Web Test Runnerを試した。
試しているうちに、どうにも@customElementがうまく処理できないことが判明。
Web Test RunnerのExampleリポジトリを見ると、わざわざ別ファイルからwindow.customElements.defineを呼び出しているので、何かしらの問題を抱えているように見える。
@customElementを多様しているプロダクトだったので、これはかなり致命的だった。

次に、LitのStarter Kitリポジトリのテストを参考にしてみた。
Web Test Runnerでテストするための設定項目が多すぎて途中で挫折。

そんなこんなで、Web Test Runnerは見送った。

Jestを調べる

Web Test Runnerを諦めたあとは、Jestで実現できないか調べた。
TypeScriptで書いているのでts-jestを使うのはもちろんだけど、babel-jestまで導入しないといけなかった。
（GitHubでのIssueを参照）

しかもこの方法を取ったけれども、結局Shadow DOMがちゃんとレンダリングされなくて詰むという状態になって心が折れた。

コンポーネントテストが導入されたCypress,Playwrightを調べる

最近、E2Eテストフレームワークがコンポーネントテストをサポートするようになってきた。
CypressとPlaywrightがサポートし始めている。どちらもまだPreview版な状態。

これでLit（Web Components）もできるかと思ったけれど、現在サポートしているのはReact/Vueなどの有名所のみ。
Litはもう少し待つ必要がありそうだとわかったところで調査終了。

Vitestに出会う

Viteを調べているときにVitestを見つけた。
Examplesを眺めていると、なんとLitがある！
コードを見ると、vite.config.tsを設定するだけのシンプルさ。
アサーションやモックもJestライクに書けるから、すでにJestを導入しているプロダクトでも学習コストが低い。