Skip to content

Commit e7ed81f

Browse files
author
Alexandre Stanislawski
committed
feat(lifecycle): makes init API consistent with the rest
It now provides an option object instead of simple parameters.
1 parent fc3a8b7 commit e7ed81f

File tree

12 files changed

+58
-46
lines changed

12 files changed

+58
-46
lines changed

‎docs/documentation.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -982,7 +982,7 @@ var mySingletonWidget = {
982982
};
983983
},
984984

985-
init: function(state, helper, templatesConfig) {
985+
init: function(options) {
986986
},
987987

988988
render: function(options) {

‎lib/InstantSearch.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -126,7 +126,8 @@ Usage: instantsearch({
126126
_init(state, helper) {
127127
forEach(this.widgets, function(widget) {
128128
if (widget.init) {
129-
widget.init(state, helper, this.templatesConfig);
129+
const templatesConfig = this.templatesConfig;
130+
widget.init({state, helper, templatesConfig});
130131
}
131132
}, this);
132133
}

‎lib/__tests__/InstantSearch-test.js

+6-1
Original file line numberDiff line numberDiff line change
@@ -125,7 +125,12 @@ describe('InstantSearch lifecycle', () => {
125125
expect(widget.init.calledOnce).toBe(true, 'widget.init called once');
126126
expect(widget.init.calledAfter(widget.getConfiguration))
127127
.toBe(true, 'widget.init() was called after widget.getConfiguration()');
128-
expect(widget.init.args[0]).toEqual([helper.state, helper, search.templatesConfig]);
128+
expect(widget.init.args[0][0]).
129+
toEqual({
130+
state: helper.state,
131+
helper,
132+
templatesConfig: search.templatesConfig
133+
});
129134
});
130135

131136
it('does not call widget.render', () => {

‎lib/url-sync.js

+1-2
Original file line numberDiff line numberDiff line change
@@ -90,7 +90,6 @@ let modernUrlUtils = {
9090
*/
9191
class URLSync {
9292
constructor(urlUtils, options) {
93-
this.__initLast = true;
9493
this.urlUtils = urlUtils;
9594
this.originalConfig = null;
9695
this.timer = timerMaker(Date.now());
@@ -118,7 +117,7 @@ class URLSync {
118117
helper.setState(fullState).search();
119118
}
120119

121-
init(state, helper) {
120+
init({helper}) {
122121
this.urlUtils.onpopstate(this.onPopState.bind(this, helper));
123122
}
124123

‎widgets/hits-per-page-selector/__tests__/hits-per-page-selector-test.js

+7-5
Original file line numberDiff line numberDiff line change
@@ -106,22 +106,24 @@ describe('hitsPerPageSelector()', () => {
106106
it('should throw if there is no name attribute in a passed object', () => {
107107
options.length = 0;
108108
options.push({label: 'Label without a value'});
109-
widget.init(helper.state, helper);
109+
widget.init({state: helper.state, helper});
110110
expect(consoleLog.calledOnce).toBe(true, 'console.log called once');
111-
expect(consoleLog.firstCall.args[0]).toMatch(/No option in `options` with `value: hitsPerPage` \(hitsPerPage: 20\)/);
111+
expect(consoleLog.firstCall.args[0]).
112+
toMatch(/No option in `options` with `value: hitsPerPage` \(hitsPerPage: 20\)/);
112113
});
113114

114115
it('must include the current hitsPerPage at initialization time', () => {
115116
helper.state.hitsPerPage = -1;
116-
widget.init(helper.state, helper);
117+
widget.init({state: helper.state, helper});
117118
expect(consoleLog.calledOnce).toBe(true, 'console.log called once');
118-
expect(consoleLog.firstCall.args[0]).toMatch(/No option in `options` with `value: hitsPerPage` \(hitsPerPage: -1\)/);
119+
expect(consoleLog.firstCall.args[0]).
120+
toMatch(/No option in `options` with `value: hitsPerPage` \(hitsPerPage: -1\)/);
119121
});
120122

121123
it('should not throw an error if state does not have a `hitsPerPage`', () => {
122124
delete helper.state.hitsPerPage;
123125
expect(() => {
124-
widget.init(helper.state, helper);
126+
widget.init({state: helper.state, helper});
125127
}).toNotThrow(/No option in `options`/);
126128
});
127129

‎widgets/hits-per-page-selector/hits-per-page-selector.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,7 @@ function hitsPerPageSelector({
4545
}
4646

4747
return {
48-
init: function(state) {
48+
init: function({state}) {
4949
let isCurrentInOptions = any(options, function(option) {
5050
return +state.hitsPerPage === +option.value;
5151
});

‎widgets/index-selector/__tests__/index-selector-test.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -103,14 +103,14 @@ describe('indexSelector()', () => {
103103
indices.length = 0;
104104
indices.push({label: 'Label without a name'});
105105
expect(() => {
106-
widget.init(null, helper);
106+
widget.init({helper});
107107
}).toThrow(/Index index-a not present/);
108108
});
109109

110110
it('must include the current index at initialization time', () => {
111111
helper.getIndex = sinon.stub().returns('non-existing-index');
112112
expect(() => {
113-
widget.init(null, helper);
113+
widget.init({helper});
114114
}).toThrow(/Index non-existing-index not present/);
115115
});
116116

‎widgets/index-selector/index-selector.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,7 @@ function indexSelector({
4949
});
5050

5151
return {
52-
init: function(state, helper) {
52+
init: function({helper}) {
5353
let currentIndex = helper.getIndex();
5454
let isIndexInList = findIndex(indices, {name: currentIndex}) !== -1;
5555
if (!isIndexInList) {

‎widgets/search-box/__tests__/search-box-test.js

+19-19
Original file line numberDiff line numberDiff line change
@@ -20,14 +20,14 @@ describe('search-box()', () => {
2020

2121
let ReactDOM;
2222
let container;
23-
let initialState;
23+
let state;
2424
let helper;
2525
let widget;
2626

2727
beforeEach(() => {
2828
ReactDOM = {render: sinon.spy()};
2929
searchBox.__Rewire__('ReactDOM', ReactDOM);
30-
initialState = {
30+
state = {
3131
query: ''
3232
};
3333
helper = {
@@ -59,13 +59,13 @@ describe('search-box()', () => {
5959
});
6060

6161
it('adds an input inside the div', () => {
62-
widget.init(initialState, helper);
62+
widget.init({state, helper});
6363
let inputs = container.getElementsByTagName('input');
6464
expect(inputs.length).toEqual(1);
6565
});
6666

6767
it('sets default HTML attribute to the input', () => {
68-
widget.init(initialState, helper);
68+
widget.init({state, helper});
6969
let input = container.getElementsByTagName('input')[0];
7070
expect(input.getAttribute('autocapitalize')).toEqual('off');
7171
expect(input.getAttribute('autocomplete')).toEqual('off');
@@ -82,7 +82,7 @@ describe('search-box()', () => {
8282
it('reuse the existing input', () => {
8383
container = createHTMLNodeFromString('<input />');
8484
widget = searchBox({container});
85-
widget.init(initialState, helper);
85+
widget.init({state, helper});
8686
expect(container.tagName).toEqual('INPUT');
8787
expect(container.getAttribute('autocapitalize')).toEqual('off');
8888
expect(container.getAttribute('autocomplete')).toEqual('off');
@@ -97,7 +97,7 @@ describe('search-box()', () => {
9797
it('passes HTML attributes', () => {
9898
container = createHTMLNodeFromString('<input id="foo" class="my-class" placeholder="Search" />');
9999
widget = searchBox({container});
100-
widget.init(initialState, helper);
100+
widget.init({state, helper});
101101
expect(container.getAttribute('id')).toEqual('foo');
102102
expect(container.getAttribute('class')).toEqual('my-class ais-search-box--input');
103103
expect(container.getAttribute('placeholder')).toEqual('Search');
@@ -111,7 +111,7 @@ describe('search-box()', () => {
111111
widget = searchBox({container});
112112

113113
// When
114-
widget.init(initialState, helper);
114+
widget.init({state, helper});
115115

116116
// Then
117117
let wrapper = container.querySelectorAll('div.ais-search-box')[0];
@@ -127,7 +127,7 @@ describe('search-box()', () => {
127127
widget = searchBox({container});
128128

129129
// When
130-
widget.init(initialState, helper);
130+
widget.init({state, helper});
131131

132132
// Then
133133
let wrapper = container.parentNode;
@@ -140,7 +140,7 @@ describe('search-box()', () => {
140140
widget = searchBox({container, wrapInput: false});
141141

142142
// When
143-
widget.init(initialState, helper);
143+
widget.init({state, helper});
144144

145145
// Then
146146
let wrapper = container.querySelectorAll('div.ais-search-box');
@@ -157,13 +157,13 @@ describe('search-box()', () => {
157157

158158
it('do not add the poweredBy if not specified', () => {
159159
widget = searchBox({container});
160-
widget.init(initialState, helper);
160+
widget.init({state, helper});
161161
expect(ReactDOM.render.notCalled).toBe(true);
162162
});
163163

164164
it('add the poweredBy if specified', () => {
165165
widget = searchBox({container, poweredBy: true});
166-
widget.init(initialState, helper);
166+
widget.init({state, helper});
167167
expect(ReactDOM.render.notCalled).toBe(false);
168168
});
169169
});
@@ -180,7 +180,7 @@ describe('search-box()', () => {
180180
// Given
181181
helper.state.query = 'foo';
182182
// When
183-
widget.init(initialState, helper);
183+
widget.init({state, helper});
184184
// Then
185185
expect(input.addEventListener.called).toEqual(true);
186186
expect(input.addEventListener.args[1].length).toEqual(3);
@@ -229,7 +229,7 @@ describe('search-box()', () => {
229229
// Given
230230
helper.state.query = 'foo';
231231
// When
232-
widget.init(initialState, helper);
232+
widget.init({state, helper});
233233
// Then
234234
expect(input.addEventListener.called).toEqual(true);
235235
expect(input.addEventListener.args[0].length).toEqual(2);
@@ -290,7 +290,7 @@ describe('search-box()', () => {
290290
// Given
291291
helper.state.query = '';
292292
// When
293-
widget.init(initialState, helper);
293+
widget.init({state, helper});
294294
// Then
295295
expect(input.focus.called).toEqual(true);
296296
});
@@ -299,7 +299,7 @@ describe('search-box()', () => {
299299
// Given
300300
helper.state.query = 'foo';
301301
// When
302-
widget.init(initialState, helper);
302+
widget.init({state, helper});
303303
// Then
304304
expect(input.focus.called).toEqual(false);
305305
});
@@ -315,7 +315,7 @@ describe('search-box()', () => {
315315
// Given
316316
helper.state.query = '';
317317
// When
318-
widget.init(initialState, helper);
318+
widget.init({state, helper});
319319
// Then
320320
expect(input.focus.called).toEqual(true);
321321
});
@@ -324,7 +324,7 @@ describe('search-box()', () => {
324324
// Given
325325
helper.state.query = 'foo';
326326
// When
327-
widget.init(initialState, helper);
327+
widget.init({state, helper});
328328
// Then
329329
expect(input.focus.called).toEqual(true);
330330
});
@@ -340,7 +340,7 @@ describe('search-box()', () => {
340340
// Given
341341
helper.state.query = '';
342342
// When
343-
widget.init(initialState, helper);
343+
widget.init({state, helper});
344344
// Then
345345
expect(input.focus.called).toEqual(false);
346346
});
@@ -349,7 +349,7 @@ describe('search-box()', () => {
349349
// Given
350350
helper.state.query = 'foo';
351351
// When
352-
widget.init(initialState, helper);
352+
widget.init({state, helper});
353353
// Then
354354
expect(input.focus.called).toEqual(false);
355355
});

‎widgets/search-box/search-box.js

+8-6
Original file line numberDiff line numberDiff line change
@@ -14,13 +14,15 @@ const KEY_SUPPRESS = 8;
1414
* @param {string|DOMElement} options.container CSS Selector or DOMElement to insert the widget
1515
* @param {string} [options.placeholder] Input's placeholder
1616
* @param {Object} [options.cssClasses] CSS classes to add
17-
* @param {string} [options.cssClasses.root] CSS class to add to the wrapping div (if `wrapInput` set to `true`)
17+
* @param {string} [options.cssClasses.root] CSS class to add to the
18+
* wrapping div (if `wrapInput` set to `true`)
1819
* @param {string} [options.cssClasses.input] CSS class to add to the input
1920
* @param {string} [options.cssClasses.poweredBy] CSS class to add to the poweredBy element
2021
* @param {boolean} [poweredBy=false] Show a powered by Algolia link below the input
2122
* @param {boolean} [wrapInput=true] Wrap the input in a `div.ais-search-box`
2223
* @param {boolean|string} [autofocus='auto'] autofocus on the input
23-
* @param {boolean} [searchOnEnterKeyPressOnly=false] If set, trigger the search once `<Enter>` is pressed only
24+
* @param {boolean} [searchOnEnterKeyPressOnly=false] If set, trigger the search
25+
* once `<Enter>` is pressed only
2426
* @return {Object}
2527
*/
2628
const usage = `Usage:
@@ -106,12 +108,12 @@ function searchBox({
106108
poweredByContainer
107109
);
108110
},
109-
init: function(initialState, helper) {
111+
init: function({state, helper}) {
110112
let isInputTargeted = container.tagName === 'INPUT';
111113
let input = this.getInput();
112114

113115
// Add all the needed attributes and listeners to the input
114-
this.addDefaultAttributesToInput(input, initialState.query);
116+
this.addDefaultAttributesToInput(input, state.query);
115117

116118
// Keep keyup to handle searchOnEnterKeyPressOnly
117119
input.addEventListener('keyup', (e) => {
@@ -158,8 +160,8 @@ function searchBox({
158160
}
159161

160162
// Update value when query change outside of the input
161-
helper.on('change', function(state) {
162-
if (input !== document.activeElement && input.value !== state.query) {
163+
helper.on('change', function(newState) {
164+
if (input !== document.activeElement && input.value !== newState.query) {
163165
input.value = state.query;
164166
}
165167
});

‎widgets/toggle/__tests__/toggle-test.js

+3-3
Original file line numberDiff line numberDiff line change
@@ -302,7 +302,7 @@ describe('toggle()', () => {
302302
};
303303

304304
// When
305-
widget.init(state, helper);
305+
widget.init({state, helper});
306306

307307
// Then
308308
expect(helper.addFacetRefinement.calledWith(facetName, 'off')).toBe(true);
@@ -319,7 +319,7 @@ describe('toggle()', () => {
319319
};
320320

321321
// When
322-
widget.init(state, helper);
322+
widget.init({state, helper});
323323

324324
// Then
325325
expect(helper.addFacetRefinement.called).toBe(false);
@@ -333,7 +333,7 @@ describe('toggle()', () => {
333333
};
334334

335335
// When
336-
widget.init(state, helper);
336+
widget.init({state, helper});
337337

338338
// Then
339339
expect(helper.addFacetRefinement.called).toBe(false);

‎widgets/toggle/toggle.js

+7-4
Original file line numberDiff line numberDiff line change
@@ -30,9 +30,12 @@ let defaultTemplates = require('./defaultTemplates');
3030
* @param {string|string[]} [options.cssClasses.list] CSS class to add to the list element
3131
* @param {string|string[]} [options.cssClasses.item] CSS class to add to each item element
3232
* @param {string|string[]} [options.cssClasses.active] CSS class to add to each active element
33-
* @param {string|string[]} [options.cssClasses.label] CSS class to add to each label element (when using the default template)
34-
* @param {string|string[]} [options.cssClasses.checkbox] CSS class to add to each checkbox element (when using the default template)
35-
* @param {string|string[]} [options.cssClasses.count] CSS class to add to each count element (when using the default template)
33+
* @param {string|string[]} [options.cssClasses.label] CSS class to add to each
34+
* label element (when using the default template)
35+
* @param {string|string[]} [options.cssClasses.checkbox] CSS class to add to each
36+
* checkbox element (when using the default template)
37+
* @param {string|string[]} [options.cssClasses.count] CSS class to add to each count
38+
* element (when using the default template)
3639
* @param {Object} [options.templates] Templates to use for the widget
3740
* @param {string|Function} [options.templates.header=''] Header template
3841
* @param {string|Function} [options.templates.item] Item template
@@ -79,7 +82,7 @@ function toggle({
7982
getConfiguration: () => ({
8083
facets: [facetName]
8184
}),
82-
init: (state, helper) => {
85+
init: ({state, helper}) => {
8386
if (userValues.off === undefined) {
8487
return;
8588
}

0 commit comments

Comments
 (0)