Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
ユニットテストとE2Eテストをdemoしたい件
Search
ふるてつ
January 27, 2020
Technology
0
280
ユニットテストとE2Eテストをdemoしたい件
正月休みにユニットテストを頑張ったのでdemoしたいです。
E2Eテストも作ったのでそちらもdemoします。
ふるてつ
January 27, 2020
Tweet
Share
More Decks by ふるてつ
See All by ふるてつ
Angularで簡単な画面を単体テストまで一通り作った件
furutetsu
1
1.3k
はじめてのSpringBoot
furutetsu
0
480
AngularとBootstrapを使った業務システムの設計について考えた。
furutetsu
1
2.3k
Other Decks in Technology
See All in Technology
re:Invent 2025 ふりかえり 生成AI版
takaakikakei
1
210
プロンプトやエージェントを自動的に作る方法
shibuiwilliam
10
8.3k
学習データって増やせばいいんですか?
ftakahashi
2
340
Microsoft Agent 365 についてゆっくりじっくり理解する!
skmkzyk
0
330
打 造 A I 驅 動 的 G i t H u b ⾃ 動 化 ⼯ 作 流 程
appleboy
0
340
初めてのDatabricks AI/BI Genie
taka_aki
0
160
乗りこなせAI駆動開発の波
eltociear
1
1.1k
コンテキスト情報を活用し個社最適化されたAI Agentを実現する4つのポイント
kworkdev
PRO
0
1.3k
大企業でもできる!ボトムアップで拡大させるプラットフォームの作り方
findy_eventslides
1
780
RAG/Agent開発のアップデートまとめ
taka0709
0
180
Gemini でコードレビュー知見を見える化
zozotech
PRO
1
260
2025年 開発生産「可能」性向上報告 サイロ解消からチームが能動性を獲得するまで/ 20251216 Naoki Takahashi
shift_evolve
PRO
1
150
Featured
See All Featured
Building Applications with DynamoDB
mza
96
6.8k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
17k
Rebuilding a faster, lazier Slack
samanthasiow
84
9.3k
What’s in a name? Adding method to the madness
productmarketing
PRO
24
3.8k
How Fast Is Fast Enough? [PerfNow 2025]
tammyeverts
3
390
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
49
3.2k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
9
1.1k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
132
19k
Site-Speed That Sticks
csswizardry
13
1k
Writing Fast Ruby
sferik
630
62k
How to train your dragon (web standard)
notwaldorf
97
6.4k
Optimising Largest Contentful Paint
csswizardry
37
3.5k
Transcript
ユニットテストとE2Eテストを demoしたい件 Angular もくもく会 in Fukuoka #10 2020.1.30
自己紹介 福岡のおじさんエンジニアです。 現役で客先常駐しています。 COBOL → VB6.0 → VB.net → Spring
BootなIT人生。 他 jQuery → AngularJS → Angular 定年後の夢は、年金をもらいながら自称IT発明家になることです。 ふるてつ@tetsufuru19681 https://tetsufuru.hatenablog.com/ ちょくちょく参加するコミュニティ
今日のおはなし 正月休みにユニットテストを頑張ったのでdemoしたいです。 E2Eテストも作ったのでそちらもdemoします。
内容 架空の業務システムです(バックオフィス側) 5画面です。 商品登録/商品一覧の参照がメインです。 在庫登録も少し。購入履歴の参照もできます。 テスト用購入画面もあります(管理者のみ)
では実物をお見せします。
こだわりポイント マルチ言語、マルチタイムゾーンです。 インターセプターを2つ追加しました(ログイン、csrf用) カスタムのPipeを2つ追加、それをDirectiveにしました。 Inputのフォーカスが外れると通貨フォーマットになるなど。 カスタムのバリデーションを3つ追加 複数項目の相対的なチェック。在庫がないと購入できないなど。
ではユニットテストを動かします。
難易度(個人的感想) 種類 難易度 難しいポイント 備考 Service 1 Custom Pipe 2
Custom Validator 2 Component(部品) 3 Interceptor 3 やり方が最初は全然わか らず Component(ページ) 4 Directive 4 やり方が最初は全然わか らず specテストファイルの中 にtemplateを書く その他難しい部品 File Readerのモック 5 ファイルリーダーをモッ ク化した時にonloadイベ ントのカバレッジが通ら ない。 モック化したリーダーに イベントリスナを追加す る。
E2Eテストについて 登場ユーザ3人 User01:メインユーザ。商品の管理と購入履歴を参照(日本語、東京) User02:商品の在庫管理をするユーザ(英語、ロサンゼルス) User99:システム管理者(日本語、東京) シナリオ4つ ① User01:商品を登録、一覧で検索し修整する。 ② User02:商品の在庫を登録する。
③ User99:商品を購入する(管理者でテスト用画面を使って登録する) ④ User01:購入履歴を検索する。
ではE2Eテストを動かします。
結果 正月休みにユニットテストを頑張ったのでdemoしてみました。 まとめてユニットテストを書いたのすごく時間がかかりました(3週間) E2Eテストはすこし軽めです。疎通テストくらいの感じになりました。 E2Eテストは休日1日で書けました。
以上、ユニットテストとE2Eテストを demoしたい件でした。 ほぼおじさんの自己満足的な内容でしたが、 ご清聴ありがとうございました。