reactjs - mapStateToProps() 中的 Jest + enzyme 测试错误

Question

我在使用 enzyme mount 函数测试 redux 时遇到问题。

错误:未捕获[TypeError:selectors.selectMessages不是函数]

为什么我会收到此错误？

//badgeSelector.js. R - is Ramda.

import { createSelector } from 'reselect'
export const selectMessages = createSelector(R.path(['badgeReducer', 'unreadMessages']), (messages) => messages)

//App.js
import * as selectors from 'commons/selectors/badgeSelector'

export class App extends PureComponent {
    render() {
        return (
            ...
        )
    }
}

export default connect(
        (state) => ({
            messages: selectors.selectMessages(state)
        }),
        (dispatch) => ({
            updateBadge: () => {
                dispatch(updateBadge())
            }
        })
    )(App)
    
//App.test.js

import ConnectedApp, {App} from './App'

describe('Badge react-redux test mount: ', () => {
        const mockStore = configureStore()
        let store, wrapper
        beforeEach(() => {
            store = mockStore(state)
            wrapper = mount(<Provider store={store}><ConnectedApp /></Provider>) //Error when mount
        })

        it('render mount component', () => {
            expect(wrapper.find(ConnectedApp).length).toEqual(1)
        })
    })

Answer 1

已解决:jest 不接受来自 webpack 的别名路径

要修复上述错误，您需要根据需要设置别名:

alias: {
            component: path.resolve(__dirname, './main/component'),
            commons: path.resolve(__dirname, './main/app/src/common')
        }

并正确设置 jest moduleNameMapper:

"moduleNameMapper": {
      "^commons(.*)$": "<rootDir>/main/app/src/common/$1",
      "^component(.*)$": "<rootDir>/main/component/$1"
    }