Edge's extension layer is incompatible with React

Confirmed Issue #9127566 • Assigned to Scott S.

Details

Author
Richard F.
Created
Sep 29, 2016
Privacy
This issue is public.
Found in
  • Microsoft Edge
Found in build #
14.14393
Reports
Reported by 1 person

Sign in to watch or report this issue.

Steps to reproduce

<form> elements (and maybe others) only provide read-only access to their attributes. This fundamentally conflicts with a core part of React’s functionality, causing our extension to be basically unusable. Reproduction steps for the issue follow:

formEl = document.createElement('form'); // create a <form> to mutate
formEl.foo = {};
formEl.foo.bar = 'baz'; // attempt to mutate the `foo` attribute
console.log(formEl.foo.bar); // will log 'baz' in all browsers including Edge, except in Edge's&nbsp;extension context where it's undefined

This is a problem because React internally creates links from its virtual DOM nodes to their respective actual DOM nodes, in both directions. When rendering a <form /> in React, there is a call to a method called precacheNode (line 47 of the file linked below) which sets an attribute on the DOM node that points to the React object. The problem arises because the statement to set that attribute fails silently, and the link isn’t set up. Specifically, if in the React source code after line 47 you were to log hostInst, you’d find that it references the expected object, but node[internalInstanceKey] is still undefined. This causes React to fail to render, update, etc.

https://github.com/facebook/react/blob/v15.3.2/src/renderers/dom/client/ReactDOMComponentTree.js#L47

Attachments

0 attachments

    Comments and activity

    • Sorry, the first word of this issue should read elements (and maybe others) only provide read-only access to their attributes but the html was removed.

    • Damn why isn’t there a way to edit a post? FORM ELEMENTS ARE THE BROKEN ONES

    • Also, “When rendering a in React” should be “When rendering a form in React”

    • Microsoft Edge Team

      Changed Assigned To to “Brad E.”

      Changed Assigned To to “Sermet I.”

      Changed Assigned To from “Sermet I.” to “Brad E.”

      Changed Assigned To to “Sermet I.”

      Changed Assigned To from “Sermet I.” to “Scott L.”

      Changed Status to “Confirmed”

      Changed Assigned To from “Scott L.” to “Scott S.”

    • This has bounced around a bunch. Is it assigned for resolution? Thanks

    You need to sign in to your Microsoft account to add a comment.

    Sign in