Реализуйте StoryShots для сборника рассказов с помощью Angular

Question

Я запускаю приложение Angular v8 и в сборнике рассказов. Я хочу интегрировать для него автоматическое визуальное тестирование и нашел StoryShots. Нашел эту инструкцию и реализовал вот так. Поскольку Karma - это инструмент тестирования в приложении, я настраиваю конфигурацию jest, чтобы визуально проверять только файлы с "test.ts". Jest нашел файлы spec.ts, но только с файлом test.ts, он не может найти тестNo tests found, exiting with code 1. Что я пропустил? У кого-нибудь есть опыт работы с angular и StoryShots?

Это мой код:

package.json

  "scripts": {
   ...
    "jest": "jest"
  },
  "dependencies": {
    ...
    "@angular/core": "^8.2.13"
  },
  "devDependencies": {
    ...
    "@storybook/addon-storyshots": "^5.2.8",
    "@storybook/angular": "^5.2.8",
    "@types/jest": "^24.0.23",
    "jest-preset-angular": "^8.0.0",
    "jest": "^24.9.0",
  },
  "engines": {
    "node": ">=10.15.0",
    "npm": "~6.4.0"
  }

jest.config.js

module.exports = {
  preset: 'jest-preset-angular',
  roots: ['src'],
  setupFilesAfterEnv: [
    './jest.setup.ts'
  ],
  testMatch: [
    '**/__tests__/**/*.test.+(ts)?(x)' // <- only test.ts files
  ],
  globals: {
    __TRANSFORM_HTML__: true
  },
  transform: {
    '^.+\\.jsx?$': 'babel-jest',
    "^.+\\.(ts|js|html)$": "ts-jest"
  },
  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node', '.html']
};

jest.setup.js

import 'jest-preset-angular';

В корневой папке у меня есть .storybook папка с тестовым файлом

storyshots.test.ts

import initStoryshots from '@storybook/addon-storyshots';

initStoryshots();

Answer 1

Хорошо, я понял. Проблема заключалась в том, чтоstoryshot.test.ts файла не было в папке src, поэтому мне пришлось изменить путь в jest.config.js нравится

  rootDir: '../',
  modulePaths: [
    '<rootDir>'
  ],