Skip to content

fix: compile extended components #637

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.

Sign up for GitHub

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

Merged
merged 2 commits into from
May 22, 2018
Merged

fix: compile extended components #637

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
db6d4f1
test: improve spec name
eddyerburgh May 21, 2018
0330bb5
test: do not run for Vue < 2.3
eddyerburgh May 21, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions packages/shared/compile-template.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,10 @@
import { compileToFunctions } from 'vue-template-compiler'

export function compileTemplate (component: Component) {
if (component.template) {
Object.assign(component, compileToFunctions(component.template))
}

if (component.components) {
Object.keys(component.components).forEach((c) => {
const cmp = component.components[c]
Expand All @@ -19,8 +23,4 @@ export function compileTemplate (component: Component) {
if (component.extendOptions && !component.options.render) {
compileTemplate(component.options)
}

if (component.template) {
Object.assign(component, compileToFunctions(component.template))
}
}
4 changes: 3 additions & 1 deletion packages/shared/validators.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,9 @@ export function isVueComponent (component: any) {
export function componentNeedsCompiling (component: Component) {
return component &&
!component.render &&
(component.template || component.extends) &&
(component.template ||
component.extends ||
component.extendOptions) &&
!component.functional
}

Expand Down
15 changes: 14 additions & 1 deletion test/specs/mount.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,10 @@ import Component from '~resources/components/component.vue'
import ComponentWithProps from '~resources/components/component-with-props.vue'
import ComponentWithMixin from '~resources/components/component-with-mixin.vue'
import { injectSupported, vueVersion } from '~resources/utils'
import { describeRunIf } from 'conditional-specs'
import {
describeRunIf,
itDoNotRunIf
} from 'conditional-specs'

describeRunIf(process.env.TEST_ENV !== 'node',
'mount', () => {
Expand Down Expand Up @@ -131,6 +134,16 @@ describeRunIf(process.env.TEST_ENV !== 'node',
expect(wrapper.html()).to.equal(`<div>foo</div>`)
})

// Problems accessing options of twice extended components in Vue < 2.3
itDoNotRunIf(vueVersion < 2.3,
'compiles extended components', () => {
const TestComponent = Vue.component('test-component', {
template: '<div></div>'
})
const wrapper = mount(TestComponent)
expect(wrapper.html()).to.equal(`<div></div>`)
})

it('logs if component is extended', () => {
const msg = '[vue-test-utils]: an extended child component ChildComponent has been modified to ensure it has the correct instance properties. This means it is not possible to find the component with a component selector. To find the component, you must stub it manually using the stubs mounting option.'
const ChildComponent = Vue.extend({
Expand Down