do not crashe when used in node (isomorphic)

Redocly · Jan 9, 2018 · d67852f · d67852f
1 parent 50e2a58
commit d67852f
Show file tree

Hide file tree

Showing 18 changed files with 128 additions and 82 deletions.
diff --git a/package.json b/package.json
@@ -50,7 +50,6 @@
     "enzyme": "^3.1.1",
     "enzyme-adapter-react-16": "^1.0.4",
     "enzyme-to-json": "^3.2.2",
-    "extract-text-webpack-plugin": "^3.0.0",
     "html-webpack-plugin": "^2.30.1",
     "http-server": "^0.10.0",
     "jest": "^21.1.0",

diff --git a/src/common-elements/perfect-scrollbar.ts b/src/common-elements/perfect-scrollbar.ts
@@ -1,8 +1,10 @@
-import styled from '../styled-components';
-import 'perfect-scrollbar/dist/css/perfect-scrollbar.css';
+import styled, { injectGlobal } from '../styled-components';
+import psStyles from 'perfect-scrollbar/dist/css/perfect-scrollbar.css';
 
 import PerfectScrollbarOriginal from 'react-perfect-scrollbar';
 
+injectGlobal`${psStyles}`;
+
 export const PerfectScrollbar = styled(PerfectScrollbarOriginal)`
   position: relative;
 `;
diff --git a/src/components/Schema/__tests__/__snapshots__/DiscriminatorDropdown.test.tsx.snap b/src/components/Schema/__tests__/__snapshots__/DiscriminatorDropdown.test.tsx.snap
@@ -72,7 +72,7 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
                         "weight": "300",
                       },
                       "code": Object {
-                        "fontFamily": "\\"Lucida Console\\", Monaco, monospace",
+                        "fontFamily": "Courirer, monospace",
                         "fontSize": "13px",
                       },
                       "colors": Object {
@@ -114,6 +114,7 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
                         "width": 40,
                       },
                       "schemaView": Object {
+                        "defaultDetailsWidth": "75%",
                         "linesColor": "#7f99cf",
                       },
                       "spacingUnit": 20,
@@ -176,7 +177,7 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
                         "weight": "300",
                       },
                       "code": Object {
-                        "fontFamily": "\\"Lucida Console\\", Monaco, monospace",
+                        "fontFamily": "Courirer, monospace",
                         "fontSize": "13px",
                       },
                       "colors": Object {
@@ -218,6 +219,7 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
                         "width": 40,
                       },
                       "schemaView": Object {
+                        "defaultDetailsWidth": "75%",
                         "linesColor": "#7f99cf",
                       },
                       "spacingUnit": 20,
@@ -263,7 +265,7 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
                   "weight": "300",
                 },
                 "code": Object {
-                  "fontFamily": "\\"Lucida Console\\", Monaco, monospace",
+                  "fontFamily": "Courirer, monospace",
                   "fontSize": "13px",
                 },
                 "colors": Object {
@@ -305,6 +307,7 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
                   "width": 40,
                 },
                 "schemaView": Object {
+                  "defaultDetailsWidth": "75%",
                   "linesColor": "#7f99cf",
                 },
                 "spacingUnit": 20,
@@ -404,7 +407,7 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
                         "weight": "300",
                       },
                       "code": Object {
-                        "fontFamily": "\\"Lucida Console\\", Monaco, monospace",
+                        "fontFamily": "Courirer, monospace",
                         "fontSize": "13px",
                       },
                       "colors": Object {
@@ -446,6 +449,7 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
                         "width": 40,
                       },
                       "schemaView": Object {
+                        "defaultDetailsWidth": "75%",
                         "linesColor": "#7f99cf",
                       },
                       "spacingUnit": 20,
@@ -508,7 +512,7 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
                         "weight": "300",
                       },
                       "code": Object {
-                        "fontFamily": "\\"Lucida Console\\", Monaco, monospace",
+                        "fontFamily": "Courirer, monospace",
                         "fontSize": "13px",
                       },
                       "colors": Object {
@@ -550,6 +554,7 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
                         "width": 40,
                       },
                       "schemaView": Object {
+                        "defaultDetailsWidth": "75%",
                         "linesColor": "#7f99cf",
                       },
                       "spacingUnit": 20,
