Skip to content
This repository has been archived by the owner on Jul 8, 2023. It is now read-only.

debounce-handler: invoke actual function from component props #22

Merged
merged 1 commit into from Jul 31, 2018
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
12 changes: 8 additions & 4 deletions packages/debounce-handler/src/index.js
Expand Up @@ -7,21 +7,25 @@ const debounceHandler = (handlerName, delay, leadingCall) => (Target) => {
constructor (props, context) {
super(props, context)

const debounced = debounce(props[handlerName], delay, leadingCall)
this.debouncedPropInvoke = debounce(
(...args) => this.props[handlerName](...args),
delay,
leadingCall
)

this[handlerName] = (e, ...rest) => {
this.handler = (e, ...rest) => {
if (e && typeof e.persist === 'function') {
e.persist()
}

return debounced(e, ...rest)
return this.debouncedPropInvoke(e, ...rest)
}
}

render () {
return createElement(Target, {
...this.props,
[handlerName]: this[handlerName]
[handlerName]: this.handler
})
}
}
Expand Down
70 changes: 24 additions & 46 deletions packages/debounce-handler/test/__snapshots__/index.js.snap
Expand Up @@ -19,19 +19,19 @@ exports[`debounceHandler display name should wrap display name in non-production
exports[`debounceHandler should call \`e.persist()\` if it has been passed 1`] = `
Array [
Array [
[MockFunction] {
"calls": Array [
Array [],
],
"results": Array [
Object {
"isThrow": false,
"value": undefined,
},
],
Object {
"persist": [MockFunction] {
"calls": Array [
Array [],
],
"results": Array [
Object {
"isThrow": false,
"value": undefined,
},
],
},
},
undefined,
undefined,
],
]
`;
Expand All @@ -42,20 +42,20 @@ Array [
]
`;

exports[`debounceHandler should call actual handler during lifecycle 1`] = `Array []`;

exports[`debounceHandler should call actual handler during lifecycle 2`] = `
Array [
Array [
undefined,
],
]
`;

exports[`debounceHandler should pass \`delay\` option to \`just-debounce-it\` 1`] = `
Array [
Array [
[MockFunction] {
"calls": Array [
Array [],
],
"results": Array [
Object {
"isThrow": false,
"value": undefined,
},
],
},
[Function],
75,
undefined,
],
Expand All @@ -65,17 +65,7 @@ Array [
exports[`debounceHandler should pass \`leadingCall\` option to \`just-debounce-it\` 1`] = `
Array [
Array [
[MockFunction] {
"calls": Array [
Array [],
],
"results": Array [
Object {
"isThrow": false,
"value": undefined,
},
],
},
[Function],
75,
true,
],
Expand All @@ -85,18 +75,6 @@ Array [
exports[`debounceHandler should pass handler arguments through 1`] = `
Array [
Array [
[MockFunction] {
"calls": Array [
Array [],
],
"results": Array [
Object {
"isThrow": false,
"value": undefined,
},
],
},
undefined,
undefined,
],
]
Expand Down
26 changes: 19 additions & 7 deletions packages/debounce-handler/test/index.js
Expand Up @@ -8,7 +8,7 @@ describe('debounceHandler', () => {
let debounceHandler = null

beforeEach(() => {
mockJustDebounce = jest.fn(() => () => {})
mockJustDebounce = jest.fn(cb => cb)

jest.mock('just-debounce-it', () => mockJustDebounce)
jest.resetModules()
Expand All @@ -29,9 +29,24 @@ describe('debounceHandler', () => {
const testHandler = wrapper.find(Target).prop('testHandler')

testHandler()
mockTestHandler()

expect(mockJustDebounce.mock.calls).toMatchSnapshot()
expect(mockTestHandler.mock.calls).toMatchSnapshot()
})

it('should call actual handler during lifecycle', () => {
const EnhancedTarget = debounceHandler('testHandler')(Target)
const mockTestHandlerInitial = jest.fn()
const mockTestHandlerUpdated = jest.fn()
const wrapper = mount(
<EnhancedTarget testHandler={mockTestHandlerInitial} />
)
wrapper.setProps({testHandler: mockTestHandlerUpdated})
const testHandler = wrapper.find(Target).prop('testHandler')

testHandler()

expect(mockTestHandlerInitial.mock.calls).toMatchSnapshot()
expect(mockTestHandlerUpdated.mock.calls).toMatchSnapshot()
})

it('should call `e.persist()` if it has been passed', () => {
Expand All @@ -44,9 +59,8 @@ describe('debounceHandler', () => {
const testHandler = wrapper.find(Target).prop('testHandler')

testHandler({ persist: mockPersist })
mockTestHandler()

expect(mockJustDebounce.mock.calls).toMatchSnapshot()
expect(mockTestHandler.mock.calls).toMatchSnapshot()
expect(mockPersist.mock.calls).toMatchSnapshot()
})

Expand All @@ -59,7 +73,6 @@ describe('debounceHandler', () => {
const testHandler = wrapper.find(Target).prop('testHandler')

testHandler()
mockTestHandler()

expect(mockJustDebounce.mock.calls).toMatchSnapshot()
})
Expand All @@ -73,7 +86,6 @@ describe('debounceHandler', () => {
const testHandler = wrapper.find(Target).prop('testHandler')

testHandler()
mockTestHandler()

expect(mockJustDebounce.mock.calls).toMatchSnapshot()
})
Expand Down