Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(stubs): Do not render function body in stub #1819

Merged
merged 1 commit into from Oct 16, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
15 changes: 8 additions & 7 deletions src/vnodeTransformers/stubComponentsTransformer.ts
Expand Up @@ -63,13 +63,16 @@ const shouldNotStub = (type: ConcreteComponent) => doNotStubComponents.has(type)
export const addToDoNotStubComponents = (type: ConcreteComponent) =>
doNotStubComponents.add(type)

const stringifySymbols = (props: ComponentPropsOptions) => {
const normalizeStubProps = (props: ComponentPropsOptions) => {
// props are always normalized to object syntax
const $props = props as unknown as ComponentObjectPropsOptions
return Object.keys($props).reduce((acc, key) => {
if (typeof $props[key] === 'symbol') {
return { ...acc, [key]: $props[key]?.toString() }
}
if (typeof $props[key] === 'function') {
return { ...acc, [key]: '[Function]' }
}
return { ...acc, [key]: $props[key] }
}, {})
}
Expand Down Expand Up @@ -100,13 +103,11 @@ export const createStub = ({
// causes an error.
// Only a problem when shallow mounting. For this reason we iterate of the
// props that will be passed and stringify any that are symbols.
const propsWithoutSymbols = stringifySymbols(props)
// Also having function text as attribute is useless and annoying so
// we replace it with "[Function]""
const stubProps = normalizeStubProps(props)

return h(
tag,
propsWithoutSymbols,
renderStubDefaultSlot ? slots : undefined
)
return h(tag, stubProps, renderStubDefaultSlot ? slots : undefined)
}
}
})
Expand Down
16 changes: 16 additions & 0 deletions tests/props.spec.ts
Expand Up @@ -274,6 +274,22 @@ describe('props', () => {
expect(wrapper.text()).toEqual('hello')
})

it('stub function props when shallow mounting', () => {
const Comp = defineComponent({
name: 'Comp',
template: `<div>Test</div>`,
props: ['fn']
})

const wrapper = shallowMount({
render() {
return h(Comp, { fn: () => {} })
}
})

expect(wrapper.html()).toBe('<comp-stub fn="[Function]"></comp-stub>')
})

describe('edge case with symbol props and stubs', () => {
it('works with Symbol as default', () => {
const Comp = defineComponent({
Expand Down