Comment gérer les importations de modules ES6 moqueuses avec Jest ?

Se moquer des importations de modules ES6 avec Jest

Dans le monde des tests avec les modules ES6, se moquer des dépendances peut parfois poser un défi. Cet article explique comment simuler les importations de modules ES6 à l'aide de Jest, en fournissant une solution qui fonctionne à la fois pour les exportations nommées et par défaut.

Le problème

Considérez le module ES6 hypothétique suivant qui s'appuie sur un autre module. pour la fonctionnalité :

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

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

Dans un scénario de test idéal, nous aimerions nous moquer du module de dépendance et affirmer que la fonction doSomething est appelée avec les arguments attendus. Cependant, cette tâche peut être délicate avec Jest.

L'approche « Beurk »

Une approche courante consiste à remplacer les importations par des exigences et à les déplacer au sein des tests, comme on le voit ici :

<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>

Bien que cette approche réponde au besoin immédiat, elle introduit des modifications inutiles à la base de code et dégrade la qualité globale du code.

L'approche « Hack »

Une solution plus élégante consiste à utiliser le importer la syntaxe *. Cette technique permet une mutation directe des exportations nommées ou par défaut, ce qui facilite la simulation.

Pour les exportations nommées :

<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>

Pour les exportations par défaut :

<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>

Attention

Il est important de noter que la mutation des modules importés de cette manière peut entraîner des effets secondaires et un comportement imprévisible dans les tests. Par conséquent, même si cette approche peut constituer une solution rapide, elle n’est pas recommandée comme pratique à long terme. Jest propose des méthodes plus conventionnelles pour se moquer et espionner les modules, qui devraient plutôt être envisagées.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!