-
Notifications
You must be signed in to change notification settings - Fork 516
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #564 from algolia/numeric-selector
chore(numericSelector): initial import
- Loading branch information
Showing
10 changed files
with
320 additions
and
23 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,14 @@ | ||
| | Param | Description | | ||
| | --- | --- | | ||
| | <span class='attr-required'>`options.container`</span><span class="attr-infos">Type: <code>string</code> | <code>DOMElement</code></span> | CSS Selector or DOMElement to insert the widget | | ||
| | <span class='attr-required'>`options.attributeName`</span><span class="attr-infos">Type: <code>string</code></span> | Name of the numeric attribute to use | | ||
| | <span class='attr-required'>`options.options`</span><span class="attr-infos">Type: <code>Array</code></span> | Array of objects defining the different values and labels | | ||
| | <span class='attr-required'>`options.options[i].value`</span><span class="attr-infos">Type: <code>number</code></span> | The numerical value to refine with | | ||
| | <span class='attr-required'>`options.options[i].label`</span><span class="attr-infos">Type: <code>string</code></span> | Label to display in the option | | ||
| | <span class='attr-optional'>`options.operator`</span><span class="attr-infos">Type: <code>string</code></span> | The operator to use to refine | | ||
| | <span class='attr-optional'>`options.cssClasses`</span><span class="attr-infos">Type: <code>Object</code></span> | CSS classes to be added | | ||
| | <span class='attr-optional'>`options.cssClasses.root`</span><span class="attr-infos">Type: <code>string</code></span> | CSS classes added to the parent `<select>` | | ||
| | <span class='attr-optional'>`options.cssClasses.item`</span><span class="attr-infos">Type: <code>string</code></span> | CSS classes added to each `<option>` | | ||
| | <span class='attr-optional'>`options.autoHideContainer`</span><span class="attr-infos">Default:<code class="attr-default">false</code><br />Type: <code>boolean</code></span> | Hide the container when no results match | | ||
|
|
||
| <p class="attr-legend">* <span>Required</span></p> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
100 changes: 100 additions & 0 deletions
100
widgets/numeric-selector/__tests__/numeric-selector-test.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,100 @@ | ||
| /* eslint-env mocha */ | ||
|
|
||
| import React from 'react'; | ||
| import expect from 'expect'; | ||
| import sinon from 'sinon'; | ||
| import jsdom from 'mocha-jsdom'; | ||
|
|
||
| import expectJSX from 'expect-jsx'; | ||
| expect.extend(expectJSX); | ||
|
|
||
| import numericSelector from '../numeric-selector'; | ||
| import Selector from '../../../components/Selector'; | ||
|
|
||
| describe('numericSelector()', () => { | ||
| jsdom({useEach: true}); | ||
|
|
||
| let ReactDOM; | ||
| let container; | ||
| let options; | ||
| let cssClasses; | ||
| let widget; | ||
| let props; | ||
| let helper; | ||
| let results; | ||
| let autoHideContainer; | ||
|
|
||
| beforeEach(() => { | ||
| autoHideContainer = sinon.stub().returns(Selector); | ||
| ReactDOM = {render: sinon.spy()}; | ||
|
|
||
| numericSelector.__Rewire__('ReactDOM', ReactDOM); | ||
| numericSelector.__Rewire__('autoHideContainerHOC', autoHideContainer); | ||
|
|
||
| container = document.createElement('div'); | ||
| options = [ | ||
| {value: 1, label: 'first'}, | ||
| {value: 2, label: 'second'} | ||
| ]; | ||
| cssClasses = { | ||
| root: 'custom-root', | ||
| item: 'custom-item' | ||
| }; | ||
| widget = numericSelector({container, options, attributeName: 'aNumAttr', cssClasses}); | ||
| helper = { | ||
| addNumericRefinement: sinon.spy(), | ||
| clearRefinements: sinon.spy(), | ||
| getRefinements: sinon.stub().returns([]), | ||
| search: sinon.spy() | ||
| }; | ||
| results = { | ||
| hits: [], | ||
| nbHits: 0 | ||
| }; | ||
| }); | ||
|
|
||
| it('doesn\'t configure anything', () => { | ||
| expect(widget.getConfiguration).toEqual(undefined); | ||
| }); | ||
|
|
||
| it('calls twice ReactDOM.render(<Selector props />, container)', () => { | ||
| widget.render({helper, results, state: helper.state}); | ||
| widget.render({helper, results, state: helper.state}); | ||
| props = { | ||
| cssClasses: { | ||
| root: 'ais-numeric-selector custom-root', | ||
| item: 'ais-numeric-selector--item custom-item' | ||
| }, | ||
| currentValue: undefined, | ||
| shouldAutoHideContainer: true, | ||
| options: [ | ||
| {value: 1, label: 'first'}, | ||
| {value: 2, label: 'second'} | ||
| ], | ||
| setValue: () => {} | ||
| }; | ||
| expect(ReactDOM.render.calledTwice).toBe(true, 'ReactDOM.render called twice'); | ||
| expect(ReactDOM.render.firstCall.args[0]).toEqualJSX(<Selector {...props} />); | ||
| expect(ReactDOM.render.firstCall.args[1]).toEqual(container); | ||
| expect(ReactDOM.render.secondCall.args[0]).toEqualJSX(<Selector {...props} />); | ||
| expect(ReactDOM.render.secondCall.args[1]).toEqual(container); | ||
| }); | ||
|
|
||
| it('sets the underlying numeric refinement', () => { | ||
| widget._refine(helper, 2); | ||
| expect(helper.addNumericRefinement.calledOnce).toBe(true, 'addNumericRefinement called once'); | ||
| expect(helper.search.calledOnce).toBe(true, 'search called once'); | ||
| }); | ||
|
|
||
| it('cancles the underying numeric refinement', () => { | ||
| widget._refine(helper, undefined); | ||
| expect(helper.clearRefinements.calledOnce).toBe(true, 'clearRefinements called once'); | ||
| expect(helper.addNumericRefinement.called).toBe(false, 'addNumericRefinement never called'); | ||
| expect(helper.search.calledOnce).toBe(true, 'search called once'); | ||
| }); | ||
|
|
||
| afterEach(() => { | ||
| numericSelector.__ResetDependency__('ReactDOM'); | ||
| numericSelector.__ResetDependency__('autoHideContainerHOC'); | ||
| }); | ||
| }); |
Oops, something went wrong.