We're switching Atom to React, but we want to support backward-compatible shims to our previous view framework.

In the old framework, views were represented as jQuery-wrapped DOM elements. Ideally, we'd like to provide backward-compatible shims by simply rendering the React component and wrapping its root element in a jQuery wrapper with an API that's compatible to our old editor views. That would essentially look like this:

``` javascript
var editorRoot = document.createElement('div')
React.renderComponentWithRootElement(Editor(props), editorRoot)

// the element would actually be wrapped in a custom subclass of jQuery,
// but this is clearer for this example
var editorShim = $(editorRoot) 
```

Currently, this isn't possible because React components need to be rendered into a container. So instead we need to create a wrapper element and render the component inside it. This is sad because it adds an extra layer of markup which confuses styling, and also means that the editor has a wrapper when used via the shim layer but no wrapper when embedded as a child via React itself.

Is there something fundamental preventing React from adopting DOM nodes directly without the parent? Is this something we could even hack in in a way that would be somewhat maintainable?

:heart:

action: A,
  ) {
    invariant(
      this._numberOfReRenders < RE_RENDER_LIMIT,
      'Too many re-renders. React limits the number of renders to prevent ' +
        'an infinite loop.',
    );
    if (componentIdentity === this._currentlyRenderingComponent) {
      
      
      
      this._didScheduleRenderPhaseUpdate = true;
      const update: Update<A> = {
        action,
        next: null,
      };
      let renderPhaseUpdates = this._renderPhaseUpdates;
      if (renderPhaseUpdates === null) {
        this._renderPhaseUpdates = renderPhaseUpdates = new Map();
      }
      const firstRenderPhaseUpdate = renderPhaseUpdates.get(queue);
      if (firstRenderPhaseUpdate === undefined) {
        renderPhaseUpdates.set(queue, update);
      } else {
        
        let lastRenderPhaseUpdate = firstRenderPhaseUpdate;
        while (lastRenderPhaseUpdate.next !== null) {
          lastRenderPhaseUpdate = lastRenderPhaseUpdate.next;
        }
        lastRenderPhaseUpdate.next = update;