Skip to content

Modal AutoFocus broken with React 16 because of render unstable changes #532

@virgofx

Description

@virgofx

Rendering a Modal component with defaults fails in React 16 with:

Uncaught TypeError: Cannot read property 'parentNode' of undefined

The root cause is because the Modal's autoFocus is attempting to reference the this._dialog which is set via callback and does not exist as result of changes made in unstable_renderSubtreeIntoContainer.

Reference: facebook/react#10309

  • Reactstrap: 4.8.0
  • React: 16.0.0-beta.3
  • Components: Modal

Steps to reproduce issue

  1. Specify a new Modal component with no autoFocus attribute or autoFocus={true}

Demonstration

https://www.webpackbin.com/bins/-Kr2BOnFO9GcE691BLYr

To toggle the error adjust the autoFocus property (Setting to false removes error)
<Modal isOpen={true} autoFocus={true}>

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions