fix(Search): avoid window/document in ssr

src/modules/Search/Search.js

@@ -7,6 +7,7 @@ import {
   customPropTypes,
   getElementType,
   getUnhandledProps,
+  isBrowser,
   keyboardKey,
   makeDebugger,
   META,
@@ -191,6 +192,9 @@ export default class Search extends Component {
     // TODO objectDiff still runs in prod, stop it
     debug('to state:', objectDiff(prevState, this.state))
 
+    // Do not access document when server side rendering
+    if (!isBrowser) return
+
     // focused / blurred
     if (!prevState.focus && this.state.focus) {
       debug('search focused')
@@ -232,6 +236,10 @@ export default class Search extends Component {
 
   componentWillUnmount() {
     debug('componentWillUnmount()')
+
+    // Do not access document when server side rendering
+    if (!isBrowser) return
+
     document.removeEventListener('keydown', this.moveSelectionOnKeyDown)
     document.removeEventListener('keydown', this.selectItemOnEnter)
     document.removeEventListener('keydown', this.closeOnEscape)
@@ -306,12 +314,16 @@ export default class Search extends Component {
     const { onMouseDown } = this.props
     if (onMouseDown) onMouseDown(e)
     this.isMouseDown = true
+    // Do not access document when server side rendering
+    if (!isBrowser) return
     document.addEventListener('mouseup', this.handleDocumentMouseUp)
   }
 
   handleDocumentMouseUp = () => {
     debug('handleDocumentMouseUp()')
     this.isMouseDown = false
+    // Do not access document when server side rendering
+    if (!isBrowser) return
     document.removeEventListener('mouseup', this.handleDocumentMouseUp)
   }
 
@@ -431,6 +443,8 @@ export default class Search extends Component {
 
   scrollSelectedItemIntoView = () => {
     debug('scrollSelectedItemIntoView()')
+    // Do not access document when server side rendering
+    if (!isBrowser) return
     const menu = document.querySelector('.ui.search.active.visible .results.visible')
     const item = menu.querySelector('.result.active')
     debug(`menu (results): ${menu}`)
@@ -494,7 +508,7 @@ export default class Search extends Component {
       <div className='message empty'>
         <div className='header'>{noResultsMessage}</div>
         {noResultsDescription &&
-          <div className='description'>{noResultsDescription}</div>
+        <div className='description'>{noResultsDescription}</div>
         }
       </div>
     )