Jest を使用して ES6 モジュールのインポートをモック処理する方法は?

Jest を使用した ES6 モジュールのインポートのモック

ES6 モジュールを使用したテストの世界では、依存関係のモックが課題となることがあります。この記事では、Jest を使用して ES6 モジュールのインポートをモックする方法を詳しく掘り下げ、名前付きエクスポートとデフォルト エクスポートの両方で機能するソリューションを提供します。

問題

別のモジュールに依存する次の仮想 ES6 モジュールについて考えてみましょう。機能の場合:

<code class="js">// myModule.js
import dependency from './dependency';

export default (x) => {
  dependency.doSomething(x * 2);
};</code>

理想的なテスト シナリオでは、依存関係モジュールをモックし、期待される引数を使用して doSomething 関数が呼び出されていることをアサートしたいと思います。ただし、このタスクは Jest では難しい場合があります。

「ヤック」アプローチ

一般的なアプローチには、次に示すように、インポートを require に置き換え、テスト内で移動することが含まれます。

<code class="js">// Dependency Code
export const doSomething = (y) => console.log(y);

// Module Code (Modified)
export default (x) => {
  const dependency = require('./dependency'); // Yuck
  dependency.doSomething(x * 2);
};

// Test Code (Modified)
import myModule from '../myModule';
import dependency from '../dependency';

describe('myModule', () => {
  it('calls the dependency with double the input', () => {
    jest.mock('../dependency');

    myModule(2);

    const dependency = require('../dependency'); // Also yuck
    expect(dependency.doSomething).toBeCalledWith(4);
  });
});</code>

このアプローチは差し迫ったニーズを満たしますが、コードベースに不必要な変更が加えられ、コード全体の品質が低下します。

「ハック」アプローチ

より洗練された解決策には、 import * 構文。この手法により、名前付きエクスポートまたはデフォルト エクスポートの直接変更が可能になり、モックが簡単になります。

名前付きエクスポートの場合:

<code class="js">// Test Code
import myModule from '../myModule';
import * as dependency from '../dependency';

describe('myModule', () => {
  it('calls the dependency with double the input', () => {
    dependency.doSomething = jest.fn(); // Mutate the named export

    myModule(2);

    expect(dependency.doSomething).toBeCalledWith(4);
  });
});</code>

デフォルト エクスポートの場合:

<code class="js">// Test Code
import myModule from '../myModule';
import * as dependency from '../dependency';

describe('myModule', () => {
  it('calls the dependency with double the input', () => {
    dependency.default = jest.fn(); // Mutate the default export

    myModule(2);

    expect(dependency.default).toBeCalledWith(4); // Assert against the default
  });
});
</code>

注意

このような方法でインポートされたモジュールを変更すると、テストで副作用や予期しない動作が発生する可能性があることに注意することが重要です。したがって、このアプローチは迅速な修正を提供する可能性がありますが、長期的な実践としてはお勧めできません。 Jest は、モジュールをモックしたりスパイしたりするためのより従来的な方法を提供しています。代わりに、それを検討する必要があります。

以上がJest を使用して ES6 モジュールのインポートをモック処理する方法は?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。