我正在测试一个 Vue 组件,但在测试按钮的禁用状态时遇到问题。如何在我的测试中访问按钮的禁用状态?
我尝试过使用.attributes()
,但在这种情况下,该方法仅返回未设置的按钮属性v-bind
。SubmitButton.attributes().disabled
总是null
。
零件
<button
id="edit-resource-modal-submit"
class="btn btn-sm btn-primary modal-button"
:disabled="loadingResource || !formValid"
@click="submit"
>
Save
</button>
测试
describe('Disables buttons if', () => {
beforeEach(async() => {
await wrapper.setProps({ isModalOpen: true });
});
it('modal is loading', async() => {
wrapper.vm.loadingResource = true;
const SubmitButton = wrapper.find('#edit-resource-modal-submit');
expect(SubmitButton.exists()).toBe(true);
expect(SubmitButton.attributes().disabled).toBe('true');
});
});
.attributes() 只返回
{
id: 'edit-resource-modal-submit',
class: 'btn btn-sm btn-primary modal-button'
}