diff --git a/components/HTMLBlock/index.tsx b/components/HTMLBlock/index.tsx
index b531e8b43..f7eaadecc 100644
--- a/components/HTMLBlock/index.tsx
+++ b/components/HTMLBlock/index.tsx
@@ -15,7 +15,7 @@ const extractScripts = (html: string = ''): [string, () => void] => {
 
 const HTMLBlock = ({ children = '', runScripts, safeMode = false }) => {
   let html = children;
-  runScripts = runScripts === 'true' ? true : false;
+  runScripts = typeof runScripts !== 'boolean' ? (runScripts === 'true' ? true : false) : runScripts;
 
   if (typeof html !== 'string') html = renderToStaticMarkup(html);
   const [cleanedHtml, exec] = extractScripts(html);
diff --git a/docs/html-tests.md b/docs/html-tests.md
index 0c6884379..24e262a20 100644
--- a/docs/html-tests.md
+++ b/docs/html-tests.md
@@ -33,16 +33,14 @@ title: 'HTML Blocks'
 
 ## HTML in template literal
 
-<HTMLBlock>
-  {`
+<HTMLBlock>{`
     <script>console.log(true, 3);</script>
     <h3>Header 3</h3>
     <p>Paragraph with <em>italics</em> and <strong>bold stuff</strong>.</p>
     <div style="padding-left: 20px; color: blue">
       Behold, I am blue and indented!
     </div>
-  `}
-</HTMLBlock>
+`}</HTMLBlock>
 
 
 ## JSX in safe mode
@@ -59,13 +57,11 @@ title: 'HTML Blocks'
 
 ## HTML in safe mode
 
-<HTMLBlock safeMode={true}>
-{`
+<HTMLBlock safeMode={true}>{`
   <script>console.log(true, 5);</script>
   <h3>Header 5</h3>
   <p>Paragraph with <em>italics</em> and <strong>bold stuff</strong>.</p>
   <div style="padding-left: 20px; color: blue">
     Behold, I am blue and indented!
   </div>
-`}
-</HTMLBlock>
\ No newline at end of file
+`}</HTMLBlock>
\ No newline at end of file