diff --git a/src/components/RefinementList/__tests__/RefinementList-test.js b/src/components/RefinementList/__tests__/RefinementList-test.js
index 5c2dd5d8d0..f69162b3fb 100644
--- a/src/components/RefinementList/__tests__/RefinementList-test.js
+++ b/src/components/RefinementList/__tests__/RefinementList-test.js
@@ -235,7 +235,7 @@ describe('RefinementList', () => {
// When
const root = shallowRender(props);
- const actual = root.find('Template').filter({templateKey: 'show-more-inactive'});
+ const actual = root.find('[templateKey="show-more-inactive"]');
// Then
expect(actual.length).toEqual(1);
diff --git a/src/components/Template.js b/src/components/Template.js
index 002ce0147d..730abfc12c 100644
--- a/src/components/Template.js
+++ b/src/components/Template.js
@@ -8,7 +8,7 @@ import hogan from 'hogan.js';
import isEqual from 'lodash/isEqual';
-class Template extends React.Component {
+export class Template extends React.Component {
shouldComponentUpdate(nextProps) {
return !isEqual(this.props.data, nextProps.data) || this.props.templateKey !== nextProps.templateKey;
}
@@ -22,7 +22,7 @@ class Template extends React.Component {
templateKey: this.props.templateKey,
compileOptions,
helpers: this.props.templatesConfig.helpers,
- data: transformData(this.props.transformData, this.props.templateKey, this.props.data),
+ data: this.props.data,
});
if (content === null) {
@@ -137,4 +137,15 @@ function transformHelpersToHogan(helpers, compileOptions, data) {
);
}
-export default Template;
+// Resolve transformData before Template, so transformData is always called
+// even if the data is the same. Allowing you to dynamically inject conditions in
+// transformData that will force re-rendering
+const withTransformData =
+ TemplateToWrap =>
+ props =>
+ ;
+
+export default withTransformData(Template);
diff --git a/src/components/__tests__/Template-test.js b/src/components/__tests__/Template-test.js
index 0315f41f14..24f563e7ab 100644
--- a/src/components/__tests__/Template-test.js
+++ b/src/components/__tests__/Template-test.js
@@ -4,7 +4,7 @@ import React from 'react';
import ReactDOM from 'react-dom';
import expect from 'expect';
import TestUtils from 'react-addons-test-utils';
-import Template from '../Template';
+import TemplateWithTransformData, {Template} from '../Template';
import sinon from 'sinon';
import expectJSX from 'expect-jsx';
expect.extend(expectJSX);
@@ -120,11 +120,10 @@ describe('Template', () => {
},
});
- renderer.render();
+ renderer.render();
const out = renderer.getRenderOutput();
- const content = 'it supports transformData';
- const expectedJSX =
;
+ const expectedJSX = ;
expect(out).toEqualJSX(expectedJSX);
});
@@ -144,7 +143,7 @@ describe('Template', () => {
},
});
- renderer.render();
+ renderer.render();
expect(called).toBe(true);
});
@@ -165,7 +164,7 @@ describe('Template', () => {
},
});
- renderer.render();
+ renderer.render();
expect(called).toBe(true);
});
@@ -177,7 +176,7 @@ describe('Template', () => {
});
expect(() => {
- renderer.render();
+ renderer.render();
}).toThrow('`transformData` must return a `object`, got `undefined`.');
});
@@ -191,7 +190,7 @@ describe('Template', () => {
});
expect(() => {
- renderer.render();
+ renderer.render();
}).toNotThrow();
});
@@ -203,7 +202,7 @@ describe('Template', () => {
});
expect(() => {
- renderer.render();
+ renderer.render();
}).toThrow('`transformData` must return a `object`, got `boolean`.');
});
});
diff --git a/src/decorators/__tests__/headerFooter-test.js b/src/decorators/__tests__/headerFooter-test.js
index f2b026904b..33755962da 100644
--- a/src/decorators/__tests__/headerFooter-test.js
+++ b/src/decorators/__tests__/headerFooter-test.js
@@ -64,7 +64,7 @@ describe('headerFooter', () => {
const out = render(defaultProps);
// Then
const templateProps = {
- data: {},
+ data: undefined,
templateKey: 'header',
transformData: null,
templates: {
@@ -90,7 +90,7 @@ describe('headerFooter', () => {
const out = render(defaultProps);
// Then
const templateProps = {
- data: {},
+ data: undefined,
templateKey: 'footer',
transformData: null,
templates: {
@@ -118,7 +118,7 @@ describe('headerFooter', () => {
footer: 'yo footer',
};
templateProps = {
- data: {},
+ data: undefined,
transformData: null,
templates: {
header: 'yo header',
diff --git a/src/widgets/refinement-list/__tests__/refinement-list-test.js b/src/widgets/refinement-list/__tests__/refinement-list-test.js
index ad7465d2d5..ae72a7e3b0 100644
--- a/src/widgets/refinement-list/__tests__/refinement-list-test.js
+++ b/src/widgets/refinement-list/__tests__/refinement-list-test.js
@@ -1,18 +1,12 @@
/* eslint-env mocha */
-import React from 'react';
import expect from 'expect';
import sinon from 'sinon';
-import {createRenderer} from 'react-addons-test-utils';
-
import expectJSX from 'expect-jsx';
expect.extend(expectJSX);
import refinementList from '../refinement-list.js';
-import Template from '../../../components/Template.js';
-import createHelpers from '../../../lib/createHelpers.js';
-import defaultTemplates from '../defaultTemplates.js';
describe('refinementList()', () => {
let autoHideContainer;
@@ -21,8 +15,6 @@ describe('refinementList()', () => {
let options;
let widget;
let ReactDOM;
- const renderer = createRenderer();
- const helpers = createHelpers('en-US');
beforeEach(() => {
container = document.createElement('div');
@@ -187,17 +179,6 @@ describe('refinementList()', () => {
createURL = () => '#';
});
- it('formats counts', () => {
- const props = {
- templatesConfig: {helpers},
- templates: defaultTemplates,
- };
- renderer.render();
- const out = renderer.getRenderOutput();
- // eslint-disable-next-line max-len
- expect(out).toEqualJSX(\n
\n
1,000\n'}} />);
- });
-
context('cssClasses', () => {
it('should call the component with the correct classes', () => {
// Given
diff --git a/src/widgets/toggle/implementations/__tests__/currentToggle-test.js b/src/widgets/toggle/implementations/__tests__/currentToggle-test.js
index ed5a7e3d39..1cf96d8f7a 100644
--- a/src/widgets/toggle/implementations/__tests__/currentToggle-test.js
+++ b/src/widgets/toggle/implementations/__tests__/currentToggle-test.js
@@ -4,20 +4,13 @@ import React from 'react';
import expect from 'expect';
import sinon from 'sinon';
-import {createRenderer} from 'react-addons-test-utils';
-
import currentToggle from '../currentToggle.js';
import defaultTemplates from '../../defaultTemplates.js';
-import Template from '../../../../components/Template';
import expectJSX from 'expect-jsx';
expect.extend(expectJSX);
-import createHelpers from '../../../../lib/createHelpers.js';
describe('currentToggle()', () => {
- const helpers = createHelpers('en-US');
- const renderer = createRenderer();
-
context('good usage', () => {
let ReactDOM;
let containerNode;
@@ -102,14 +95,6 @@ describe('currentToggle()', () => {
expect(ReactDOM.render.secondCall.args[1]).toEqual(containerNode);
});
- it('formats counts', () => {
- templateProps.templatesConfig = {helpers};
- renderer.render(
);
- const out = renderer.getRenderOutput();
- // eslint-disable-next-line max-len
- expect(out).toEqualJSX(
\n \n 1,000\n'}} />);
- });
-
it('understands cssClasses', () => {
results = {
hits: [{Hello: ', world!'}],