diff --git a/packages/test-utils/src/wrapper-array.js b/packages/test-utils/src/wrapper-array.js
index 6a15bcb6d..c271b6d9b 100644
--- a/packages/test-utils/src/wrapper-array.js
+++ b/packages/test-utils/src/wrapper-array.js
@@ -101,6 +101,19 @@ export default class WrapperArray implements BaseWrapper {
)
}
+ /**
+ * Prety print element HTML content
+ */
+ debug(): void {
+ this.throwErrorIfWrappersIsEmpty('debug')
+
+ console.log(`Wrapper-Array (Length: ${this.wrappers.length}):\n`)
+ this.wrappers.forEach((wrapper, idx) => {
+ console.log(`(At ${idx})`)
+ wrapper.debug()
+ })
+ }
+
html(): void {
this.throwErrorIfWrappersIsEmpty('html')
diff --git a/packages/test-utils/src/wrapper.js b/packages/test-utils/src/wrapper.js
index ea31cf192..1d33f9dd8 100644
--- a/packages/test-utils/src/wrapper.js
+++ b/packages/test-utils/src/wrapper.js
@@ -234,6 +234,18 @@ export default class Wrapper implements BaseWrapper {
return wrapperArray
}
+ /**
+ * Pretty print HTML of element with useful
+ * information for debugging
+ */
+ debug(): void {
+ const pretyHtml = pretty(this.element.outerHTML)
+ const title = 'Wrapper'
+
+ console.log(`${title}:`)
+ console.log(`${pretyHtml}\n`)
+ }
+
/**
* Returns HTML of element as a string
*/
diff --git a/test/specs/vue-wrapper.spec.js b/test/specs/vue-wrapper.spec.js
index 53b585c37..b79bbabd2 100644
--- a/test/specs/vue-wrapper.spec.js
+++ b/test/specs/vue-wrapper.spec.js
@@ -13,4 +13,28 @@ describeWithShallowAndMount('VueWrapper', mountingMethod => {
.with.property('message', message)
})
})
+
+ describe('debug function', () => {
+ const sandbox = sinon.createSandbox()
+
+ beforeEach(() => {
+ sandbox.spy(console, 'log')
+ })
+
+ it('writes to the console formated html content of the vue-wrapper', () => {
+ const basicComponent = { template: '
' }
+ const wrapper = mountingMethod(basicComponent)
+
+ wrapper.debug()
+
+ expect(console.log).to.have.been.calledWith('Wrapper:')
+ expect(console.log).to.have.been.calledWith(
+ '\n' + '
Debug me please
\n' + '
\n'
+ )
+ })
+
+ afterEach(() => {
+ sandbox.restore()
+ })
+ })
})
diff --git a/test/specs/wrapper-array.spec.js b/test/specs/wrapper-array.spec.js
index 38bf4c03f..2154884ba 100644
--- a/test/specs/wrapper-array.spec.js
+++ b/test/specs/wrapper-array.spec.js
@@ -268,4 +268,57 @@ describeWithShallowAndMount('WrapperArray', mountingMethod => {
wrapperArray.destroy()
expect(destroy.calledTwice).to.equal(true)
})
+
+ describe('debug function', () => {
+ const sandbox = sinon.createSandbox()
+
+ beforeEach(() => {
+ sandbox.spy(console, 'log')
+ })
+
+ it('calls debug on each wrapper with aditional information', () => {
+ function getNestedElement(text, level = 1) {
+ const nestElement = element => {
+ const div = document.createElement('div')
+ div.appendChild(element)
+ return div
+ }
+ let element = document.createElement('p')
+ element.textContent = text
+
+ for (let i = 0; i < level; i++) {
+ element = nestElement(element)
+ }
+ return element
+ }
+ const wrapperArray = getWrapperArray([
+ new Wrapper(getNestedElement('One level', 1)),
+ new Wrapper(getNestedElement('Two levels', 2))
+ ])
+
+ wrapperArray.debug()
+
+ expect(console.log).to.have.been.calledWith(
+ 'Wrapper-Array (Length: 2):\n'
+ )
+ expect(console.log).to.have.been.calledWith('(At 0)')
+ expect(console.log).to.have.been.calledWith('Wrapper:')
+ expect(console.log).to.have.been.calledWith(
+ '\n'
+ )
+ expect(console.log).to.have.been.calledWith('(At 1)')
+ expect(console.log).to.have.been.calledWith('Wrapper:')
+ expect(console.log).to.have.been.calledWith(
+ '\n' +
+ '
\n' +
+ '
Two levels
\n' +
+ '
\n' +
+ '
\n'
+ )
+ })
+
+ afterEach(() => {
+ sandbox.restore()
+ })
+ })
})
diff --git a/test/specs/wrapper.spec.js b/test/specs/wrapper.spec.js
index aaa013719..27373c131 100644
--- a/test/specs/wrapper.spec.js
+++ b/test/specs/wrapper.spec.js
@@ -53,4 +53,28 @@ describeWithShallowAndMount('Wrapper', mountingMethod => {
expect(() => enableAutoDestroy(noop)).to.throw()
})
})
+
+ describe('debug function', () => {
+ const sandbox = sinon.createSandbox()
+
+ beforeEach(() => {
+ sandbox.spy(console, 'log')
+ })
+
+ it('writes to the console formated html content of the wrapper', () => {
+ const basicComponent = { template: '' }
+ const wrapper = mountingMethod(basicComponent)
+
+ wrapper.debug()
+
+ expect(console.log).to.have.been.calledWith('Wrapper:')
+ expect(console.log).to.have.been.calledWith(
+ '\n' + '
Debug me please
\n' + '
\n'
+ )
+ })
+
+ afterEach(() => {
+ sandbox.restore()
+ })
+ })
})