feat(connectRefinementList): first good iteration

Author: vvo

src/connectors/refinement-list/__tests__/connectRefinementList-test.js

@@ -0,0 +1,251 @@
+/* eslint-env mocha */
+
+import expect from 'expect';
+import sinon from 'sinon';
+
+import algoliasearchHelper from 'algoliasearch-helper';
+const SearchResults = algoliasearchHelper.SearchResults;
+
+import connectRefinementList from '../connectRefinementList.js';
+
+const fakeClient = {addAlgoliaAgent: () => {}};
+
+describe('connectRefinementList', () => {
+  let rendering;
+  let makeWidget;
+  beforeEach(() => {
+    rendering = sinon.stub();
+    makeWidget = connectRefinementList(rendering);
+  });
+
+  it('throws on bad usage', () => {
+    expect(
+      connectRefinementList
+    ).toThrow();
+
+    expect(
+      () => connectRefinementList({
+        operator: 'and',
+      })
+    ).toThrow();
+
+    expect(
+      () => connectRefinementList(() => {})()
+    ).toThrow();
+
+    expect(
+      () => connectRefinementList(() => {})({
+        operator: 'and',
+      })
+    ).toThrow();
+
+    expect(
+      () => connectRefinementList(() => {})({
+        attributeName: 'company',
+        operator: 'YUP',
+      })
+    ).toThrow();
+  });
+
+  context('options configuring the helper', () => {
+    it('`attributeName`', () => {
+      const widget = makeWidget({
+        attributeName: 'myFacet',
+      });
+
+      expect(widget.getConfiguration())
+        .toEqual({
+          disjunctiveFacets: ['myFacet'],
+        });
+    });
+
+    it('`limit`', () => {
+      const widget = makeWidget({
+        attributeName: 'myFacet',
+        limit: 20,
+      });
+
+      expect(widget.getConfiguration())
+        .toEqual({
+          disjunctiveFacets: ['myFacet'],
+          maxValuesPerFacet: 20,
+        });
+
+      expect(widget.getConfiguration({maxValuesPerFacet: 100}))
+        .toEqual({
+          disjunctiveFacets: ['myFacet'],
+          maxValuesPerFacet: 100,
+        }, 'Can read the previous maxValuesPerFacet value');
+    });
+
+    it('`operator="and"`', () => {
+      const widget = makeWidget({
+        attributeName: 'myFacet',
+        operator: 'and',
+      });
+
+      expect(widget.getConfiguration())
+        .toEqual({
+          facets: ['myFacet'],
+        });
+    });
+  });
+
+  it('calls render method at init time', () => {
+
+  });
+
+  it('calls render method when we have new results', () => {
+
+  });
+
+  it('Renders during init and render', () => {
+    // test that the dummyRendering is called with the isFirstRendering
+    // flag set accordingly
+    const widget = makeWidget({
+      attributeName: 'myFacet',
+      limit: 9,
+    });
+
+    const config = widget.getConfiguration({});
+    expect(config).toEqual({
+      disjunctiveFacets: ['myFacet'],
+      maxValuesPerFacet: 9,
+    });
+
+    // test if widget is not rendered yet at this point
+    expect(rendering.callCount).toBe(0);
+
+    const helper = algoliasearchHelper(fakeClient, '', config);
+    helper.search = sinon.stub();
+
+    widget.init({
+      helper,
+      state: helper.state,
+      createURL: () => '#',
+      onHistoryChange: () => {},
+    });
+
+    // test that rendering has been called during init with isFirstRendering = true
+    expect(rendering.callCount).toBe(1);
+    // test if isFirstRendering is true during init
+    expect(rendering.lastCall.args[1]).toBe(true);
+
+    const firstRenderingOptions = rendering.lastCall.args[0];
+    expect(firstRenderingOptions.canRefine).toBe(false);
+
+    widget.render({
+      results: new SearchResults(helper.state, [{}]),
+      state: helper.state,
+      helper,
+      createURL: () => '#',
+    });
+
+    // test that rendering has been called during init with isFirstRendering = false
+    expect(rendering.callCount).toBe(2);
+    expect(rendering.lastCall.args[1]).toBe(false);
+
+    const secondRenderingOptions = rendering.lastCall.args[0];
+    expect(secondRenderingOptions.canRefine).toBe(false);
+  });
+
+  it('Provide a function to clear the refinements at each step', () => {
+    const widget = makeWidget({
+      attributeName: 'category',
+    });
+
+    const helper = algoliasearchHelper(fakeClient, '', widget.getConfiguration({}));
+    helper.search = sinon.stub();
+
+    helper.toggleRefinement('category', 'value');
+
+    widget.init({
+      helper,
+      state: helper.state,
+      createURL: () => '#',
+      onHistoryChange: () => {},
+    });
+
+    const firstRenderingOptions = rendering.lastCall.args[0];
+    const {refine} = firstRenderingOptions;
+    refine('value');
+    expect(helper.hasRefinements('category')).toBe(false);
+    refine('value');
+    expect(helper.hasRefinements('category')).toBe(true);
+
+    widget.render({
+      results: new SearchResults(helper.state, [{}, {}]),
+      state: helper.state,
+      helper,
+      createURL: () => '#',
+    });
+
+    const secondRenderingOptions = rendering.lastCall.args[0];
+    const {refine: renderToggleRefinement} = secondRenderingOptions;
+    renderToggleRefinement('value');
+    expect(helper.hasRefinements('category')).toBe(false);
+    renderToggleRefinement('value');
+    expect(helper.hasRefinements('category')).toBe(true);
+  });
+
+  it('provides the correct facet values', () => {
+    const widget = makeWidget({
+      attributeName: 'category',
+    });
+
+    const helper = algoliasearchHelper(fakeClient, '', widget.getConfiguration({}));
+    helper.search = sinon.stub();
+
+    helper.toggleRefinement('category', 'Decoration');
+
+    widget.init({
+      helper,
+      state: helper.state,
+      createURL: () => '#',
+      onHistoryChange: () => {},
+    });
+
+    const firstRenderingOptions = rendering.lastCall.args[0];
+    // During the first rendering there are no facet values
+    // The function get an empty array so that it doesn't break
+    // over null-ish values.
+    expect(firstRenderingOptions.items).toEqual([]);
+
+    widget.render({
+      results: new SearchResults(helper.state, [{
+        hits: [],
+        facets: {
+          category: {
+            Decoration: 880,
+          },
+        },
+      }, {
+        facets: {
+          category: {
+            Decoration: 880,
+            Outdoor: 47,
+          },
+        },
+      }]),
+      state: helper.state,
+      helper,
+      createURL: () => '#',
+    });
+
+    const secondRenderingOptions = rendering.lastCall.args[0];
+    expect(secondRenderingOptions.items).toEqual([
+      {
+        name: 'Decoration',
+        highlighted: 'Decoration',
+        count: 880,
+        isRefined: true,
+      },
+      {
+        name: 'Outdoor',
+        highlighted: 'Outdoor',
+        count: 47,
+        isRefined: false,
+      },
+    ]);
+  });
+});