@@ -595,7 +600,7 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
                   "weight": "300",
                 },
                 "code": Object {
-                  "fontFamily": "\\"Lucida Console\\", Monaco, monospace",
+                  "fontFamily": "Courirer, monospace",
                   "fontSize": "13px",
                 },
                 "colors": Object {
@@ -637,6 +642,7 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
                   "width": 40,
                 },
                 "schemaView": Object {
+                  "defaultDetailsWidth": "75%",
                   "linesColor": "#7f99cf",
                 },
                 "spacingUnit": 20,
@@ -706,7 +712,7 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
               "weight": "300",
             },
             "code": Object {
-              "fontFamily": "\\"Lucida Console\\", Monaco, monospace",
+              "fontFamily": "Courirer, monospace",
               "fontSize": "13px",
             },
             "colors": Object {
@@ -748,6 +754,7 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
               "width": 40,
             },
             "schemaView": Object {
+              "defaultDetailsWidth": "75%",
               "linesColor": "#7f99cf",
             },
             "spacingUnit": 20,
@@ -843,7 +850,7 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
                   "weight": "300",
                 },
                 "code": Object {
-                  "fontFamily": "\\"Lucida Console\\", Monaco, monospace",
+                  "fontFamily": "Courirer, monospace",
                   "fontSize": "13px",
                 },
                 "colors": Object {
@@ -885,6 +892,7 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
                   "width": 40,
                 },
                 "schemaView": Object {
+                  "defaultDetailsWidth": "75%",
                   "linesColor": "#7f99cf",
                 },
                 "spacingUnit": 20,
@@ -947,7 +955,7 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
                   "weight": "300",
                 },
                 "code": Object {
-                  "fontFamily": "\\"Lucida Console\\", Monaco, monospace",
+                  "fontFamily": "Courirer, monospace",
                   "fontSize": "13px",
                 },
                 "colors": Object {
@@ -989,6 +997,7 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
                   "width": 40,
                 },
                 "schemaView": Object {
+                  "defaultDetailsWidth": "75%",
                   "linesColor": "#7f99cf",
                 },
                 "spacingUnit": 20,
@@ -1034,7 +1043,7 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
             "weight": "300",
           },
           "code": Object {
-            "fontFamily": "\\"Lucida Console\\", Monaco, monospace",
+            "fontFamily": "Courirer, monospace",
             "fontSize": "13px",
           },
           "colors": Object {
@@ -1076,6 +1085,7 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
             "width": 40,
           },
           "schemaView": Object {
+            "defaultDetailsWidth": "75%",
             "linesColor": "#7f99cf",
           },
           "spacingUnit": 20,
@@ -1173,7 +1183,7 @@ exports[`Components SchemaView discriminator should correctly render discriminat
                   "weight": "300",
                 },
                 "code": Object {
-                  "fontFamily": "\\"Lucida Console\\", Monaco, monospace",
+                  "fontFamily": "Courirer, monospace",
                   "fontSize": "13px",
                 },
                 "colors": Object {
@@ -1215,6 +1225,7 @@ exports[`Components SchemaView discriminator should correctly render discriminat
                   "width": 40,
                 },
                 "schemaView": Object {
+                  "defaultDetailsWidth": "75%",
                   "linesColor": "#7f99cf",
                 },
                 "spacingUnit": 20,
@@ -1284,7 +1295,7 @@ exports[`Components SchemaView discriminator should correctly render discriminat
                   "weight": "300",
                 },
                 "code": Object {
-                  "fontFamily": "\\"Lucida Console\\", Monaco, monospace",
+                  "fontFamily": "Courirer, monospace",
                   "fontSize": "13px",
                 },
                 "colors": Object {
@@ -1326,6 +1337,7 @@ exports[`Components SchemaView discriminator should correctly render discriminat
                   "width": 40,
                 },
                 "schemaView": Object {
+                  "defaultDetailsWidth": "75%",
                   "linesColor": "#7f99cf",
                 },
                 "spacingUnit": 20,

diff --git a/src/components/StickySidebar/StickySidebar.tsx b/src/components/StickySidebar/StickySidebar.tsx
@@ -1,16 +1,19 @@
 import * as React from 'react';
