jridgewell / babel-plugin-transform-incremental-dom

Turn JSX into IncrementalDOM
MIT License
144 stars 12 forks source link

JSX in later sibling function should not be Root JSX Node #14

Closed jridgewell closed 9 years ago

jridgewell commented 9 years ago

Re: https://github.com/babel-plugins/babel-plugin-incremental-dom/issues/13#issuecomment-142370595

Currently, we traverse up the tree from a root JSX node to determine if there are higher level JSX nodes:

function render() {
  function fn() {
    // This is a non-root node
    return <other />;
  }

  // This is the "root" node
  return <root>{fn()}</root>
}

// - - -
// Pseudocode

function render() {
  function fn() {
    return jsxWrapper(function() {
      return elementVoid('other');
    };
  }

  // This is the "root" node
  elementOpen('root');
  renderArbitrary(fn());
  return elementClose('root');
}

It should only determine JSX nodes that appear later in the same function, or in parent functions, as the root node. Meaning, sibling functions can both contain root nodes:

function fn() {
  // This is a root node
  return <root />;
}

function fn2() {
  // This is also a root node
  return <root2></root2>
}

But currently, fn will detect fn2 as having the root node, and will wrap it's element in a JSX wrapper... :frowning: