Jest - Les tests simples sont lents

Question

J'utilise Jest pour tester une application angulaire et les tests simples mettent beaucoup de temps à s'exécuter et je n'arrive pas à comprendre pourquoi.

Ma configuration Jest dans package.json :

"jest": {
  "modulePaths": [
    "<rootDir>/src",
    "<rootDir>/node_modules"
  ],
  "testPathIgnorePatterns": [
    ".git/.*",
    "node_modules/.*"
  ],
  "transformIgnorePatterns": [
    "node_modules/.*",
    ".*\\.js"
  ],
  "setupTestFrameworkScriptFile": "<rootDir>/src/setupJest.js",
  "preset": "jest-preset-angular",
  "testEnvironment": "jsdom",
  "testRegex": "src/app/.*\\.spec\\.ts$",
  "moduleFileExtensions": [
    "ts",
    "js",
    "json"
  ],
  "verbose": true,
  "cacheDirectory": ".jest-cache",
  "coveragePathIgnorePatterns": [
    ".*\\.(shim\\.ngstyle|ngfactory)\\.ts"
  ],
  "globals": {
    "ts-jest": {
      "tsConfigFile": "./tsconfig.json"
    },
    "__TRANSFORM_HTML__": true
  }
}

Mon fichier de configuration de Jest :

'use strict';
require('core-js/es6/reflect');
require('core-js/es7/reflect');
require('zone.js');
require('zone.js/dist/proxy.js');
require('zone.js/dist/sync-test');
require('zone.js/dist/async-test');
require('zone.js/dist/fake-async-test');
require('jest-zone-patch');

const getTestBed = require('@angular/core/testing').getTestBed;
const BrowserDynamicTestingModule = require('@angular/platform-browser-dynamic/testing').BrowserDynamicTestingModule;
const platformBrowserDynamicTesting = require('@angular/platform-browser-dynamic/testing')  .platformBrowserDynamicTesting;

getTestBed().initTestEnvironment(
    BrowserDynamicTestingModule,
    platformBrowserDynamicTesting()
);

Voici mon test simple :

fdescribe('RichTextEditorComponent', () => {
  it('should be fast', () => {
    expect(true).toBeTruthy();
  });
});

Quelqu'un a-t-il une idée de la raison pour laquelle cela prend plus de 9 secondes ?

Answer 1

Une autre possibilité est que ts-jest est lent. Il y a eu un question à ce sujet et il n'a pas été complètement résolu.

Il existe plusieurs solutions de contournement discutées . Ils se composent de paramètre isolatedModules=true et aussi --maxWorkers=1 . C'est-à-dire que, dans jest.config.js

'use strict';

module.exports = {
    preset: 'ts-jest',
    testEnvironment: 'node',
    globals: {
        'ts-jest': {
            isolatedModules: true
        }
    },
}

et exécuter

yarn test --maxWorkers=1

Cela pourrait valoir la peine d'essayer. Alternativement, il est possible de renoncer à ts-jest et d'utiliser la transpilation babel.

Answer 2

Lisez ces deux liens :

https://itnext.io/how-to-make-your-sluggish-jest-v23-tests-go-faster-1d4f3388bcdd https://github.com/facebook/jest/issues/7963

Voici une liste d'éléments à prendre en compte. Elles ne sont pas spécifiques à votre cas, mais comme le titre de la question est assez général, j'ai pensé qu'elles pourraient aider un certain pourcentage de visiteurs. Elles ne doivent pas être essayées aveuglément, elles sont simplement un point de départ pour la recherche.

Les choses à essayer pour accélérer vos tests de jest :

1. Exécuter en mode veille avec --watch

   jest optimise lorsque vous utilisez --watch .

2. sur votre ordinateur hôte plutôt que dans Docker ? -> J'utilisais précédemment docker exec -it <containername> yarn test et je l'ai trouvé plus rapide quand j'ai changé pour utiliser mon hôte.

3. mise à jour de la version de jest il semble qu'il y avait des bugs qui rendaient certaines versions plus lentes https://github.com/facebook/jest/pull/8046

   note : que yarn upgrade obéit aux signifiants de version ~ et ^, si vous savez ce que vous faites, vous pouvez simplement supprimer et réajoutez yarn remove jest yarn add -D jest qui vous donnera juste le dernier

4. changer l'environnement de test de jsdom à node

   "jest": { "testEnvironment": "node" }

5. Exécuter les tests de manière synchrone permet à jest d'optimiser ?

ajouter --runInBand option

6. Le fait de fixer un nombre maximum de travailleurs pourrait le rendre plus rapide ?

ajouter --maxWorkers=4 option

Dans mon cas, j'ai mis à jour la version de jest, j'ai commencé à utiliser --watch et --runInBand et à m'exécuter sur mon hôte plutôt que via docker, et le temps de mon test est passé de 2 minutes à 10 secondes. Je ne sais pas quel était exactement le problème dans mon cas.

Answer 3

J'ai résolu le même problème en installant jest de manière globale.

npm install -g jest@26.0

voici quelques résultats de benchmark avec le même projet et les mêmes cas de test

local - win10 version 2004 ----------------- -- node-14.7.0 -- 11.847 s

mondial - win10 version 2004 ----------------- -- node-14.7.0 -- 0.907 s

mondial - win10 version 2004 -- wsl/ubuntu-18.04 -- node-14.7.0 -- 0.469 s

Answer 4

Je pense que la réponse devra finalement venir de l'équipe Angular. La documentation pour platformBrowserDynamicTesting est clairsemée ( https://angular.io/api/platform-browser-dynamic/testing/platformBrowserDynamicTesting ).

Peut-être que platformBrowserDynamicTesting émule un navigateur et charge l'intégralité du DOM de votre application en mémoire. Dans ce cas, une montée en charge de près de 10 secondes pour une application Angular (sans aucun JavaScript en cache) semble raisonnable. Peut-être que j'interprète mal, mais d'après vos rapports, il semble que le test réel s'exécute en 6 millisecondes, ce qui devrait répondre à votre exigence d'un "test rapide". Je serais curieux de voir combien de temps les tests prennent si vous ajoutez un autre test simple "devrait être rapide 2". Si le total est toujours inférieur à 10 secondes, cela suggère que vos tests réels prennent très peu de temps par rapport à la montée en puissance de l'utilitaire Angular platformBrowserDynamicTesting.

Answer 5

J'utilise également Jest sur mon projet Angular et je ne suis pas sûr que ce soit une bonne solution.

Lorsque vous configurez votre module de test, vous pouvez utiliser NO_ERRORS_SCHEMA et il n'est pas nécessaire d'ajouter tous les composants imbriqués dans le fichier declarations pour compiler le composant que vous voulez tester.

beforeEach(async () => {
    return TestBed.configureTestingModule({
      declarations: [
        MyComponent
      ],
      schemas: [NO_ERRORS_SCHEMA]
    }).compileComponents();
  });

Vos tests avec Jest sont des tests unitaires, donc avec cette solution, vous ne testerez que votre composant. Si vous voulez tester l'interaction entre les composants, vous ferez des tests de bout en bout avec Protractor ou Puppeteer.