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

feat: allow the rejected slot to be non-scoped #17

Merged
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.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
57 changes: 19 additions & 38 deletions src/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -41,51 +41,16 @@ export const Promised = {
}

if (this.error) {
assert(
this.$scopedSlots.rejected,
'No slot "rejected" provided. Cannot display the error'
)
const node = this.$scopedSlots.rejected(this.error)
assert(
(Array.isArray(node) && node.length) || node,
'Provided slot "rejected" is empty. Cannot display the error'
)
return Array.isArray(node) ? convertVNodeArray(h, this.tag, node) : node
return getSlotVNode(this, h, 'rejected', this.error)
}

if (this.resolved) {
if (this.$scopedSlots.default) {
const node = this.$scopedSlots.default(this.data)
assert(
(Array.isArray(node) && node.length) || node,
'Provided default scoped-slot is empty. Cannot display the data'
)
return Array.isArray(node) ? convertVNodeArray(h, this.tag, node) : node
}
// NOTE: for Vue < 2.6.0
const defaultSlot = this.$slots.default
assert(defaultSlot, 'No default slot provided. Cannot display the data')
/* istanbul ignore next */
assert(
defaultSlot.length,
'Provided default slot is empty. Cannot display the data'
)
/* istanbul ignore next */
return convertVNodeArray(h, this.tag, defaultSlot)
return getSlotVNode(this, h, 'default', this.data)
}

if (!this.isDelayElapsed) return h()

const pendingSlot = this.$slots.pending
assert(
pendingSlot,
'No "pending" slot provided. Cannot display pending state'
)
assert(
pendingSlot.length,
'Provided "pending" slot is empty. Cannot display pending state'
)
return convertVNodeArray(h, this.tag, pendingSlot)
return getSlotVNode(this, h, 'pending', this.data)
},

watch: {
Expand Down Expand Up @@ -136,3 +101,19 @@ function convertVNodeArray (h, wrapperTag, nodes) {
if (nodes.length > 1 || !nodes[0].tag) return h(wrapperTag, {}, nodes)
return nodes[0]
}

function getSlotVNode (instance, h, slotName, vNodeData) {
if (instance.$scopedSlots && instance.$scopedSlots[slotName]) {
const node = instance.$scopedSlots[slotName](vNodeData)
assert(
(Array.isArray(node) && node.length) || node,
`Provided "${slotName}" scoped-slot is empty. Cannot display the data`
)
return Array.isArray(node) ? convertVNodeArray(h, instance.tag, node) : node
}

const slot = instance.$slots && instance.$slots[slotName]
assert(slot, `No slot "${slotName}" provided. Cannot display the data`)
assert(slot.length, `Provided "${slotName}" slot is empty. Cannot display the data`)
return convertVNodeArray(h, instance.tag, slot)
}
18 changes: 16 additions & 2 deletions tests/index.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -63,6 +63,20 @@ describe('Promised', () => {
expect(wrapper.text()).toBe('finished')
})

it('works with a non error scoped-slot', async () => {
[promise, resolve, reject] = fakePromise()
wrapper = mount(Promised, {
propsData: { promise, pendingDelay: 0 },
slots: {
...slots,
rejected: `<p>oh no</p>`,
},
})
reject('whatever')
await tick()
expect(wrapper.text()).toBe('oh no')
})

it('displays an error if rejected', async () => {
reject(new Error('hello'))
await tick()
Expand Down Expand Up @@ -199,7 +213,7 @@ describe('Promised', () => {
resolve()
await tick()
expect(errorSpy.mock.calls[0][0].toString()).toMatch(
/No default slot provided/
/No slot "default" provided/
)
})

Expand All @@ -208,7 +222,7 @@ describe('Promised', () => {
wrapper = mount(Promised, {
propsData: { promise, pendingDelay: 0 },
})
}).toThrowError(/No "pending" slot provided/)
}).toThrowError(/No slot "pending" provided/)
})
})
})
Expand Down