// 使用CSS选择器
expect(wrapper.is('.outer')).toBe(true);
// 使用CSS选择器
expect(wrapper.contains('p')).toBe(true)
});
});
还可以进行一步对DOM结构进行更细致的验证：
// exists()：断言 Wrapper 或 WrapperArray 是否存在。
it('不存在img', () = > {
expect(wrapper.findAll('img').exists()).toBeFalsy()
});// isEmpty()：断言 Wrapper 并不包含子节点。
it('MyButton组件不为空', () = > {
expect(wrapper.find(MyButton).isEmpty()).toBeFalsy()
});
// attributes()：返回 Wrapper DOM 节点的特性对象
// classes()：返回 Wrapper DOM 节点的 class 组成的数组
it('MyButton组件有my-class类', () = > {
expect(wrapper.find(MyButton).attributes().class).toContain('my-button');
expect(wrapper.find(MyButton).classes()).toContain('my-button');
})
测试样式
UI的样式测试为了测试我们的样式是否复合设计稿预期。同时通过样式测试我们可以感受当我们code变化带来的UI变化，以及是否符合预期。
inline style ：如果样式是inline style，可以使用hasStyle来验证，也可以使用Jest的Snapshot Testing最方便。
// hasStyle：判断是否有对应的内联样式
it('MyButton组件有my-class类', () = > {
expect(wrapper.find(MyButton).hasStyle('padding-top', '10')).toBeTruthy()
})
CSS：属于E2E测试，把整个系统当作一个黑盒，只有UI会暴露给用户用来测试一个应用从头到尾的流程是否和设计时候所想的一样 。有专门的E2E测试框架。比较流行的E2E测试框架有nightwatch等，关于E2E测试框架的介绍可以参考这篇文章。
测试Props
父组件向子组件传递数据使用Props，而子组件向父组件传递数据则需要在子组件出发父组件的自定义事件
当测试对父组件向子组件传递数据这一行为时，我们想要测试的当我们传递给子组件一个特定的参数，子组件是否会按照我们所断言的那样变现。
在初始化时向子组件传值，使用的方法是propsData。
const wrapper = mount(Foo, {
propsData: {
foo: 'bar'
}
})
也可以使用setProps方法：
const wrapper = mount(Foo)
wrapper.setProps({ foo: 'bar' })我们传递给Test1组件的messages一个[‘bye’]数组，来验证是否存在：
beforeEach(() = > {
wrapper = mount(Test1, {
propsData: {
messages: ['bye'] }
});
});// props：返回 Wrapper vm 的 props 对象。
it('接收到了bye作为Props', () = > {
