如何将布尔值传递给 expect 语句以使用 mocha/chai 进行测试？

Question

使用 Vue CLI 我有一个单元测试，我正在尝试检查 true/false 看起来像这样：

describe('The thing', () => {
    it('must be available.', () => {
        const available = true
        const wrapper = shallowMount(MyVueComponent, {
            propsData: { available },
        })
        expect(wrapper).to.be.true
    })
})

当我运行npm run test:unit

我得到以下信息：

AssertionError: expected { Object (isFunctionalComponent, _emitted, ...) } to be true

如果我只是检查 available 的值，那么一切都很好。但这似乎是我做错了。

我编写的其他测试工作正常，因为我正在检查文本值：

describe('The thing', () => {
    it('should have a name.', () => {
        const name = 'Hal'
        const wrapper = shallowMount(MyVueComponent, {
            propsData: { name },
        })
        expect(wrapper.text()).to.include(name)
    })
})

我不确定如何检查 available 是否为布尔值且必须为 true。如有任何建议，我们将不胜感激！

编辑

这是我的 Vue 组件的样子：

export default {
    name: 'MyVueComponent',
    props: {
        name: String
    },
    data: function() {
        return {
            available: true,
        }
    },
}

编辑 2

这似乎在我的单元测试中有效：

describe('The thing', () => {
    it('must be available.', () => {
        const available = true
        const wrapper = shallowMount(MyVueComponent, {
            propsData: { available },
        })
        expect(wrapper.vm.available).to.be.true
    })
})

但是，它正在查看 /src 目录中的实际组件。如果我将数据值从 true 更改为 false，我的测试结果就会正确。我不确定如何让数据保持在测试级别。因此，如果我要更改 const available = false，我的测试应该会失败——但事实并非如此。

编辑 3

这似乎可行（访问数据对象）：

describe("The thing", () => {
  it("must be available.", () => {
    const defaultData = MyVueComponent.data();
    // const wrapper = shallowMount(MyVueComponent, {});
    expect(defaultData.available).to.be.true;
  });
});

但我引用的是我的实际代码，而不是在单元测试中，这似乎仍然不对。

Answer 1

您想检查收到的道具，您可以使用 wrapper.props()

describe('The thing', () => {
    it('must be available.', () => {
        const available = true
        const wrapper = shallowMount(MyVueComponent, {
            propsData: { available },
        })
        expect(wrapper.props().available).to.be.true
        // or: 
        // expect(wrapper.props().available).to.equal(available)
    })
})

Chai的.to.be.true and .to.equal使用===所以不需要单独检查它确实是一个布尔值，但是如果你更喜欢它的"expressiveness"，你也可以检查它:

expect(wrapper.props().available).to.be.a('boolean')

如何将布尔值传递给 expect 语句以使用 mocha/chai 进行测试？

How can I pass a boolean to an expect statement for testing using mocha/chai?

unit-testing

mocha.js

chai

vue.js