add render component extension point

[EdmondChuiHW]

Summary

Add extension point to delegate component rendering to an override-able function, similar to getConstructor. Also add callback to component unmount

This allows custom implementations that renders parent wrapper components, e.g.

function renderWithContext(renderFunctionName, component, node, props) {
  const contextObj = JSON.parse(node.getAttribute("data-context-object"));

  ReactDOM.render(
    <SomeReactContext.Provider value={contextObj}>
      {component}
    </SomeReactContext.Provider>,
    node,
  )
}

Hot reloading

Built-in support for hot reloading 🔥 would also be added via this extension point. See this PR: https://github.com/reactjs/react-rails/pull/1065

Stack-ability

It is also (optionally) designed to be "stackable". Allowing conditional overrides based on env var or any arbitrary boolean:

const baseRender = ReactRailsUJS.renderComponent;
ReactRailsUJS.renderComponent =(renderFunctionName, component, node, props) => {
  const contextObj = JSON.parse(node.getAttribute("data-context-object"));

  baseRender(
    renderFunctionName,
    <SomeReactContext.Provider value={contextObj}>
      {component}
    </SomeReactContext.Provider>,
    node,
    props,
  )
}

in another file:

if (!isDev()) return;

const baseRender = ReactRailsUJS.renderComponent;
ReactRailsUJS.renderComponent =(renderFunctionName, component, node, props) => {
  const hotReloadedComponent = /* == hot reload logic == */;

  baseRender(
    renderFunctionName,
    hotReloadedComponent,
    node,
    props,
  )
}

In the above example, the final render "stack" should look like:

// in dev:
HotReloadWrappers
  ContextProviders
    OriginalComponent

// in prod:
ContextProviders
  OriginalComponent

Other Information

Inline comments have been added to discusses options considered and their tradeoffs.

Also uncertain on how to fix the Travis CI build error

[BookOfGreg]

This is looking good, I'll need some time to check compatibility of this with existing codebases and I may look at adding tests. All tests in Travis pass except Webpack 4, could be a random bug specific to that set of builds. The accompanying docs/comments read well and thank you for that.

[souporserious]

Any status on this? Would love to have something more first-class like this for wrapping top-level components!

[justin808]

@EdmondChuiHW, @souporserious given the discussion on #982, do you agree that this PR is no longer needed?

If you think it's still useful, please request to reopen this.