Copyright © nextbeat All Rights Reserved プロダクトで採用している テストフレームワークについて Copyright © nextbeat All Rights Reserved 株式会社ネクストビート TechnologyDivision Platform 石川侑樹 

Copyright © nextbeat All Rights Reserved Copyright © nextbeat All Rights Reserved 2 自己紹介 ● 石川 侑樹（いしかわゆうき） ● 株式会社ネクストビート ○ TechnologyDivision Platform ○ 組織横断の技術課題などの解消 ● 直近の業務 ○ 主要プロダクトの技術移行（to Svelte） 

Copyright © nextbeat All Rights Reserved Copyright © nextbeat All Rights Reserved 3 今日伝えたいこと Svelteはテスト周りもイイ感じ！ 

Copyright © nextbeat All Rights Reserved Copyright © nextbeat All Rights Reserved 4 TestingLibrary + Vitest TestingLibrary ● コンポーネントの粒度でのUIテストライブラリ ● React, Vue, Svelte, Angular, Preact, etc… に対応 Vitest ● Vite環境での高速なテストランナー ● Viteビルドを推奨しているSvelteKitとの相性◎ 

Copyright © nextbeat All Rights Reserved Copyright © nextbeat All Rights Reserved 5 Playwright-ct Playwright ● Microsoft製E2Eテストフレームワーク Playwright-ct ● Playwrightの環境を使用したコンポーネントテスト ● React, Vue, Svelteに対応 

Copyright © nextbeat All Rights Reserved Copyright © nextbeat All Rights Reserved 6 Playwright-ct メリット ● 実際のブラウザでの操作を検証 ● クロスブラウザテスト → より信頼性の高いテストが可能 デメリット ● SvelteKit（まだ）未対応... 

Copyright © nextbeat All Rights Reserved Copyright © nextbeat All Rights Reserved 7 つまり ● テストフレームワークの選択肢も多くなってきている ● テスト界隈でもReactやVueなどの 代表的なフレームワークと同列に扱われている → 将来性が認められている 

Copyright © nextbeat All Rights Reserved Copyright © nextbeat All Rights Reserved 8 実際にSvelteのテストを導入してみた所感 ● テストの実装自体は簡単にできた ● Svelteの特徴「コード量を減らす」が活きているかも？ ○ mock化するところも少なくなるはず ○ カバレッジ的なことを考えてもコード量が少ないほど 実装時間・テストコード量も少なくなるはず 

Copyright © nextbeat All Rights Reserved Copyright © nextbeat All Rights Reserved 9 良いSvelteテストライフを！