From e72f529cb1c629bdcc8e79043199c29cc80fc31f Mon Sep 17 00:00:00 2001
From: Vaillant Samuel <samuel.vllnt@gmail.com>
Date: Thu, 1 Mar 2018 16:20:14 +0100
Subject: [PATCH] feat(Template): add props for the tagName

---
 src/components/Template.js                             |  5 ++++-
 src/components/__tests__/Template-test.js              |  9 +++++++++
 .../__tests__/__snapshots__/Template-test.js.snap      | 10 ++++++++++
 3 files changed, 23 insertions(+), 1 deletion(-)

diff --git a/src/components/Template.js b/src/components/Template.js
index 89ab4b9d61..db7b2bec13 100644
--- a/src/components/Template.js
+++ b/src/components/Template.js
@@ -14,6 +14,7 @@ export class PureTemplate extends Component {
   }
 
   render() {
+    const RootTagName = this.props.rootTagName;
     const useCustomCompileOptions = this.props.useCustomCompileOptions[
       this.props.templateKey
     ];
@@ -42,7 +43,7 @@ export class PureTemplate extends Component {
     }
 
     return (
-      <div
+      <RootTagName
         {...this.props.rootProps}
         dangerouslySetInnerHTML={{ __html: content }}
       />
@@ -53,6 +54,7 @@ export class PureTemplate extends Component {
 PureTemplate.propTypes = {
   data: PropTypes.object,
   rootProps: PropTypes.object,
+  rootTagName: PropTypes.string,
   templateKey: PropTypes.string,
   templates: PropTypes.objectOf(
     PropTypes.oneOfType([PropTypes.string, PropTypes.func])
@@ -81,6 +83,7 @@ PureTemplate.propTypes = {
 
 PureTemplate.defaultProps = {
   data: {},
+  rootTagName: 'div',
   useCustomCompileOptions: {},
   templates: {},
   templatesConfig: {},
diff --git a/src/components/__tests__/Template-test.js b/src/components/__tests__/Template-test.js
index 50919a0195..230bc5b7fc 100644
--- a/src/components/__tests__/Template-test.js
+++ b/src/components/__tests__/Template-test.js
@@ -26,6 +26,13 @@ describe('Template', () => {
     expect(tree).toMatchSnapshot();
   });
 
+  it('can configure custom rootTagName', () => {
+    const props = getProps({ rootTagName: 'span' });
+    const tree = renderer.create(<PureTemplate {...props} />).toJSON();
+
+    expect(tree).toMatchSnapshot();
+  });
+
   it('forward rootProps to the first node', () => {
     function fn() {}
 
@@ -207,8 +214,10 @@ describe('Template', () => {
     useCustomCompileOptions = {},
     templatesConfig = { helper: {}, compileOptions: {} },
     transformData = null,
+    ...props
   }) {
     return {
+      ...props,
       templates,
       data,
       templateKey,
diff --git a/src/components/__tests__/__snapshots__/Template-test.js.snap b/src/components/__tests__/__snapshots__/Template-test.js.snap
index 40aa23021c..af538fb037 100644
--- a/src/components/__tests__/__snapshots__/Template-test.js.snap
+++ b/src/components/__tests__/__snapshots__/Template-test.js.snap
@@ -10,6 +10,16 @@ exports[`Template can configure compilation options 1`] = `
 />
 `;
 
+exports[`Template can configure custom rootTagName 1`] = `
+<span
+  dangerouslySetInnerHTML={
+    Object {
+      "__html": "",
+    }
+  }
+/>
+`;
+
 exports[`Template forward rootProps to the first node 1`] = `
 <div
   className="hey"