How to detect if inside ReactDOMServer or ReactDOM context

Question

I want to detect if the current component is being rendered by ReactDOM or by ReactDOMServer. The classic canUseDom

const canUseDOM = () => Boolean(
  typeof window !== 'undefined'
  && window.document
  && window.document.createElement
)

won't work, because ReactDOMServer can also be used in a broswer context where window is defined. I want to do something like this:

const MyComponent = () =>
  isRenderedByReactDOM()
    ? (<div>I am being rendered by ReactDOM.render</div>)
    : (<div>I am being rendered by ReactDOMServer.renderToString / ReactDOMServer.renderToStaticMarkup</div>)

David L. Walsh · Accepted Answer · 2016-10-30 23:10:00Z

2

Server side components don't execute componentDidMount(). That's where you should put any purely browser side logic.

answered Oct 30, 2016 at 23:10

David L. Walsh

24.9k10 gold badges63 silver badges50 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

machete Over a year ago

Thanks, I eventually solved it by using a context, similar to the redux provider.

Collectives™ on Stack Overflow

How to detect if inside ReactDOMServer or ReactDOM context

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related