Fix script tags returning null on render

Fixes #133
adriantoine · Sep 19, 2019 · ae563f4 · ae563f4
1 parent a8f9fcf
commit ae563f4
Show file tree

Hide file tree

Showing 4 changed files with 40 additions and 2 deletions.
diff --git a/src/render.js b/src/render.js
@@ -7,7 +7,7 @@ const renderChildToJson = (child, options) => {
     return null;
   }
 
-  if (child.type === 'tag') {
+  if (['tag', 'script'].includes(child.type)) {
     return applyMap(
       {
         node: child,

diff --git a/tests/__snapshots__/render.test.js.snap b/tests/__snapshots__/render.test.js.snap
@@ -141,6 +141,18 @@ Array [
 ]
 `;
 
+exports[`renders an external script 1`] = `
+<script
+  src="http://www.example.com/foo.js"
+/>
+`;
+
+exports[`renders an inline script 1`] = `
+<script>
+  console.log('hi there');
+</script>
+`;
+
 exports[`renders multiple elements as a result of find 1`] = `
 Array [
   <li>

diff --git a/tests/fixtures/pure-function.js b/tests/fixtures/pure-function.js
@@ -103,9 +103,21 @@ export const ComponentWithMemo = () => (
 
 export const ComponentWithChildren = ({children}) => <span>{children}</span>;
 
-export const WithDefaultProps = ({value, falsyValue}) => <div>{value},{falsyValue}</div>;
+export const WithDefaultProps = ({value, falsyValue}) => (
+  <div>
+    {value},{falsyValue}
+  </div>
+);
 
 WithDefaultProps.defaultProps = {
   value: 'hi there',
   falsyValue: false,
 };
+
+export const InlineScript = () => (
+  <script dangerouslySetInnerHTML={{__html: `console.log('hi there');`}} />
+);
+
+export const ExternalScript = () => (
+  <script src={'http://www.example.com/foo.js'} />
+);
diff --git a/tests/render.test.js b/tests/render.test.js
@@ -12,6 +12,8 @@ import {
   ArrayRender,
   FragmentAsChild,
   FragmentAsRoot,
+  InlineScript,
+  ExternalScript,
 } from './fixtures/pure-function';
 import {
   BasicClass,
@@ -161,3 +163,15 @@ it('renders a component that has a fragment root', () => {
 
   expect(renderToJson(wrapper)).toMatchSnapshot();
 });
+
+it('renders an inline script', () => {
+  const wrapper = render(<InlineScript />);
+
+  expect(renderToJson(wrapper)).toMatchSnapshot();
+});
+
+it('renders an external script', () => {
+  const wrapper = render(<ExternalScript />);
+
+  expect(renderToJson(wrapper)).toMatchSnapshot();
+});