Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

React 16 does not render text area placeholder initially in IE11 Win10 #11172

Closed
curwen opened this issue Oct 10, 2017 · 9 comments · Fixed by #11177
Closed

React 16 does not render text area placeholder initially in IE11 Win10 #11172

curwen opened this issue Oct 10, 2017 · 9 comments · Fixed by #11177

Comments

@curwen
Copy link

curwen commented Oct 10, 2017

Bug

What is the current behavior?

IE11 Windows 10 text area placeholder not rendering initially.
https://jsfiddle.net/fztx6vqp/

What is the expected behavior?

Placeholder should be visible on initial render.

Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?

16.0.0, IE11, Windows 10
Appears to be a regression in 16.0.0 - #6731

@gaearon
Copy link
Collaborator

gaearon commented Oct 10, 2017

We’ll need somebody else confirming that this reproduces in 16 and doesn’t reproduce in 15.6.1.

@aweary
Copy link
Contributor

aweary commented Oct 10, 2017

I verified that the provided example using 16 does not render in IE11 on Windows 10, but it does render using this example with 15.6.2.

@gaearon
Copy link
Collaborator

gaearon commented Oct 10, 2017

Any idea what’s going on?

@gaearon
Copy link
Collaborator

gaearon commented Oct 10, 2017

Here's all matches of placeholder logic I can find in 15:

// initial value. In IE10/IE11 there is a bug where the placeholder attribute

// Avoid setting textContent when the text is empty. In IE11 setting
// textContent on a text area will cause the placeholder to not
// show within the textarea until it has been focused and blurred again.
// https://github.com/facebook/react/issues/6731#issuecomment-254874553
if (contentToUse !== '') {
if (__DEV__) {
setAndValidateContentChildDev.call(this, contentToUse);
}
DOMLazyTree.queueText(lazyTree, contentToUse);
}
(probably this one?)

@gaearon
Copy link
Collaborator

gaearon commented Oct 10, 2017

@aweary You’ll take this?

@aweary aweary self-assigned this Oct 10, 2017
@aweary
Copy link
Contributor

aweary commented Oct 10, 2017

(probably this one?)

@gaearon it looks like the same issue, focusing and blurring causes the placeholder to show again, which is the same behavior I saw the first time. Looking into it now.

@gaearon
Copy link
Collaborator

gaearon commented Oct 10, 2017

Can you check if #11177 fixes it?

@aweary
Copy link
Contributor

aweary commented Oct 10, 2017

@gaearon I was just stepping through it and found that same call site 😄 I verified that is the reason the textContent is being set, let me build locally and verify the fix.

@gaearon
Copy link
Collaborator

gaearon commented Nov 3, 2017

React 16.1.0-beta has been released. Please update react, react-dom, and react-test-renderer (if you use it) to this version and let us know if it solved the issue! We’d appreciate if you could test before Monday when we plan to get 16.1.0 out.

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

Successfully merging a pull request may close this issue.

3 participants