Javascript 如何在Sinon js中存根jquery选择器

我正在做一些单元测试，我一直在尝试这个方法。 我还使用materialize作为下拉列表，我相信这是相关的。 是否有人面对这个问题并能提供帮助

我的密码是

componentDidUpdate() {
    $('.dropdown-trigger-filter').dropdown({belowOrigin: true, alignment: 'right', closeOnClick: false});
    this.controller.isFirstLoginRedirect(this.props);
}

我的测试：

describe('Home Component', async () => {
    let container = props => { return <Home store={store} {...props} />;    };

    it('should render correctly', () => {
        const props = {};
        const wrapper = mount(shallow(container(props)).get(0));
        const tree = renderer.create(container(props)).toJSON();

        expect(tree).matchSnapshot();
    });

    it('should change state of selected tab to quotes ', () => {
        const props = {};
        const wrapper = mount(shallow(container(props)).get(0));
        const $ = sinon.stub();
        $.withArgs('.dropdown-trigger-filter').returns({});
        (wrapper.find('.tab').at(0)).simulate('click');
        expect(wrapper.state('selectedTab')).equal('##quotes');
        expect(wrapper.debug()).matchSnapshot();
    });
});

---

您的直接错误是您已经存根了

$

，现在不再有

下拉列表

属性。如果您想让它工作，您需要返回模拟的

下拉列表

函数以及您碰巧调用的任何其他jquery函数

最终，您的测试将只是所有jquery调用的反映。它们将是复杂而脆弱的，因为您需要创建如此多的存根来重新生成您正在工作的环境

因此，出于这个原因，您根本不应该尝试存根jquery。如果您发现必须这样做，那么您可能需要重构以使测试更简单

在本例中，您需要测试正在使用的dom是否与jquery调用一起工作。因此，您需要生成一些DOM，并对其运行一些预期，如下所示：

it('should change state of selected tab to quotes ', () => {
    const props = {};
    const wrapper = generateCompleteDom();
    (wrapper.find('.tab').at(0)).simulate('click');
    expect(wrapper.state('selectedTab')).equal('##quotes');
    expect(wrapper.debug()).matchSnapshot();

---

请注意，它看起来与您已经拥有的几乎相同，只是您没有存根任何东西，只是生成了一个更完整的DOM（测试所需的任何东西）。

它不是一个函数。您返回的是一个存根

{}

中没有任何内容。现在，如果您返回

{dropdown:function（）{}

，那么它将存在：）实际工作！，非常感谢。

it('should change state of selected tab to quotes ', () => {
    const props = {};
    const wrapper = generateCompleteDom();
    (wrapper.find('.tab').at(0)).simulate('click');
    expect(wrapper.state('selectedTab')).equal('##quotes');
    expect(wrapper.debug()).matchSnapshot();