-import Stickyfill from 'stickyfill';
-
 import { ComponentWithOptions } from '../OptionsProvider';
 import { RedocNormalizedOptions, RedocRawOptions } from '../../services/RedocNormalizedOptions';
 import styled from '../../styled-components';
 
+let Stickyfill;
+if (typeof window !== 'undefined') {
+  Stickyfill = require('stickyfill').default;
+}
+
 export interface StickySidebarProps {
   className?: string;
   scrollYOffset?: RedocRawOptions['scrollYOffset']; // passed directly or via context
 }
 
-const stickyfill = Stickyfill();
+const stickyfill = Stickyfill && Stickyfill();
 
 const StyledStickySidebar = styled.div`
   width: ${props => props.theme.menu.width};
@@ -31,11 +34,11 @@ export class StickySidebar extends ComponentWithOptions<StickySidebarProps> {
   stickyElement: Element;
 
   componentDidMount() {
-    stickyfill.add(this.stickyElement);
+    stickyfill && stickyfill.add(this.stickyElement);
   }
 
   componentWillUnmount() {
-    stickyfill.remove(this.stickyElement);
+    stickyfill && stickyfill.remove(this.stickyElement);
   }
 
   get scrollYOffset() {

diff --git a/src/services/ClipboardService.ts b/src/services/ClipboardService.ts
@@ -1,4 +1,7 @@
-const isSupported = document.queryCommandSupported && document.queryCommandSupported('copy');
+const isSupported =
+  typeof document !== 'undefined' &&
+  document.queryCommandSupported &&
+  document.queryCommandSupported('copy');
 
 export class ClipboardService {
   static isSupported(): boolean {

diff --git a/src/services/HistoryService.ts b/src/services/HistoryService.ts
@@ -1,5 +1,6 @@
 import { bind, debounce } from 'decko';
 import { EventEmitter } from 'eventemitter3';
+import { isBrowser } from '../utils/';
 
 const EVENT = 'hashchange';
 
@@ -17,7 +18,7 @@ class _HistoryService {
   }
 
   get hash(): string {
-    return window.location.hash;
+    return isBrowser ? window.location.hash : '';
   }
 
   subscribe(cb): () => void {
@@ -34,11 +35,15 @@ class _HistoryService {
   };
 
   bind() {
-    window.addEventListener('hashchange', this.emit, false);
+    if (isBrowser) {
+      window.addEventListener('hashchange', this.emit, false);
+    }
   }
 
   dispose() {
-    window.removeEventListener('hashchange', this.emit);
+    if (isBrowser) {
+      window.removeEventListener('hashchange', this.emit);
+    }
     this.causedHashChange = false;
   }
 
@@ -47,11 +52,15 @@ class _HistoryService {
   update(hash: string | null, rewriteHistory: boolean = false) {
     if (hash == null || isSameHash(hash, this.hash)) return;
     if (rewriteHistory) {
-      window.history.replaceState(null, '', window.location.href.split('#')[0] + '#' + hash);
+      if (isBrowser) {
+        window.history.replaceState(null, '', window.location.href.split('#')[0] + '#' + hash);
+      }
       return;
     }
     this.causedHashChange = true;
-    window.location.hash = hash;
+    if (isBrowser) {
+      window.location.hash = hash;
+    }
   }
 }
 

diff --git a/src/services/MarkdownRenderer.ts b/src/services/MarkdownRenderer.ts
@@ -3,7 +3,7 @@ import * as Remarkable from 'remarkable';
 import { MDComponent } from '../components/Markdown/Markdown';
 import { IMenuItem, SECTION_ATTR } from './MenuStore';
 import { GroupModel } from './models';
-import { highlight } from '../utils';
+import { highlight, html2Str } from '../utils';
 
 const md = new Remarkable('default', {
   html: true,
@@ -64,13 +64,6 @@ export class MarkdownRenderer {
   attachHeadingsContent(rawText: string) {
     const buildRegexp = heading => new RegExp(`<h\\d ${SECTION_ATTR}="section/${heading.id}">`);
 
-    const tmpEl = document.createElement('DIV');
-
-    const html2Str = html => {
-      tmpEl.innerHTML = html;
-      return tmpEl.innerText;
-    };
-
     let flatHeadings = this.flattenHeadings(this.headings);
     if (flatHeadings.length < 1) return;
     let prevHeading = flatHeadings[0];