Skip to content

onBeforeInput fires after Edge updates the DOM #8876

@colinjeanne

Description

@colinjeanne

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

What is the current behavior?
In Edge the onBeforeInput event is fired after Edge has already made changes to the DOM negating the purpose of the event and breaking the assumptions of components built on this event, such as Draft.

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem via https://jsfiddle.net or similar (template: https://jsfiddle.net/reactjs/69z2wepo/).
https://jsfiddle.net/max_winderbaum/yv38s3xe/3/ demonstrates the issue in general but to see the effects on other components consider these steps

  1. Go to https://facebook.github.io/draft-js
  2. Type hello world
  3. Bold hello
  4. Underline the space between the words
  5. Select both hello and the space and press a
  6. The entire control's text is replaced with a
  7. Hit undo several times to observe further broken states until finally React fails with a NotFoundError in removeChild

This issue is opened in Draft because the core issue is that onBeforeInput is misbehaving on Edge and so breaks Draft's assumptions.

What is the expected behavior?

onBeforeInput should fire before any changes occur in the DOM

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

This repros in the latest version of Draft.

The root cause here is the same root cause as in #7269, although that issue no longer repros. The fix referenced in that issue, #7270, fixes this issue as well.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions