Vue模板在测试中没有正确绑定

Question

我有一个简单的按钮组件，我想用vue-test-utils,mocha-webpack和jsdom来测试。

const Button = { 
    props: { 
    text: {default: 'Save draft'} 
    }, 

    data: function() { 
    return { 
     disabled: false 
    } 
    }, 

    template: ` 
    <input 
     v-bind:value='text' 
     v-bind:disabled='disabled' 
     type='submit' name='save' class='highlight' 
    > 
    ` 
} 

export default Button 

一切都在浏览器中正常工作，但没有我的v-bind属性在我的测试中被渲染：

describe('Button',() => { 

    it('has the right text',() => { 
    const wrapper = mount(SaveDraftButton, {}) 
    wrapper.update() 
    console.log(wrapper.html()) 

    expect(wrapper.hasAttribute('value', 'Save draft')).to.be.true 
    }) 
}) 

的console.log输出<input type="submit" name="save" class="highlight">。

非属性绑定（例如<p>{{ text }}</p>）正常工作。

任何人都可以建议我在这里做错了吗？这似乎是最简单的事情，我正在反对它。

Answer 1

显然这是jsdom的feature and not a bug。

解决方法： expect(wrapper.element.value).to.equal('Save draft')