代码之家  ›  专栏  ›  技术社区  ›  four-eyes

为Jest测试设置Redux提供程序

  •  0
  • four-eyes  · 技术社区  · 2 年前

    我正试图用我的react应用程序为Jest测试设置一个redux提供商。 据我所知,我需要这样的东西

    import {ReactNode} from 'react'
    import {Provider} from 'react-redux'
    import {store} from "../redux/reducer/store";
    
    type PropsWithOptionalChildren<P = unknown> = P & { children?: ReactNode };
    type RootState = ReturnType<typeof store>    
    interface ReduxProviderProps extends PropsWithChildren {
        store: RootState,
    }
    
    const ReduxProvider = ({children, store}: ReduxProviderProps) => <Provider store={store}>{children}</Provider>
    
    export default ReduxProvider
    

    然后我就这样用

    test("...", () => {
      const store = configureStore();
      const wrapper = ({ children }) => (
        <ReduxProvider reduxStore={store}>{children}</ReduxProvider>
      );
      ...
    });
    

    但是,编译器抱怨以下行

    type RootState = ReturnType<typeof store>
    

    type[…]不满足约束(…args:any)=>任何 type[…]不提供签名的匹配项(…args:any):any

    这是 store 变量

    export const store = configureStore({
        reducer: persistedReducer,
        devTools: process.env.NODE_ENV !== 'production',
        middleware: getDefaultMiddleware =>
            getDefaultMiddleware({
                serializableCheck: false
            }).concat(apiSlice.middleware),
    });
    

    以及其他信息

    export const rootReducer = combineReducers({
        a: aReducer,
        b: bReducer,
        [apiSlice.reducerPath]: apiSlice.reducer,
    })
    
    const config = getPersistConfig({
        key: 'root',
        storage,
        blacklist: ['a'],
        rootReducer
    })
    
    const persistedReducer = persistReducer(config, rootReducer)
    

    如何解决编译器错误?

    2 回复  |  直到 2 年前
        1
  •  0
  •   electroo096    2 年前

    试试这个:

    type RootState = ReturnType<typeof store.getState>;
    
        2
  •  -1
  •   Hardik Chavda    2 年前

    将RootState类型更改为如下,并查看它是否解析

    type RootState = ReturnType<typeof store>