Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
vitestはじめるまで
Search
pisa-kun
November 07, 2024
Technology
0
130
vitestはじめるまで
pisa-kun
November 07, 2024
Tweet
Share
More Decks by pisa-kun
See All by pisa-kun
All golangでデスクトップアプリからwebアプリにデータ連携させる
pisakun
0
20
sre本読んだ感想
pisakun
0
480
githubのレポジトリから推しの変遷を見る
pisakun
1
130
Google Cloudで最近開発した色々_アイマスハッカソン2024
pisakun
1
150
Other Decks in Technology
See All in Technology
リーダーになったら未来を語れるようになろう/Speak the Future
sanogemaru
0
390
ガバメントクラウド(AWS)へのデータ移行戦略の立て方【虎の巻】 / 20251011 Mitsutosi Matsuo
shift_evolve
PRO
2
190
Reflections of AI: A Trilogy in Four Parts (GOTO; Copenhagen 2025)
ondfisk
0
110
Git in Team
kawaguti
PRO
3
360
AWS IoT 超入門 2025
hattori
0
330
JAZUG 15周年記念 × JAT「AI Agent開発者必見:"今"のOracle技術で拡張するAzure × OCIの共存アーキテクチャ」
shisyu_gaku
1
160
セキュアな認可付きリモートMCPサーバーをAWSマネージドサービスでつくろう! / Let's build an OAuth protected remote MCP server based on AWS managed services
kaminashi
3
310
業務効率化をさらに加速させる、ノーコードツールとStep Functionsのハイブリッド化
smt7174
2
130
成長自己責任時代のあるきかた/How to navigate the era of personal responsibility for growth
kwappa
4
320
やる気のない自分との向き合い方/How to Deal with Your Unmotivated Self
sanogemaru
0
490
BI ツールはもういらない?Amazon RedShift & MCP Server で試みる新しいデータ分析アプローチ
cdataj
0
110
生成AIとM5Stack / M5 Japan Tour 2025 Autumn 東京
you
PRO
0
250
Featured
See All Featured
A designer walks into a library…
pauljervisheath
209
24k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
9
970
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.5k
A Tale of Four Properties
chriscoyier
161
23k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.5k
The Power of CSS Pseudo Elements
geoffreycrofte
79
6k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
9
590
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
5.6k
Music & Morning Musume
bryan
46
6.8k
Building Flexible Design Systems
yeseniaperezcruz
329
39k
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
31
9.7k
Transcript
vitestはじめてみるまで 2024年 11月 7日 ぴさ(x: @pisa40338570) akihabara.any #2【ノンジャンル技術系LTイベント】
1 2 3 自己紹介 vitestとは アジェンダ vitest導入とテストまで
自己紹介 1 2 3
出身: 福岡県 就職してからの居住地: 大阪(新卒)->名古屋(転職1回目)->東京(今年・2回目) ぴさ@SREエンジニア 事業会社で府省庁向けのサービス開発しています 自己紹介 ビジネス向けPCのプリインソフト開発(C#) PCのデータ収集基盤開発(AWS, Python,
TS) Sier転職してPL・PM 現在: 府省庁向けサービス開発(GCP, Nextjs) SREっぽいこと(CICD, その他改善活動)
2 1 3 vitest(ヴィーテスト)とは
UnitTestとは プログラムコードの最小機能ユニットをテストするプロセス コード毎にユニットテストを作成し、変更があるたびにテストを自動実行することで早 期にバグやエラーを特定する 参照:https://aws.amazon.com/jp/what-is/unit-testing/
vitestとは モダンなフロントエンド開発を高速化するテストフレームワーク JavaScriptのテストフレームワークとして有名なJestと互換性があり、Jestと比較し てテスト実行のスピードが非常に早いのが特徴 JestからVitestへの移行ガイドや導入の記事が多い v1.0.0: 2023/12/5 release, latest v2.1.4
3 1 2 vitest導入とテストまで
vitestの導入1 1.プロジェクトの作成と関連パッケージのインストール 前提としてインストールしているもの ・node: v22.1.0 ・pnpm: v.8.15.9 *インストールしているパッケージは過不足あるかも・・・
vitestの導入2 2.vitestの設定、ルートディレクトリにvite.config.tsを作成 3.(必須ではない)package.jsonの設定
vitestで行う簡単なテスト1 e.g. 足し算をする簡単な関数のテスト src/utils/sum.ts src/test/sum.test.ts pnpm run testで passedがでればOK
vitestで行う簡単なテスト2 e.g. 各テスト前に実行(DBのデータをクリアするようなケース) src/utils/user.ts 配列にデータを挿入・取得・削除するクラス src/test/user.test.ts 直前にaddUserが実行されているが addUser(‘Liliya’)はid=1にしたい 全てのテスト実行前に Clearを行う
vitest(jest)で便利と思ったところ 関数内部で利用している関数をmock化できる点! src/utils/calc.ts src/utils/calcFunction.ts calcResultはadd, sub関数に依存してる もし、addが数十秒かかる処理だったら? src/test/calcFunction.test.ts calcResultが使っているsumとsubを mock化して固定値を返せる
vitest(jest)で便利と思ったところ 少し前は関数やclassを引数受け取りしてテストコード作ってたので mock機能はとても便利
ご清聴ありがとうございました