Jest генерирует ReferenceError при использовании универсальных типов Flow - PullRequest
Новая
       36

Jest генерирует ReferenceError при использовании универсальных типов Flow

0 голосов
/ 08 января 2019

Я получил приложение React, используя Redux, Flow-typed и Jest. Для создания моих редукторов я использую собственную универсальную фабрику createReducer<S> (initialState: S, actions: any): Reducer<S>

Чтобы создать какой-то редуктор, я делаю: 

const FooReducer = createReducer<FooState>(initialState, {
  'ACTION_ADD_USER': () => 'Foo',
})

У меня есть следующий контрольный пример: 

// @flow

import { createReducer } from 'create-reducer'

type AppState = { name: string }

const initialState: AppState = { name: '' }

const NameReducer = createReducer<AppState>(initialState, {
  'NAME_CHANGE': (state, name) => ({ ...state, name })
})

it('should change the name', () => {
  const action = { type: 'NAME_CHANGE', name: 'bar' }

  expect(NameReducer({ name: 'foo' }, action)).toEqual({ name: 'bar' })
})

Шут выбрасывает следующую ошибку: 

FAIL temp.spec.jsx

  ● Test suite failed to run

    ReferenceError: AppState is not defined

       7 | const initialState: AppState = { name: '' }
       8 | 
    >  9 | const NameReducer = createReducer<AppState>(initialState, {
         |                                   ^
      10 |   'NAME_CHANGE': (state, name) => ({ ...state, name })
      11 | })
      12 | 

      at Object.AppState (temp.spec.jsx:9:35)

По какой-то причине Jest не может найти определение моего типа, даже если оно объявлено прямо там. Я тщательно искал обходной путь, но пока мне не повезло. Надеюсь, у кого-то есть идея, что здесь не так?

ПРИЛОЖЕНИЕ:

Окружающая среда 

babel-core        6.26.0
babel-jest        23.6.0
babel-loader      6.4.1
babel-preset-flow 6.23.0
flow-bin          0.89.0
flow-typed        2.2.0
jest              23.6.0

.babelrc (обновлено): 

{
  "plugins": [
    "syntax-dynamic-import",
    "transform-runtime",
    "transform-object-rest-spread",
    "transform-class-properties",
    "transform-es2015-destructuring"
  ],
  "presets": [
    "babel-preset-flow",
    "es2015",
    "react",
    "stage-0"
  ],
  "env": {
    "start": {
      "presets": [
        "react-hmre"
      ]
    },
    "test": {
      "presets": [
        "es2015",
        "react",
        "stage-0"
      ]
    }
  }
}

jest.config.js 

module.exports = {
  roots: ['<rootDir>/spec/javascripts'],
  moduleNameMapper: {
    'c3': '<rootDir>/__mocks__/c3.js',
    '\\.(css|less|sass|scss)$': '<rootDir>/spec/javascripts/__mocks__/styleMock.js',
    '\\.(gif|ttf|eot|svg)$': '<rootDir>/spec/javascripts/__mocks__/fileMock.js'
  },
  moduleFileExtensions: [
    'jsx',
    'js'
  ],
  setupFiles: [
    '<rootDir>/spec/javascripts/__mocks__/global-mocks.js'
  ],
  moduleDirectories: [
    'node_modules',
    'app/javascript/src'
  ],
  transform: {
    '^.+\\.jsx?$': './node_modules/babel-jest'
  },
  testURL: 'http://localhost',
  testRegex: '.*.spec.jsx',
  verbose: true
}

createReducer.js 

function createReducer<S> (initialState: S, handlers: any): Reducer<S> {
  return function reducer (state = initialState, action) {
    if (handlers.hasOwnProperty(action.type)) {
      return handlers[action.type](state, action)
    } else {
      return state
    }
  }
}

1 Ответ

0 голосов
/ 16 января 2019

babel-preset-flow вызывается как flow preset в файле .babelrc. Вот обновленная версия: 

{
  "plugins": [
    "syntax-dynamic-import",
    "transform-runtime",
    "transform-object-rest-spread",
    "transform-class-properties"
  ],
  "presets": [
    "flow",
    "es2015",
    "react",
    "stage-0"
  ],
  "env": {
    "start": {
      "presets": [
        "react-hmre"
      ]
    }
  }
}

Для стандартной и тестовой среды требуется одинаковая конфигурация (здесь не требуется настройка env / test).

transform-es2015-destructuring плагин уже включен в babel-preset-es2015 .

...