From ba4511ee39ec97663cda9a02bf15ed19c39a04ce Mon Sep 17 00:00:00 2001 From: Bogdan Chadkin Date: Sat, 5 May 2018 13:14:16 +0300 Subject: [PATCH] Test onChange callback --- .size-snapshot.json | 18 +++++++++--------- src/components/FocusManager.js | 5 ++++- tests/components/Counter.test.js | 15 ++++++++++++++- tests/components/FocusManager.test.js | 7 ++++++- tests/components/List.test.js | 15 ++++++++++++++- tests/components/Map.test.js | 15 ++++++++++++++- tests/components/Set.test.js | 15 ++++++++++++++- tests/components/State.test.js | 21 +++++++++++++++------ tests/components/Toggle.test.js | 17 ++++++++++++++++- tests/components/Value.test.js | 17 ++++++++++++++++- 10 files changed, 122 insertions(+), 23 deletions(-) diff --git a/.size-snapshot.json b/.size-snapshot.json index 271f6d0b..b69ce264 100644 --- a/.size-snapshot.json +++ b/.size-snapshot.json @@ -1,18 +1,18 @@ { "dist/react-powerplug.umd.js": { - "bundled": 24183, - "minified": 9975, - "gzipped": 2574 + "bundled": 24334, + "minified": 10031, + "gzipped": 2590 }, "dist/react-powerplug.cjs.js": { - "bundled": 21066, - "minified": 10851, - "gzipped": 2438 + "bundled": 21207, + "minified": 10907, + "gzipped": 2453 }, "dist/react-powerplug.esm.js": { - "bundled": 20420, - "minified": 10302, - "gzipped": 2310, + "bundled": 20561, + "minified": 10358, + "gzipped": 2328, "treeshaked": { "rollup": 1489, "webpack": 1939 diff --git a/src/components/FocusManager.js b/src/components/FocusManager.js index 6192fc53..9c06beac 100644 --- a/src/components/FocusManager.js +++ b/src/components/FocusManager.js @@ -3,7 +3,10 @@ import State from './State' import renderProps from '../utils/renderProps' const FocusManager = ({ onChange, ...props }) => ( - + onChange && onChange({ isFocused })} + > {({ state, setState }) => renderProps(props, { isFocused: state.isFocused, diff --git a/tests/components/Counter.test.js b/tests/components/Counter.test.js index 76aa6d7c..e59ddf83 100644 --- a/tests/components/Counter.test.js +++ b/tests/components/Counter.test.js @@ -5,8 +5,8 @@ import { last } from './utils' test('', () => { const renderFn = jest.fn().mockReturnValue(null) - TestRenderer.create() const lastCalled = () => last(renderFn.mock.calls)[0] + TestRenderer.create() expect(renderFn).toHaveBeenCalledTimes(1) expect(lastCalled().count).toBe(0) @@ -23,3 +23,16 @@ test('', () => { lastCalled().decBy(3) expect(lastCalled().count).toBe(2) }) + +test('', () => { + const renderFn = jest.fn().mockReturnValue(null) + const onChangeFn = jest.fn() + const lastCalled = () => last(renderFn.mock.calls)[0] + TestRenderer.create() + + expect(onChangeFn).toHaveBeenCalledTimes(0) + + lastCalled().inc() + expect(onChangeFn).toHaveBeenCalledTimes(1) + expect(onChangeFn).lastCalledWith({ count: 1 }) +}) diff --git a/tests/components/FocusManager.test.js b/tests/components/FocusManager.test.js index 6d3d8a54..3caf863a 100644 --- a/tests/components/FocusManager.test.js +++ b/tests/components/FocusManager.test.js @@ -81,14 +81,16 @@ test('keep focus when click on menu', async () => { test('restore focus after calling blur on inner component', async () => { const page = await bootstrap() const renderFn = jest.fn() + const onChangeFn = jest.fn() await page.exposeFunction('renderFn', renderFn) + await page.exposeFunction('onChangeFn', onChangeFn) await page.evaluate(() => { const React = window.React const FocusManager = window.ReactPowerPlug.FocusManager const App = () => ( - + {({ isFocused, blur, bind }) => { window.renderFn({ isFocused }) const stopPropagation = e => e.stopPropagation() @@ -115,8 +117,11 @@ test('restore focus after calling blur on inner component', async () => { expect(renderFn).lastCalledWith({ isFocused: false }) await page.click('#outer') expect(renderFn).lastCalledWith({ isFocused: true }) + expect(onChangeFn).lastCalledWith({ isFocused: true }) await page.click('#inner') expect(renderFn).lastCalledWith({ isFocused: false }) + expect(onChangeFn).lastCalledWith({ isFocused: false }) await page.click('#outer') expect(renderFn).lastCalledWith({ isFocused: true }) + expect(onChangeFn).lastCalledWith({ isFocused: true }) }) diff --git a/tests/components/List.test.js b/tests/components/List.test.js index ff21971e..a6c702a3 100644 --- a/tests/components/List.test.js +++ b/tests/components/List.test.js @@ -5,8 +5,8 @@ import { last } from './utils' test('', () => { const renderFn = jest.fn().mockReturnValue(null) - TestRenderer.create() const lastCalled = () => last(renderFn.mock.calls)[0] + TestRenderer.create() expect(renderFn).toHaveBeenCalledTimes(1) expect(lastCalled().list).toEqual([1]) @@ -39,3 +39,16 @@ test('', () => { lastCalled().push(1, 2, 3) expect(lastCalled().list).toEqual([1, 2, 3]) }) + +test('', () => { + const renderFn = jest.fn().mockReturnValue(null) + const onChangeFn = jest.fn() + const lastCalled = () => last(renderFn.mock.calls)[0] + TestRenderer.create() + + expect(onChangeFn).toHaveBeenCalledTimes(0) + + lastCalled().set([1]) + expect(onChangeFn).toHaveBeenCalledTimes(1) + expect(onChangeFn).lastCalledWith({ list: [1] }) +}) diff --git a/tests/components/Map.test.js b/tests/components/Map.test.js index b3606185..1874c656 100644 --- a/tests/components/Map.test.js +++ b/tests/components/Map.test.js @@ -5,8 +5,8 @@ import { last } from './utils' test('', () => { const renderFn = jest.fn().mockReturnValue(null) - TestRenderer.create() const lastCalled = () => last(renderFn.mock.calls)[0] + TestRenderer.create() expect(renderFn).toHaveBeenCalledTimes(1) @@ -18,3 +18,16 @@ test('', () => { lastCalled().over('a', d => d + 10) expect(lastCalled().get('a')).toBe(11) }) + +test('', () => { + const renderFn = jest.fn().mockReturnValue(null) + const onChangeFn = jest.fn() + const lastCalled = () => last(renderFn.mock.calls)[0] + TestRenderer.create() + + expect(onChangeFn).toHaveBeenCalledTimes(0) + + lastCalled().set('a', 1) + expect(onChangeFn).toHaveBeenCalledTimes(1) + expect(onChangeFn).lastCalledWith({ a: 1 }) +}) diff --git a/tests/components/Set.test.js b/tests/components/Set.test.js index 8d2a913c..bd0ad2a1 100644 --- a/tests/components/Set.test.js +++ b/tests/components/Set.test.js @@ -5,8 +5,8 @@ import { last } from './utils' test('', () => { const renderFn = jest.fn().mockReturnValue(null) - TestRenderer.create() const lastCalled = () => last(renderFn.mock.calls)[0] + TestRenderer.create() expect(renderFn).toHaveBeenCalledTimes(1) @@ -29,3 +29,16 @@ test('', () => { expect(lastCalled().has(4)).toBe(false) expect(lastCalled().values).toEqual([]) }) + +test('', () => { + const renderFn = jest.fn().mockReturnValue(null) + const onChangeFn = jest.fn() + const lastCalled = () => last(renderFn.mock.calls)[0] + TestRenderer.create() + + expect(onChangeFn).toHaveBeenCalledTimes(0) + + lastCalled().add(1) + expect(onChangeFn).toHaveBeenCalledTimes(1) + expect(onChangeFn).lastCalledWith({ values: [1] }) +}) diff --git a/tests/components/State.test.js b/tests/components/State.test.js index 5ac907ba..183b1e0d 100644 --- a/tests/components/State.test.js +++ b/tests/components/State.test.js @@ -4,13 +4,8 @@ import { State } from '../../src' import { last } from './utils' test('', () => { - const onChangeFn = jest.fn() const renderFn = jest.fn().mockReturnValue(null) - TestRenderer.create( - - {renderFn} - - ) + TestRenderer.create() // Initial values expect(renderFn).lastCalledWith({ @@ -25,5 +20,19 @@ test('', () => { state: { myValue: 2 }, setState: expect.any(Function), }) +}) + +test('', () => { + const onChangeFn = jest.fn() + const renderFn = jest.fn().mockReturnValue(null) + const lastCalled = () => last(renderFn.mock.calls)[0] + TestRenderer.create( + + ) + + expect(onChangeFn).toHaveBeenCalledTimes(0) + + lastCalled().setState({ myValue: 2 }) + expect(onChangeFn).toHaveBeenCalledTimes(1) expect(onChangeFn).toBeCalledWith({ myValue: 2 }) }) diff --git a/tests/components/Toggle.test.js b/tests/components/Toggle.test.js index 20a4f976..a1902437 100644 --- a/tests/components/Toggle.test.js +++ b/tests/components/Toggle.test.js @@ -5,8 +5,8 @@ import { last } from './utils' test('', () => { const renderFn = jest.fn().mockReturnValue(null) - TestRenderer.create() const lastCalled = () => last(renderFn.mock.calls)[0] + TestRenderer.create() expect(renderFn).toHaveBeenCalledTimes(1) expect(lastCalled().on).toBe(false) @@ -20,3 +20,18 @@ test('', () => { lastCalled().set(on => !on) expect(lastCalled().on).toBe(true) }) + +test('', () => { + const renderFn = jest.fn().mockReturnValue(null) + const onChangeFn = jest.fn() + const lastCalled = () => last(renderFn.mock.calls)[0] + TestRenderer.create( + + ) + + expect(onChangeFn).toHaveBeenCalledTimes(0) + + lastCalled().set(true) + expect(onChangeFn).toHaveBeenCalledTimes(1) + expect(onChangeFn).lastCalledWith({ on: true }) +}) diff --git a/tests/components/Value.test.js b/tests/components/Value.test.js index 009eda20..1696073b 100644 --- a/tests/components/Value.test.js +++ b/tests/components/Value.test.js @@ -5,8 +5,8 @@ import { last } from './utils' test('', () => { const renderFn = jest.fn().mockReturnValue(null) - TestRenderer.create() const lastCalled = () => last(renderFn.mock.calls)[0] + TestRenderer.create() expect(renderFn).toHaveBeenCalledTimes(1) @@ -21,3 +21,18 @@ test('', () => { lastCalled().set(0) expect(lastCalled().value).toEqual(0) }) + +test('', () => { + const renderFn = jest.fn().mockReturnValue(null) + const onChangeFn = jest.fn() + const lastCalled = () => last(renderFn.mock.calls)[0] + TestRenderer.create( + + ) + + expect(onChangeFn).toHaveBeenCalledTimes(0) + + lastCalled().set(1) + expect(onChangeFn).toHaveBeenCalledTimes(1) + expect(onChangeFn).lastCalledWith({ value: 1 }) +})