v15-rc1 seems to skip some text nodes in IE #6246

Closed
heapx opened this Issue Mar 11, 2016 · 6 comments

Comments

Projects
None yet
6 participants
@heapx

heapx commented Mar 11, 2016

The following

var Hello = React.createClass({
  render: function() {
    return <div><p>Hello</p>test</div>;
  }
});

results in only "Hello" being written in IE11 - jsfiddle

I realize there has been some changes to the way text nodes work in v15, but before we update our code to use <span>, I wanted to check if this is the intended behavior (since "test" is written in chrome).

@syranide

This comment has been minimized.

Show comment
Hide comment
@syranide

syranide Mar 11, 2016

Contributor

This is certainly a bug. cc @spicyj @zpao

Contributor

syranide commented Mar 11, 2016

This is certainly a bug. cc @spicyj @zpao

@gaearon

This comment has been minimized.

Show comment
Hide comment
@gaearon

gaearon Mar 11, 2016

Member

I can reproduce it in IE11.
Edge seems fine though.

Member

gaearon commented Mar 11, 2016

I can reproduce it in IE11.
Edge seems fine though.

@dittos

This comment has been minimized.

Show comment
Hide comment
@dittos

dittos Mar 11, 2016

Contributor

It seems that DOMLazyTree having different behaviour on IE causes this bug. (also reproduced in Edge)

Contributor

dittos commented Mar 11, 2016

It seems that DOMLazyTree having different behaviour on IE causes this bug. (also reproduced in Edge)

@dittos

This comment has been minimized.

Show comment
Hide comment
@dittos

dittos Mar 11, 2016

Contributor

Every text node is skipped. (minimal repro case: jsfiddle)

A ReactDOMTextComponent returns DOMLazyTree something like:

{
    node: DocumentFragment,
    children: [
        { node: Comment },
        { node: Text },
        { node: Comment }
    ]
}

Then DocumentFragment is inserted into the parent element before the children are added to the fragment, so nothing is rendered.

Contributor

dittos commented Mar 11, 2016

Every text node is skipped. (minimal repro case: jsfiddle)

A ReactDOMTextComponent returns DOMLazyTree something like:

{
    node: DocumentFragment,
    children: [
        { node: Comment },
        { node: Text },
        { node: Comment }
    ]
}

Then DocumentFragment is inserted into the parent element before the children are added to the fragment, so nothing is rendered.

@sophiebits

This comment has been minimized.

Show comment
Hide comment
@sophiebits

sophiebits Mar 11, 2016

Member

Darn it, I remember considering this a few months back but must have forgotten. Easiest solution might be to treat document fragments specially in DOMLazyTree but I'm open to other ideas.

cc @mwiencek if you're interested

Member

sophiebits commented Mar 11, 2016

Darn it, I remember considering this a few months back but must have forgotten. Easiest solution might be to treat document fragments specially in DOMLazyTree but I'm open to other ideas.

cc @mwiencek if you're interested

@zpao

This comment has been minimized.

Show comment
Hide comment
@zpao

zpao Mar 11, 2016

Member

Thanks to everybody for the quick find and reduction! This is exactly how the process should work ♥️

Member

zpao commented Mar 11, 2016

Thanks to everybody for the quick find and reduction! This is exactly how the process should work ♥️

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment