Skip to content

Commit

Permalink
issue-1146: Make prettyPrint default; update existing tests
Browse files Browse the repository at this point in the history
  • Loading branch information
addisonssense committed May 13, 2019
1 parent 423690d commit a9eda95
Show file tree
Hide file tree
Showing 6 changed files with 62 additions and 50 deletions.
6 changes: 3 additions & 3 deletions packages/test-utils/src/wrapper.js
Expand Up @@ -223,10 +223,10 @@ export default class Wrapper implements BaseWrapper {
* Returns HTML of element as a string
*/
html(options?: HtmlOptions): string {
if (options && options.prettyPrint) {
return pretty(this.element.outerHTML)
if (options && !options.prettyPrint) {
return this.element.outerHTML
}
return this.element.outerHTML
return pretty(this.element.outerHTML)
}

/**
Expand Down
3 changes: 2 additions & 1 deletion test/specs/mount.spec.js
Expand Up @@ -340,7 +340,8 @@ describeRunIf(process.env.TEST_ENV !== 'node', 'mount', () => {
if (vueVersion > 2.3) {
expect(wrapper.vm.$attrs).to.eql({ height: '50px', extra: 'attr' })
}
expect(wrapper.html()).to.equal(
const htmlOptions = { prettyPrint: false }
expect(wrapper.html(htmlOptions)).to.equal(
`<div height="50px" extra="attr"><p class="prop-1">prop1</p> <p class="prop-2"></p></div>`
)
})
Expand Down
37 changes: 19 additions & 18 deletions test/specs/mounting-options/scopedSlots.spec.js
Expand Up @@ -7,6 +7,7 @@ import Vue from 'vue'
describeWithShallowAndMount('scopedSlots', mountingMethod => {
const sandbox = sinon.createSandbox()
const windowSave = window
const htmlOptions = { prettyPrint: false }

afterEach(() => {
window = windowSave // eslint-disable-line no-native-reassign
Expand All @@ -28,7 +29,7 @@ describeWithShallowAndMount('scopedSlots', mountingMethod => {
}
}
)
expect(wrapper.html()).to.equal('<div><p>bar,123</p></div>')
expect(wrapper.html(htmlOptions)).to.equal('<div><p>bar,123</p></div>')
})

itDoNotRunIf(vueVersion < 2.1, 'handles render functions', () => {
Expand All @@ -47,7 +48,7 @@ describeWithShallowAndMount('scopedSlots', mountingMethod => {
}
}
)
expect(wrapper.html()).to.equal('<div><p>bar</p></div>')
expect(wrapper.html(htmlOptions)).to.equal('<div><p>bar</p></div>')
})

itDoNotRunIf(
Expand Down Expand Up @@ -87,7 +88,7 @@ describeWithShallowAndMount('scopedSlots', mountingMethod => {
}
}
)
expect(notDestructuringWrapper.html()).to.equal('<p>1,foo</p>')
expect(notDestructuringWrapper.html(htmlOptions)).to.equal('<p>1,foo</p>')
}
)

Expand All @@ -112,7 +113,7 @@ describeWithShallowAndMount('scopedSlots', mountingMethod => {
}
}
)
expect(destructuringWrapper.html()).to.equal('<p>1,foo</p>')
expect(destructuringWrapper.html(htmlOptions)).to.equal('<p>1,foo</p>')

const notDestructuringWrapper = mountingMethod(
{
Expand All @@ -130,7 +131,7 @@ describeWithShallowAndMount('scopedSlots', mountingMethod => {
}
}
)
expect(notDestructuringWrapper.html()).to.equal('<p>1,foo</p>')
expect(notDestructuringWrapper.html(htmlOptions)).to.equal('<p>1,foo</p>')
}
)

Expand All @@ -145,38 +146,38 @@ describeWithShallowAndMount('scopedSlots', mountingMethod => {
noProps: '<p slot-scope="baz">baz</p>'
}
})
expect(wrapper.find('#destructuring').html()).to.equal(
expect(wrapper.find('#destructuring').html(htmlOptions)).to.equal(
'<div id="destructuring"><p>0,1</p><p>1,2</p><p>2,3</p></div>'
)
expect(wrapper.find('#slots').html()).to.equal(
expect(wrapper.find('#slots').html(htmlOptions)).to.equal(
'<div id="slots"><span>123</span></div>'
)
expect(wrapper.find('#list').html()).to.equal(
expect(wrapper.find('#list').html(htmlOptions)).to.equal(
'<div id="list"><p>0,a1</p><p>1,a2</p><p>2,a3</p></div>'
)
expect(wrapper.find('#single').html()).to.equal(
expect(wrapper.find('#single').html(htmlOptions)).to.equal(
'<div id="single"><p>abc</p></div>'
)
expect(wrapper.find('#noProps').html()).to.equal(
expect(wrapper.find('#noProps').html(htmlOptions)).to.equal(
'<div id="noProps"><p>baz</p></div>'
)
wrapper.vm.items = [4, 5, 6]
wrapper.vm.foo = [{ text: 'b1' }, { text: 'b2' }, { text: 'b3' }]
wrapper.vm.bar = 'ABC'
await Vue.nextTick()
expect(wrapper.find('#destructuring').html()).to.equal(
expect(wrapper.find('#destructuring').html(htmlOptions)).to.equal(
'<div id="destructuring"><p>0,4</p><p>1,5</p><p>2,6</p></div>'
)
expect(wrapper.find('#slots').html()).to.equal(
expect(wrapper.find('#slots').html(htmlOptions)).to.equal(
'<div id="slots"><span>123</span></div>'
)
expect(wrapper.find('#list').html()).to.equal(
expect(wrapper.find('#list').html(htmlOptions)).to.equal(
'<div id="list"><p>0,b1</p><p>1,b2</p><p>2,b3</p></div>'
)
expect(wrapper.find('#single').html()).to.equal(
expect(wrapper.find('#single').html(htmlOptions)).to.equal(
'<div id="single"><p>ABC</p></div>'
)
expect(wrapper.find('#noProps').html()).to.equal(
expect(wrapper.find('#noProps').html(htmlOptions)).to.equal(
'<div id="noProps"><p>baz</p></div>'
)
})
Expand All @@ -197,7 +198,7 @@ describeWithShallowAndMount('scopedSlots', mountingMethod => {
}
}
)
expect(wrapper.html()).to.equal('<div><p>bar</p></div>')
expect(wrapper.html(htmlOptions)).to.equal('<div><p>bar</p></div>')
})

itDoNotRunIf(vueVersion < 2.5, 'handles no slot-scope', () => {
Expand All @@ -214,7 +215,7 @@ describeWithShallowAndMount('scopedSlots', mountingMethod => {
}
}
)
expect(wrapper.html()).to.equal('<div><p>bar,123</p></div>')
expect(wrapper.html(htmlOptions)).to.equal('<div><p>bar,123</p></div>')
})

itDoNotRunIf(
Expand Down Expand Up @@ -286,7 +287,7 @@ describeWithShallowAndMount('scopedSlots', mountingMethod => {
localVue
})

expect(wrapper.html()).to.contain('span')
expect(wrapper.html(htmlOptions)).to.contain('span')
}
)
})
10 changes: 6 additions & 4 deletions test/specs/mounting-options/slots.spec.js
Expand Up @@ -8,6 +8,8 @@ import { itDoNotRunIf } from 'conditional-specs'
import { mount, createLocalVue } from '~vue/test-utils'

describeWithShallowAndMount('options.slots', mountingMethod => {
const htmlOptions = { prettyPrint: false }

it('mounts component with default slot if passed component in slot object', () => {
const wrapper = mountingMethod(ComponentWithSlots, {
slots: { default: Component }
Expand Down Expand Up @@ -180,8 +182,8 @@ describeWithShallowAndMount('options.slots', mountingMethod => {
footer: '<p>world</p>'
}
})
expect(wrapper.html()).to.contain('<span>hello</span>')
expect(wrapper.html()).to.contain('<p>world</p>')
expect(wrapper.html(htmlOptions)).to.contain('<span>hello</span>')
expect(wrapper.html(htmlOptions)).to.contain('<p>world</p>')
})

it('mounts component with default and named text slot', () => {
Expand Down Expand Up @@ -496,7 +498,7 @@ describeWithShallowAndMount('options.slots', mountingMethod => {
c => c.$options.name === childComponentName
)
).to.equal(true)
expect(ParentComponent.html()).to.equal(
expect(ParentComponent.html(htmlOptions)).to.equal(
'<div><div><span baz="qux">FOO,quux</span></div><div><span baz="qux">FOO,quux</span></div></div>'
)

Expand Down Expand Up @@ -529,6 +531,6 @@ describeWithShallowAndMount('options.slots', mountingMethod => {
c => c.$options.name === childComponentName
)
).to.equal(true)
expect(ParentComponent.html()).to.equal('<div><p>1234</p></div>')
expect(ParentComponent.html(htmlOptions)).to.equal('<div><p>1234</p></div>')
})
})
36 changes: 22 additions & 14 deletions test/specs/shallow-mount.spec.js
Expand Up @@ -13,6 +13,8 @@ import { describeRunIf, itDoNotRunIf } from 'conditional-specs'

describeRunIf(process.env.TEST_ENV !== 'node', 'shallowMount', () => {
const sandbox = sinon.createSandbox()
const htmlOptions = { prettyPrint: false }

beforeEach(() => {
sandbox.stub(console, 'info').callThrough()
sandbox.stub(console, 'error').callThrough()
Expand Down Expand Up @@ -69,7 +71,7 @@ describeRunIf(process.env.TEST_ENV !== 'node', 'shallowMount', () => {
const wrapper = shallowMount(TestComponent, {
localVue
})
expect(wrapper.html()).to.equal('<child-stub>Hello</child-stub>')
expect(wrapper.html(htmlOptions)).to.equal('<child-stub>Hello</child-stub>')
})

it('renders named slots', () => {
Expand All @@ -88,7 +90,7 @@ describeRunIf(process.env.TEST_ENV !== 'node', 'shallowMount', () => {
const wrapper = shallowMount(TestComponent, {
localVue
})
expect(wrapper.html()).to.equal(
expect(wrapper.html(htmlOptions)).to.equal(
'<child-stub><p>Hello</p> <p>World</p></child-stub>'
)
})
Expand All @@ -99,7 +101,7 @@ describeRunIf(process.env.TEST_ENV !== 'node', 'shallowMount', () => {
components: { Child: {} }
}
const wrapper = shallowMount(TestComponent)
expect(wrapper.html()).to.equal('<child-stub></child-stub>')
expect(wrapper.html(htmlOptions)).to.equal('<child-stub></child-stub>')
})

it('renders children for functional components', () => {
Expand All @@ -114,7 +116,7 @@ describeRunIf(process.env.TEST_ENV !== 'node', 'shallowMount', () => {
const wrapper = shallowMount(TestComponent, {
localVue
})
expect(wrapper.html()).to.equal('<child-stub>Hello</child-stub>')
expect(wrapper.html(htmlOptions)).to.equal('<child-stub>Hello</child-stub>')
})

it('stubs globally registered components', () => {
Expand Down Expand Up @@ -170,7 +172,9 @@ describeRunIf(process.env.TEST_ENV !== 'node', 'shallowMount', () => {
}
}
const wrapper = shallowMount(TestComponent)
expect(wrapper.html()).to.contain('<child-stub prop="a" attr="hello"')
expect(wrapper.html(htmlOptions)).to.contain(
'<child-stub prop="a" attr="hello"'
)
}
)

Expand All @@ -188,7 +192,7 @@ describeRunIf(process.env.TEST_ENV !== 'node', 'shallowMount', () => {
}
}
const wrapper = shallowMount(TestComponent)
expect(wrapper.html()).to.contain('<child-stub class="b a"')
expect(wrapper.html(htmlOptions)).to.contain('<child-stub class="b a"')
}
)

Expand All @@ -206,7 +210,9 @@ describeRunIf(process.env.TEST_ENV !== 'node', 'shallowMount', () => {
}
}
const wrapper = shallowMount(TestComponent)
expect(wrapper.html()).to.contain('<child-stub prop="a" attr="hello"')
expect(wrapper.html(htmlOptions)).to.contain(
'<child-stub prop="a" attr="hello"'
)
})

it('renders classes for functional components', () => {
Expand All @@ -223,7 +229,7 @@ describeRunIf(process.env.TEST_ENV !== 'node', 'shallowMount', () => {
components
}
const wrapper = shallowMount(TestComponent)
expect(wrapper.html()).to.contain('<child-stub class="b a"')
expect(wrapper.html(htmlOptions)).to.contain('<child-stub class="b a"')
const TestComponent2 = {
template: `<child :class="classA"/>`,
data: () => ({
Expand All @@ -232,7 +238,7 @@ describeRunIf(process.env.TEST_ENV !== 'node', 'shallowMount', () => {
components
}
const wrapper2 = shallowMount(TestComponent2)
expect(wrapper2.html()).to.contain('<child-stub class="a"')
expect(wrapper2.html(htmlOptions)).to.contain('<child-stub class="a"')
const TestComponent3 = {
template: `<child class="b" />`,
data: () => ({
Expand All @@ -241,7 +247,7 @@ describeRunIf(process.env.TEST_ENV !== 'node', 'shallowMount', () => {
components
}
const wrapper3 = shallowMount(TestComponent3)
expect(wrapper3.html()).to.contain('<child-stub class="b"')
expect(wrapper3.html(htmlOptions)).to.contain('<child-stub class="b"')
})

itDoNotRunIf(vueVersion < 2.1, 'handles recursive components', () => {
Expand All @@ -254,7 +260,7 @@ describeRunIf(process.env.TEST_ENV !== 'node', 'shallowMount', () => {
name: 'test-component'
}
const wrapper = shallowMount(TestComponent)
expect(wrapper.html()).to.contain('<test-component-stub>')
expect(wrapper.html(htmlOptions)).to.contain('<test-component-stub>')
expect(console.error).not.calledWith('[Vue warn]')
})

Expand Down Expand Up @@ -421,7 +427,9 @@ describeRunIf(process.env.TEST_ENV !== 'node', 'shallowMount', () => {
}
const wrapper = shallowMount(TestComponent)

expect(wrapper.html()).to.equal('<custom-element></custom-element>')
expect(wrapper.html(htmlOptions)).to.equal(
'<custom-element></custom-element>'
)
})

it('stubs lazily registered components', () => {
Expand Down Expand Up @@ -468,7 +476,7 @@ describeRunIf(process.env.TEST_ENV !== 'node', 'shallowMount', () => {

localVue.use(myPlugin)
const wrapper = shallowMount(TestComponent, { localVue })
expect(wrapper.html()).to.contain('registered-component-stub')
expect(wrapper.html(htmlOptions)).to.contain('registered-component-stub')
})

it('throws an error when the component fails to mount', () => {
Expand Down Expand Up @@ -516,7 +524,7 @@ describeRunIf(process.env.TEST_ENV !== 'node', 'shallowMount', () => {
}
}
const wrapper = shallowMount(TestComponent)
expect(wrapper.html()).to.equal(
expect(wrapper.html(htmlOptions)).to.equal(
'<div>' +
'<childcomponent-stub></childcomponent-stub> ' +
'<anonymous-stub></anonymous-stub> ' +
Expand Down
20 changes: 10 additions & 10 deletions test/specs/wrapper/html.spec.js
Expand Up @@ -20,7 +20,7 @@ describeWithShallowAndMount('html', mountingMethod => {
}
}
})
const expectedHtml = '<div>1<div class="tester">test</div></div>'
const expectedHtml = '<div>1<div class="tester">test</div>\n' + '</div>'
expect(wrapper.html()).to.equal(expectedHtml)
})

Expand All @@ -33,14 +33,6 @@ describeWithShallowAndMount('html', mountingMethod => {
})

it('returns a Wrappers HTML as a string', () => {
const expectedHtml =
'<input id="input-submit" type="submit" class="input-submit">'
const compiled = compileToFunctions(expectedHtml)
const wrapper = mountingMethod(compiled)
expect(wrapper.html()).to.equal(expectedHtml)
})

it('returns a Wrappers HTML as a pretty printed string', () => {
const expectedHtml =
'<body>\n' +
' <div>\n' +
Expand All @@ -53,7 +45,15 @@ describeWithShallowAndMount('html', mountingMethod => {

const compiled = compileToFunctions(expectedHtml)
const wrapper = mountingMethod(compiled)
const options = { prettyPrint: true }
expect(wrapper.html()).to.equal(expectedHtml)
})

it('returns a Wrappers HTML not as a pretty printed string', () => {
const expectedHtml = '<body><div><ul><li></li><li></li></ul></div></body>'

const compiled = compileToFunctions(expectedHtml)
const wrapper = mountingMethod(compiled)
const options = { prettyPrint: false }
expect(wrapper.html(options)).to.equal(expectedHtml)
})
})

0 comments on commit a9eda95

Please sign in to comment.