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:
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:
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:
But currently,
fn
will detectfn2
as having the root node, and will wrap it's element in a JSX wrapper... :frowning: