フロントエンド開発のためのテスト入門 今からでも知っておきたい自動テスト戦略の必須知識

吉井 健文(著)

商品番号
178180
販売状態
発売中
納品形態
宅配便にてお届け
発売日
2023年04月24日
出荷開始日
2023年04月21日
ISBN
9784798178189
判型
B5変
ページ数
320
キーワード
開発  アプリ開発  UI・UX

¥3,080(本体¥2,800+税10%)
送料無料

280pt (10%)
ポイントの使い方はこちら

在庫あり

初回購入から使えるポイント500円分プレゼント

電子書籍はこちら

※1点の税込金額となります。 複数の商品をご購入いただいた場合のお支払金額は、 単品の税込金額の合計額とは異なる場合がございますので、予めご了承ください。

現場で役立つテスト手法を基礎から解説!
「どこから」「どうやって」手をつければよいかわかる

本書は、Webアプリケーション開発に携わるフロントエンドエンジニアを対象に、「テスト」の基本知識と具体的な実践手法を解説した書籍です。

高度な機能を画面上で提供する現代のWebアプリケーションでは、その品質や保守性を担保するうえで、フロントエンドにおける自動テストが重要な役割を持ちます。

本書はそんな「フロントエンドにおけるテスト」をテーマに、基本的なテストコードの書き方や、目的に応じたテスト手法・ツールの使い分け方を解説します。「UIコンポーネントテスト」や「ビジュアルリグレッションテスト」など、フロントエンドならではの具体的なテスト課題に重点を置いており、基本から実践まで必要な知識を体系的に身につけることができます。

解説はサンプルWebアプリケーション(Next.js)を舞台にしたハンズオン形式で進みます。「アクセシビリティの改善」や「CIでのテスト実行」といったトピックもフォローしているので、開発現場で役立つ実践的な知識・ノウハウがきちんと身につく一冊です。

■こんな方におすすめ
・テストの必要性は理解しているが着手できていない
・それなりに開発経験はあるがテストを書いたことがない
・現在取り組んでいるテスト手法が最適かわからない

■本書で取り上げるテストツール
Jest/Testing Library/Storybook/reg-suit/Playwright...etc

■目次
第1章 テストの目的と障壁
第2章 テスト手法とテスト戦略
第3章 はじめの単体テスト
第4章 モック
第5章 UIコンポーネントテスト
第6章 カバレッジレポートの読み方
第7章 Webアプリケーション結合テスト
第8章 UIコンポーネントエクスプローラー
第9章 ビジュアルリグレッションテスト
第10章 E2E テスト

【ダウンロード付録】
付録A GitHub Actionsで実行するUIコンポーネントテスト
付録B GitHub Actionsで実行するE2Eテスト
※翔泳社の書籍サイトからPDFをダウンロードできます。

画像01
画像02

第1章 テストの目的と障壁
1-1 本書の構成
1-2 テストを書く目的
1-3 テストを書く障壁

第2章 テスト手法とテスト戦略
2-1 範囲と目的で考えるテスト
2-2 フロントエンドテストの範囲
2-3 フロントエンドテストの目的
2-4 テスト戦略モデル
2-5 テスト戦略計画

第3章 はじめの単体テスト
3-1 環境構築
3-2 テストの構成要素
3-3 テストの実行方法
3-4 条件分岐
3-5 閾値と例外処理
3-6 用途別のマッチャー
3-7 非同期処理のテスト

第4章 モック
4-1 モックを使用する目的
4-2 モックモジュールを使ったスタブ
4-3 Web APIのモック基礎
4-4 Web APIのモック生成関数
4-5 モック関数を使ったスパイ
4-6 Web APIの詳細なモック
4-7 現在時刻に依存したテスト

第5章 UIコンポーネントテスト
5-1 UIコンポーネントテストの基礎知識
5-2 必要なライブラリのインストール
5-3 はじめのUIコンポーネントテスト
5-4 アイテム一覧UIコンポーネントテスト
5-5 インタラクティブなUIコンポーネントテスト
5-6 ユーティリティ関数を使用したテスト
5-7 非同期処理を含むUIコンポーネントテスト
5-8 UIコンポーネントのスナップショットテスト
5-9 暗黙のロールとアクセシブルネーム

第6章 カバレッジレポートの読み方
6-1 カバレッジレポートの概要
6-2 カバレッジレポートの読み方
6-3 カスタムレポーター

第7章 Webアプリケーション結合テスト
7-1 Next.jsアプリケーション開発と結合テスト
7-2 React Contextの結合テスト
7-3 Next.js Routerの表示結合テスト
7-4 Next.js Routerの操作結合テスト
7-5 Formを扱いやすくするReact Hook Form
7-6 Formのバリデーションテスト
7-7 Web APIレスポンスをモックするMSW
7-8 Web APIの結合テスト
7-9 画像アップロードの結合テスト

第8章 UIコンポーネントエクスプローラー
8-1 Storybookの基本
8-2 Storybookの必須アドオン
8-3 Context APIに依存したStoryの登録
8-4 Web APIに依存したStoryの登録
8-5 Next.js Routerに依存したStoryの登録
8-6 Play functionを利用したインタラクションテスト
8-7 addon-a11yを利用したアクセシビリティテスト
8-8 StorybookのTest runner
8-9 Storyを結合テストとして再利用する

第9章 ビジュアルリグレッションテスト
9-1 ビジュアルリグレッションテストの必要性
9-2 reg-cliで画像比較をする
9-3 Storycapの導入
9-4 reg-suitを導入する
9-5 外部ストレージサービスを準備する
9-6 GitHub Actionsにreg-suitを連携する
9-7 ビジュアルリグレッションテストを活用した積極的なリファクタリング

第10章 E2E テスト
10-1 E2Eテストの概要
10-2 Playwrightのインストールと基礎
10-3 テスト対象アプリケーションの概要
10-4 開発環境でE2Eテストを実行する
10-5 Prismaの簡単な紹介とテスト準備
10-6 ログイン機能のE2Eテスト
10-7 プロフィール機能のE2Eテスト
10-8 Like機能のE2Eテスト
10-9 新規投稿ページのE2Eテスト
10-10 記事編集ページのE2Eテスト
10-11 投稿記事一覧ページのE2Eテスト
10-12 Flakyテストと向き合う

【ダウンロード付録】
付録A GitHub Actionsで実行するUIコンポーネントテスト
付録B GitHub Actionsで実行するE2Eテスト

各種問い合わせは以下のリンクからご連絡ください

関連商品

実践マイクロサービスAPI

販売価格:4,180円(税込)

2023.10.18発売

いきなりプログラミング Androidアプリ開発

販売価格:2,420円(税込)

2023.09.22発売

おすすめ特集

【2023年上半期】SEshop人気書籍 ベスト20

【2023年上半期 ベスト20】新刊IT書を筆頭に、エンジニア必携・マネジメント本など人気書籍をご紹介

注目のプログラミング教育本

小学校で必修に!話題のプログラミング教育の本はこちら

ベンダー資格 試験対策本特集

ベンダー資格に関する書籍を試験ごとに紹介!ベンダー資格試験対策本特集

アルゴリズムと数学の本

プログラマ脳を鍛える!エンジニアが読むべきアルゴリズムと数学の本特集

デジタルイラスト参考書

基本的な描き方から高度なテクニック、デジタルツールの使い方まで!デジタルイラスト上達本のご紹介

翔泳社のセミナー・講座

開発・ビジネス・マーケティング・EC運営・営業支援など、幅広いジャンルの講座を開催

特集をもっと見る