Jestの記事一覧

storybook

Storybook 単体でインタラクションテストを実施する

Storybook の Component Story Format 3.0 では新機能として play() 関数が追加されました。 `play()` 関数は Storybook 上で ユーザーのインタラクションな操作を表現することができます。 以前は composeStories() 関数により Storybook 上で作成したストーリーを Jest で再利用する方法を書いたのですが、どうやら Storybook のみで完結してテストを実行することができるようですのでこちらを試してみます。

storybook

Storybook の interaction testing と jest を組み合わせる

Storybook の Component Story Format 3.0 では新機能として `play()` 関数が追加されました。 `play()` 関数は Storybook 上で ユーザーのクリックやフォーム入力のようなインタラクションな操作を表現することができます。 `play()` 関数の大きな特徴としては Component Story Format の移植性の高さを利用して Storybook 上で定義したインタラクションを `Jest` など他の領域においても再利用できることです。

msw2

msw でリクエストを検証する方法

msw 使ってテストを記述した時期待したリクエストが送信されているのか検査したくなるかもしれません。リクエストを検証する方法と、それを回避する方法を紹介します。

double burger

テストコード内では条件分岐を書かないようにする

誰でも読める愚直なコードであることの 1 つの目安として、テストコードの中に if 文や三項演算子などの条件分岐が入り込んでいていないことが上げられます。if 文が存在するコードはアンチパターンであるといえます。実際に if 文がテストコードの中に入り込んだ例を見てみましょう。

jest-preview

Jest Preview がけっこーすごい

Jest Preview とは Jest で実行中のテストに debug() 関数を仕込むことで、実行中のテストが作成した HTML をブラウザでプレビューしながらデバッグできるライブラリです。

jest

Jest setTimeout()のようなでタイマー関数をテストする

JavaScriptには、setTimeout()のような時間に関する便利な機能が用意されています。しかし、これらの関数はユニットテストを記述する際に厄介です。Jestのタイマーモックはこのような場合に利用できる便利な機能です。

Vue.js

Vue3 コンポーネントのテスト

コンポーネントのテストをするのフレームワークとしてJest、vue-test-utils 2を利用します。Vue2系をターゲットにしているvue-test-utils 1とは一部APIが異なります。

jest

JavaScript テストフレームワークのJestのモックがすごくすごい

Jestは、JavaScriptのシンプルなテスティングフレームワークです。ゼロコンフィグを謳っており、細かい設定なしに動作させることが可能です。 Jestの中でも特に強力な機能がモッキングです。Jestのモックを利用すれば、外部ライブラリであろうとモジュール外のオブジェクトを簡単にモック化することができます。 実際に、テストコードの例を見ていきましょう。