Skip to content

Commit aebcc13

Browse files
author
Jamie Stumme
committed
test(issue #1377): add test for props on stubbed child component
1 parent ee3a93f commit aebcc13

File tree

2 files changed

+47
-0
lines changed

2 files changed

+47
-0
lines changed
Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
<template>
2+
<div>
3+
<span>
4+
<slot-component>
5+
<template v-slot:newSyntax>
6+
<child-component prop1="foobar" prop2="fizzbuzz" />
7+
</template>
8+
</slot-component>
9+
</span>
10+
</div>
11+
</template>
12+
13+
<script>
14+
import ComponentWithProps from './component-with-props.vue'
15+
import ComponentWithSlots from './component-with-v-slot.vue'
16+
17+
export default {
18+
name: 'component-with-nested-children',
19+
components: {
20+
ChildComponent: ComponentWithProps,
21+
SlotComponent: ComponentWithSlots
22+
}
23+
}
24+
</script>

test/specs/mounting-options/stubs.spec.js

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import ComponentWithChild from '~resources/components/component-with-child.vue'
22
import ComponentWithNestedChildren from '~resources/components/component-with-nested-children.vue'
33
import Component from '~resources/components/component.vue'
44
import ComponentAsAClass from '~resources/components/component-as-a-class.vue'
5+
import ComponentWithNestedChildrenAndAttributes from '~resources/components/component-with-nested-childern-and-attributes.vue'
56
import { createLocalVue, config } from '@vue/test-utils'
67
import { config as serverConfig } from '@vue/server-test-utils'
78
import Vue from 'vue'
@@ -590,4 +591,26 @@ describeWithShallowAndMount('options.stub', mountingMethod => {
590591
expect(result.props().propA).to.equal('A')
591592
delete Vue.options.components['child-component']
592593
})
594+
595+
it.only('replaces component with a component and inherits attributes', () => {
596+
const mounted = sandbox.stub()
597+
const Stub = {
598+
template: '<div id="SlotComponent"><slot name="newSyntax"/></div>',
599+
mounted
600+
}
601+
const wrapper = mountingMethod(ComponentWithNestedChildrenAndAttributes, {
602+
stubs: {
603+
SlotComponent: Stub,
604+
ChildComponent: '<div id="child-component"/>'
605+
}
606+
})
607+
608+
const childStub = wrapper.find('#child-component')
609+
expect(wrapper.vm.$el.innerHTML).to.include('prop1="foobar"')
610+
expect(wrapper.vm.$el.innerHTML).to.include('prop2="fizzbuzz"')
611+
expect(childStub.attributes()).to.eql({
612+
prop1: 'foobar',
613+
prop2: 'fizzbuzz'
614+
})
615+
})
593616
})

0 commit comments

Comments
 (0)