From 15758b3e7f88de9952446837872621470c68dfeb Mon Sep 17 00:00:00 2001
From: jurajk <kiss@lbstudio.sk>
Date: Tue, 3 Mar 2020 10:55:53 +0100
Subject: [PATCH 1/3] prevent error when no mdx language is defined

---
 packages/styleguide/src/components/MDX/MDX.js | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/styleguide/src/components/MDX/MDX.js b/packages/styleguide/src/components/MDX/MDX.js
index 081204f20d9..c49fc4463ef 100644
--- a/packages/styleguide/src/components/MDX/MDX.js
+++ b/packages/styleguide/src/components/MDX/MDX.js
@@ -36,7 +36,10 @@ export const MDXComponents = {
   a: props => <Link {...props} />,
   inlineCode: props => <Code {...props} />,
   code: props => (
-    <CodeBlock language={props.className.replace(/language-/, '')} {...props} />
+    <CodeBlock
+      language={props.className && props.className.replace(/language-/, '')}
+      {...props}
+    />
   ),
 };
 

From 2050bf85593c468e4c11a4a37e9ddc9753627d95 Mon Sep 17 00:00:00 2001
From: jurajk <kiss@lbstudio.sk>
Date: Tue, 3 Mar 2020 16:53:39 +0100
Subject: [PATCH 2/3] prevent html code example from crashing when children is
 array

---
 packages/styleguide/src/components/Preview/CodeExample.js | 7 ++-----
 1 file changed, 2 insertions(+), 5 deletions(-)

diff --git a/packages/styleguide/src/components/Preview/CodeExample.js b/packages/styleguide/src/components/Preview/CodeExample.js
index 3044617e753..49aca0ccdd3 100644
--- a/packages/styleguide/src/components/Preview/CodeExample.js
+++ b/packages/styleguide/src/components/Preview/CodeExample.js
@@ -167,7 +167,7 @@ export default class CodeExample extends React.Component {
   }
 
   render() {
-    const { children, codeJSXOptions, codeTypes, theme, ...other } = this.props;
+    const { children, codeJSXOptions, codeTypes, ...other } = this.props;
 
     let codeToShow;
     switch (this.state.codePreviewType) {
@@ -175,10 +175,7 @@ export default class CodeExample extends React.Component {
         codeToShow = pretty(
           typeof children === 'string'
             ? unescape(children)
-            : renderToStaticMarkup({
-                ...children,
-                props: { ...children.props, theme },
-              }),
+            : renderToStaticMarkup(children),
           {
             ocd: true,
           }

From d177dde0966525d469d1272bc09c467614f8d0c2 Mon Sep 17 00:00:00 2001
From: jurajk <kiss@lbstudio.sk>
Date: Tue, 3 Mar 2020 16:54:03 +0100
Subject: [PATCH 3/3] add test

---
 .../src/components/Preview/CodeExample.js       |  1 +
 .../src/components/Preview/Preview.test.js      | 17 ++++++++++++++++-
 2 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/packages/styleguide/src/components/Preview/CodeExample.js b/packages/styleguide/src/components/Preview/CodeExample.js
index 49aca0ccdd3..28f48aa1bfa 100644
--- a/packages/styleguide/src/components/Preview/CodeExample.js
+++ b/packages/styleguide/src/components/Preview/CodeExample.js
@@ -211,6 +211,7 @@ export default class CodeExample extends React.Component {
         <Code
           inline={false}
           ref={this.codeBlockRef}
+          data-testid={this.state.codePreviewType}
           language={
             this.state.codePreviewType === 'html'
               ? 'markup'
diff --git a/packages/styleguide/src/components/Preview/Preview.test.js b/packages/styleguide/src/components/Preview/Preview.test.js
index ff7113f4326..1da9e35a866 100644
--- a/packages/styleguide/src/components/Preview/Preview.test.js
+++ b/packages/styleguide/src/components/Preview/Preview.test.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { render } from '@testing-library/react';
+import { render, fireEvent } from '@testing-library/react';
 
 import Preview from '.';
 
@@ -8,4 +8,19 @@ describe('rendering', () => {
     const { getByText } = render(<Preview>Preview</Preview>);
     expect(getByText('Preview')).toBeInTheDocument();
   });
+
+  it('HTML preview renders more than 1 child', () => {
+    const { getByText, getByTestId } = render(
+      <Preview>
+        <p>Paragraph 1</p>
+        <p>Paragraph 2</p>
+      </Preview>
+    );
+
+    fireEvent.click(getByText('SHOW CODE'));
+
+    fireEvent.click(getByText('HTML'));
+
+    expect(getByTestId('html')).toBeInTheDocument();
+  });
 });