Javascript 如何测试封装在另一个连接组件中的连接组件？

我想测试我的纯组件，所以我要这样做：

mycop.js

export MyComp = props => {
  return (
    <Wrapper>Content</Wrapper>
  )
}

const MyCompConn = connect()(MyComp);
export default MyCompConn;

export mycop=props=>{
返回(
内容
)
}
const MyCompConn=connect（）（MyComp）；
导出默认的MyCompConn；

其中

：

导出包装器=（{children}）=>{
返回(
{儿童}
)
}
const WrapperConn=connect（）（包装器）；
导出默认包装器conn；

mycop.test.js

import React from 'react';
import renderer from 'react-test-renderer';

import { MyComp } from '../../MyComp';


describe('With Snapshot Testing', () => {
  it('renders!"', () => {
    const component = renderer.create(<Login />);
    const tree = component.toJSON();
    expect(tree).toMatchSnapshot();
  });
});

从“React”导入React；
从“反应测试渲染器”导入渲染器；
从“../../MyComp”导入{MyComp}；
描述（'使用快照测试'，（）=>{
它（'renders！'，（）=>{
const component=renderer.create（）；
const tree=component.toJSON（）；
expect（tree.toMatchSnapshot（）；
});
});

现在，当我运行

纱线测试时

会出现以下错误：

不变冲突：在“Connect（AppWrapper）”的上下文或道具中找不到“store”。请将根组件包装在中，或将“store”作为道具显式传递给“Connect（AppWrapper）”

这是因为

在我的

组件中连接了

，但我不确定如何测试只测试后者，即使它被包装在连接的组件上。

尝试以下方法：

import configureMockStore from 'redux-mock-store';

const store = mockStore({});
const component = renderer.create(<Provider store={store}><Login /></Provider>);

从“redux mock store”导入configureMockStore；
const store=mockStore（{}）；
const component=renderer.create（）；

要在不使用模拟存储的情况下测试我们的组件，我们可以使用Jest.PFB模拟react redux本身的连接示例：

import React from 'react';
import renderer from 'react-test-renderer';

import { MyComp } from '../../MyComp';

jest.mock('react-redux', () => ({
  connect: () => {
    return (component) => {
      return component
    };
  }
}));

describe('With Snapshot Testing', () => {
  it('renders!"', () => {
    const component = renderer.create(<Login />);
    const tree = component.toJSON();
    expect(tree).toMatchSnapshot();
  });
});

从“React”导入React；
从“反应测试渲染器”导入渲染器；
从“../../MyComp”导入{MyComp}；
mock（'react-redux'，（）=>({
连接：（）=>{
返回（组件）=>{
返回组件
};
}
}));
描述（'使用快照测试'，（）=>{
它（'renders！'，（）=>{
const component=renderer.create（）；
const tree=component.toJSON（）；
expect（tree.toMatchSnapshot（）；
});
});

---

现在，这将直接呈现

包装器

组件，而不是

连接的包装器

组件。

有没有办法在没有模拟存储的情况下实现它？同样，这不起作用，我得到

类型错误：store.getState不是一个函数

import React from 'react';
import renderer from 'react-test-renderer';

import { MyComp } from '../../MyComp';

jest.mock('react-redux', () => ({
  connect: () => {
    return (component) => {
      return component
    };
  }
}));

describe('With Snapshot Testing', () => {
  it('renders!"', () => {
    const component = renderer.create(<Login />);
    const tree = component.toJSON();
    expect(tree).toMatchSnapshot();
  });
});