Vitestと統合可能!StorybookでNext.js v16のコンポーネントテストを行う 後編 - App Routerでの設定・モジュールモック -
はじめに # ビジネスソリューション事業部の塚野です。 本記事は「Vitestと統合可能!StorybookでNext.js v16のコンポーネントテストを行う」の後編です。 前編では Storybook の導入や基本的な使い方についてご紹介しました。本記事では Next.js 固有の設定やモジュールモックなどについてまとめていきます...
記事を読むVitestと統合可能!StorybookでNext.js v16のコンポーネントテストを行う 前編 - 導入・基本編 -
はじめに # ビジネスソリューション事業部の塚野です。 皆さんはフロントエンド開発の際にコンポーネントのテストをどのように行っているでしょうか? 自分は最近になり、Storybook というオープンソースツールに入門しました。 https://storybook.js.org この Storybook は UI カタログを作成するサービスです。 コンポーネントをアプリ本体から切り離して単体で描画でき、Props や状態のパターンを「ストーリー」として整理ができます...
記事を読むユーザー部門のあなたに送る - 「『情シスはテストしたのに…』と言わせない!クマに学ぶ“ユーザーテスト”のホントの意味」
これは豆蔵デベロッパーサイトアドベントカレンダー2025第19日目の記事です。 こんにちは&はじめまして、教育グループのやさぐれ豆ぱんだこと、おのでらです。 ユーザー部門(ビジネス部門)の皆様、ユーザーテスト(受け入れテスト)の依頼が来るたびに、正直、こう思ったことはありませんか? 「情シスがちゃんとテストしたはずなのに、なんで私たちが改めてテストしなければいけないの?」 忙しい業務の合間を縫ってのテスト作業...
記事を読むKiro で始める Property-Based Testing:想定外を炙り出す
これは豆蔵デベロッパーサイトアドベントカレンダー2025第17日目の記事です。 1. はじめに:なぜ今、PBTを試すのか # プロパティベーステスト(以下 PBT)は、仕様から抽出された「満たすべき性質(property)」を任意の入力・状態・操作系列に対して検証するテスト手法です。PBT は、従来の事例ベーステストと相互補完的な関係にあることが知られています[1]。 正直、この説明だけでピンと来る人は多くないのではないでしょうか...
記事を読むミューテーションテストの開発組み込みを考える
前回の記事でJavaのミューテーションテストツールPIT(PiTest)を紹介しました[1]。ミューテーションテストはテストの質を評価するうえで有望な技術ですし、PITを利用すれば特に設定を作り込むことなく簡便なテストの評価ができます。 しかし、機械的に変異を組み込むアプローチであるがために、日々の開発で利用するならば検討したほうが良い点もあります。引き続き以前の記事で利用してきた「よくあるサンプルアプリ」を題材にして、どのような理想が望ましいかを検討してみます...
記事を読むミューテーションテストの技法でテストの十分性を評価する
これは豆蔵デベロッパーサイトアドベントカレンダー2024第3日目の記事です。 以前の記事でミューテーションテストについて軽く紹介しましたが、具体的な手法については紹介できていませんでした。そこで今回は以前の記事で利用してきた「よくあるサンプルアプリ」を題材にして[1]Javaの開発プロジェクトにミューテーションテストを組み込んでみます...
記事を読むEasyMockの基本的な使い方の備忘録
内製化支援などの案件で実装初心者の方にレクチャすることがあるのですが、テストの実装は皆さん躓きやすい部分です。単体テストでもモックオブジェクトを使ったりしてなおさら難しい。それらに関しては外部のライブラリなのでJavaの講座でもやらなかったりします。 というわけでそのようなライブラリの中でも以前の案件でよく使われていたEasyMockについて、大体カバーできるかなという使い方をおさらいしようと思います...
記事を読むWSL上のPlaywrightの実行ブラウザを画面表示するときにハマったこと
はじめに # Windows10でWSL2上にインストールされたPlaywrightの実行ブラウザを画面に表示(ヘッドレスモードオフ)しようとした際、最初上手くいかなかったので原因とその対処した内容をまとめます...
記事を読むLambdaでPlaywrightを動かす(Lambdaレイヤー / コンテナ)
今クロスブラウザテストでよく使われるツールといえばPlaywrightですね。 テストでなくとも単純にブラウザ自動化ツールやスクレイピングツールとして使っている現場も多いかと思います。 とある事情で、Lambda上でPlaywrightを動かしてみましたが、予想以上に苦戦したので備忘録も兼ねて手順をまとめます。 Lambdaレイヤーを使う # これが一番簡単な方法です。 Playwright等のツールはそれ単体では動作せず、Chromium等のブラウザをインストールしなければなりません...
記事を読むNuxt3 - 単体テスト後編 - モック・スタブ用のユーティリティを使う
前回はNuxt3の単体テスト方法として以下の内容を見てきました。 Nuxtのテストユーティリティ(@nuxt/test-utils)をセットアップする テスト用のNuxt環境上でNuxtコンポーネントをマウントしてテストを書く 後半となる今回は、テストユーティリティが提供するモック・スタブに関する機能について見てみたいと思います。 --> InformationここではVitest自体のモック機能について詳細は触れません。 少し昔のものですが、以下の記事でVitestの概要をご紹介してます...
記事を読む
