Как протестировать с Jest такой компонент со store?

Question

[Ninja Mate]

Есть компонент, который вроде бы должен импортироваться без redux как dummy, но так не получается.
Есть два решения проблемы - разобраться как импортировать простой компонент или как правильно завернуть в Provider. Любому решению рад.
Test

import React from 'react'
import {createStore} from 'redux'
import Provider from 'react-redux'
import reducers from '../src/store/createStore'

import renderer from 'react-test-renderer'

import {Station} from './../src/routes/Station/components/Station/Station'
cont store = createStore(reducers)
describe('Test Station Router', () => {
it('+++ renders correctly Station', () => {
    const tree = renderer.create(
      <Provider store={store}>
        <Station list={menuItems} current='current' zip='ZIP'
          onPlay={() => {}}
          changeFocus={() => {}}
          isFocused={() => {}}
          downHandler={() => {}} />
      </Provider>
		).toJSON()
    expect(tree).toMatchSnapshot()
  })
})

Station компонент

import React from 'react'
import '../../../../styles/core.scss'
import StationListMenu from '../../../../components/StationList'
import TopNavigation from '../TopNavigation'
import NamedMenuComposer from '../../../../lib/reactv-navigation/components/NamedMenu'
import PropTypes from 'prop-types'

export const Station = ({list, changeFocus, isFocused, current, focusChange, downHandler, onPlay, zip}) => (
  <div className='MainMenu innerContent'>
    <TopNavigation defaultFocus={`station:navigation:${current}`}
      mid='station:navigation'
      onDown={changeFocus('station:list')}
      focused={isFocused('station:navigation')}
      newFocus={focusChange} />
    <div className='ContentNav'>
      <StationListMenu menuItems={list}
        mid={`station:list:${current}`}
        focused={isFocused('station:list')}
        onUp={changeFocus('station:navigation')}
        onDown={downHandler}
        onEnter={onPlay}
        zip={zip}
      />
    </div>
  </div>
)

Station.propTypes = {
  downHandler: PropTypes.func.isRequired,
  list: PropTypes.array
}

// export default NamedMenuComposer 
// return menuComposer(connect(mapStateToProps, mapDispatchToProps)(NamedMenu))
export default NamedMenuComposer(Station)

createStore

import { applyMiddleware, compose, createStore as createReduxStore } from 'redux'
import thunk from 'redux-thunk'
import { browserHistory } from 'react-router'
import makeRootReducer from './reducers'
import { updateLocation } from './location'
import attachWatchers from './watchers'
import {routerMiddleware} from 'react-router-redux'

const createStore = (initialState = {}) => {
  // ======================================================
  // Middleware Configuration
  // ======================================================
  const middleware = [thunk, routerMiddleware(browserHistory)]

  // ======================================================
  // Store Enhancers
  // ======================================================
  const enhancers = []
  let composeEnhancers = compose

  if (__DEV__) {
    if (typeof window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ === 'function') {
      composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
    }
  }

  // ======================================================
  // Store Instantiation and HMR Setup
  // ======================================================
  console.info('creating redux store...')
  const store = createReduxStore(
    makeRootReducer(),
    initialState,
    composeEnhancers(
      applyMiddleware(...middleware),
      ...enhancers
    )
  )
  attachWatchers(store)

  store.asyncReducers = {}

  // To unsubscribe, invoke `store.unsubscribeHistory()` anytime
  store.unsubscribeHistory = browserHistory.listen(updateLocation(store))

  if (module.hot) {
    module.hot.accept('./reducers', () => {
      const reducers = require('./reducers').default
      store.replaceReducer(reducers(store.asyncReducers))
    })
  }

  return store
}

export default createStore

Ошибка

console.error node_modules/fbjs/lib/warning.js:35
Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in.

Как это протестировать?

Answer 1

[Negwereth]

Слушай, ну начни уже ошибки читать.

Тут к тестам вообще ничего не относится, уже вторая ошибка из-за проблемного кода, а не логики.

Comments

[Ninja Mate]

я не понимаю чего оно от меня хочет. куда смотреть?
в самом файле из которого ошибка

if (process.env.NODE_ENV !== 'production') {
  var printWarning = function printWarning(format) {
    for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
      args[_key - 1] = arguments[_key];
    }

    var argIndex = 0;
    var message = 'Warning: ' + format.replace(/%s/g, function () {
      return args[argIndex++];
    });
    if (typeof console !== 'undefined') {
// Ошибка 
      console.error(message);
    }

[Negwereth]

Ninja Mate, React.createElement: type is invalid

Оно же прямо говорит, что какой-то из твоих модулей компонент не возвращает.

У тебя линтер стоит какой-то?

[Ninja Mate]

Negwereth, да стоит. само приложение работает. это как то связано с оберткой Provider. в самом компоненте еще два компонента таких же. после кучи часов, я думаю, что делаю что то неправильно именно с createStore