Placeholder is selectable and prevents paste in IE 11

Do you want to request a feature or report a bug?

bug

What’s the current behavior?

Using IE 11, the text of the placeholder can be selected and if the cursor is placed somewhere else than at the beginning of the placeholder text, it is not possible to paste (using shortcut or context menu).

Tested with the rich-text example http://slatejs.org/#/rich-text in IE11 on Windows 7 and Windows 10.

What’s the expected behavior?

The placeholder can not be selected and the cursor can not be placed somewhere within the placeholder text, preventing the user from pasting.

Research / Workaround

In slate, there is an editor element with contenteditable set to true. It contains the placeholder as a child which has contenteditableset to false.

The HTML5 specs say: a contenteditable=false element within a contenteditable=true element is not editable.

I discovered that IE 11 seems to have a somewhat weird interpretation of the spec and does it the other way round: only child elements with contenteditable=true are not editable.

I tried to fix that issue by setting the placeholder element tocontenteditable=false but that introduces some other weird behaviour.

My current workaround is to provide an own placeholder component that is placed as a sibling to the editor component. The downside is that I have to reimplement the show/hide logic.

[brendancarney]

Appears to be fixed:

[kudlajz]

@ianstormtaylor We’re using version 0.33.4 and the problem still persists 😞