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
品質と速度を両立する、私たちのフロントエンドテストの工夫と取り組み
Search
KAKEHASHI
PRO
September 30, 2025
Technology
370
2
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
品質と速度を両立する、私たちのフロントエンドテストの工夫と取り組み
余熱NIGHT from FEC北海道&東京2025 · Luma
https://luma.com/u9djlzi1?locale=ja&tk=nFxkvK
での登壇資料です
KAKEHASHI
PRO
September 30, 2025
More Decks by KAKEHASHI
See All by KAKEHASHI
人を動かすのは時間ではなく、納得感 〜新任EMが入社3ヶ月、組織を2回変えた話〜
kakehashi
PRO
3
420
クラウド上のデータ復旧で見落としがちな制約: 医療系 SaaS の BCP 設計から得た教訓
kakehashi
PRO
0
4.9k
プロダクトだけじゃない、社内プロセスにおける自動化・省力化ノススメ
kakehashi
PRO
1
5.1k
「軸足」は 固定しなくていい - 熱量と強みで描く、しなやかなキャリアの形
kakehashi
PRO
1
490
Sync と Async ─ useSyncExternalStore を使う者の岐路
kakehashi
PRO
1
700
React Compiler導入の効果と運用の工夫
kakehashi
PRO
3
590
変化の激しい時代をゴキゲンに生き抜くために 〜ストレスマネジメントのススメ〜
kakehashi
PRO
5
2.7k
「SaaSの次の時代」に重要性を増すステークホルダーマネジメントの要諦 ~解像度を圧倒的に高めPdMの価値を最大化させる方法~
kakehashi
PRO
3
5.4k
プロダクトを育てるように生成AIによる開発プロセスを育てよう
kakehashi
PRO
3
2.5k
Other Decks in Technology
See All in Technology
LLM・AIエージェントシステムベストプラクティス
shibuiwilliam
6
1.6k
dbt と Snowflake と tag
kevinrobot34
1
140
【GCC2026】大規模言語モデルを活用した内製検索サービスの社内展開や業務活用
bandainamcostudios
PRO
0
520
小粒でもパワフルなJS Runtime Antjsについて
comamoca
0
120
2027年のMetricKit
kantacky
0
160
現場回帰したデータエンジニアが考える AI 時代のキャリア開発 / Career Development in the Age of AI Perspectives from a Hands-on Data Engineer
medley
0
310
Kiro Crew入門 - 常駐エージェントの仕組みと使いどころ / Intro to Kiro Crew
k_adachi_01
1
800
AIで変わるエンジニアの働き方(仮)
naoinaoi
0
450
医療の現場を変革に挑戦した半年間の軌跡 - PythonとAIで現場を変える / From Code to Care
soudai
PRO
1
580
Genie Codeハンズオン応用編
taka_aki
0
140
自宅NWにISR4331を導入してみた話
okaits
0
120
形式手法特論:Hyperproperty とモデル検査 #kernelvm / Kernel VM Study Tokyo 19th
ytaka23
0
680
Featured
See All Featured
Effective software design: The role of men in debugging patriarchy in IT @ Voxxed Days AMS
baasie
0
480
The Spectacular Lies of Maps
axbom
PRO
1
940
Gemini Prompt Engineering: Practical Techniques for Tangible AI Outcomes
mfonobong
2
490
Measuring & Analyzing Core Web Vitals
bluesmoon
9
970
Deep Space Network (abreviated)
tonyrice
0
270
Abbi's Birthday
coloredviolet
3
9.4k
We Are The Robots
honzajavorek
0
310
Test your architecture with Archunit
thirion
2
2.4k
Digital Projects Gone Horribly Wrong (And the UX Pros Who Still Save the Day) - Dean Schuster
uxyall
1
2.5k
Measuring Dark Social's Impact On Conversion and Attribution
stephenakadiri
2
260
Color Theory Basics | Prateek | Gurzu
gurzu
0
430
Ecommerce SEO: The Keys for Success Now & Beyond - #SERPConf2024
aleyda
1
2.1k
Transcript
©KAKEHASHI inc. 品質と速度を両立する、 私たちのフロントエンドテストの工夫と取り組み 2025/09/30 株式会社カケハシ 大村 洋平 余熱NIGHT from
FEC北海道&東京2025 スポンサーLT
Mission 日本の医療体験を、 しなやかに。 カケハシは、調剤薬局DXを入り口に 日本の医療システムの再構築を目指す ヘルステックスタートアップ
©KAKEHASHI inc. プロダクト紹介 3 Vercel, the Vercel design, Next.js and
related marks, designs and logos are trademarks or registered trademarks of Vercel, Inc. or its affiliates in the US and other countries. the site or material is not endorsed by, affiliated with, or associated with Apollo Graph Inc.
©KAKEHASHI inc. 一覧をこの条件で絞り込み できたら良いのだけど... 機能開発の要望は増え続ける 4 金額は税込表示にも 対応してほしい! 薬局横断で 在庫を分析したいです
© KAKEHASHI Inc. All Rights Reserved. 患者の命に関わる医薬品を扱うプロダクトで 品質を犠牲にすることはできない
© KAKEHASHI Inc. All Rights Reserved. 品質を損なうことなく、 素早く価値を提供したい
© KAKEHASHI Inc. All Rights Reserved. 一見遠回りに見えるほど丁寧なテスト戦略が 結果的に素早い価値提供につながる
©KAKEHASHI inc. Musubi AI在庫管理 フロントエンドのテスト戦略 8
©KAKEHASHI inc. テスト戦略 - テストの構成と比率 E2E テストの比率のベースとなる考え方はTesting Trophy 9 Kent
C. Dodds - The Testing Trophy and Testing Classifications Playwright Integration Unit Vitest Testing Library Vitest
©KAKEHASHI inc. 外部仕様に基づくテスト 10 外部 仕様書 テスト 仕様書 テスト コード
テスト戦略 - テストの流れ
©KAKEHASHI inc. 【税額】 以下の場合のみ表示されます。 • 選択した出庫先が「消費税表示する」であり、 消費税計算単位が「明細ごと」の場合 テスト戦略 - 外部仕様書の作成
エンジニアが外部仕様を書くことで • 期待する結果が明確になる → 手戻りを減らす • 仕様の複雑さに気付く → ユーザーの混乱やバグを減らす ①外部仕様書 11 👍シンプルな仕様 【出庫単価】 任意の金額を登録できます。ただし、空欄で確定はできません。出庫単価の入力は必須です。 出庫単価は小数点第二位まで入力可能です。なお、小数点第三位を入力した場合は丸められま す。 管理者権限ユーザーの場合 初期設定では、出庫対象日時点の自店舗の原価マスタの設定金額を表示しています。原価マスタ が未設定の場合は出庫対象日時点の単位薬価を表示します。 一般権限ユーザーの場合 初期設定では、単位薬価を表示しています。原価マスタ設定によって表示は変わりません。 • 計算式:単位薬価×出庫額算出率(取引先マスタ設定) • 端数処理:小数第三位を四捨五入して表示 • 数値タイプ:小数第二位まで 😵複雑な仕様
©KAKEHASHI inc. テスト戦略 - テスト仕様書の作成 ②テスト仕様書 12 • 基本的な考え方は外部仕様に対する境界値テスト •
パラメータの組み合わせはデシジョンテーブルで表現 ◦ 組み合わせが多い場合はペアワイズ法を活用 パラメータ 1 消費税表示 パラメータ 2 計算単位 期待値1 税額の表示 する 伝票 しない する 明細 する しない 伝票 しない しない 明細 しない
©KAKEHASHI inc. テスト戦略 - テストコードの記述 ③テストコード 13 • テストケースが明確なので生成AIを積極的に活用して効率化 •
あるパラメータについて1ケースだけ人間が記述 • Parameterizedテストに変換 • 残りのケースの追加を生成AIに指示 🤖テストコード記述の流れの例 test.eachによるParameterizedテスト
©KAKEHASHI inc. 障害発生件数とリードタイム 変更の リードタイム 14 障害発生件数 外部仕様に基づくテスト の取り組み開始 3月
4月 5月 6月 7月 8月 9月 (上) AI在庫管理の障害発生件数の集計値、(下) Findy Team+によるリードタイム計測値
© KAKEHASHI Inc. All Rights Reserved. 一見遠回りに見えるほど丁寧なテスト戦略が 結果的に素早い価値提供につながる
©KAKEHASHI inc. PM・EM・エンジニアを積極採用中 https://kakehashi-dev.hatenablog.com/entry/2025/07/17/093000 We’re Hiring!!!