Fail to render input in a separate window on Edge

[haojy]

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

What is the current behavior? On Edge, when to render any components in a separate window, it comes to react-dom error for <input>, and JS error like

SCRIPT5673: Unknown runtime error

**If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem.

window.open dose not work well on JSFiddle or CodeSandbox, so put a page link to reproduce the behavior

https://haojy.github.io/issues/input-error-in-separate-window.html

What is the expected behavior?

<input> component should be rendered as expected without errors

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

React: v16.6.3 and V16.3.0 browser:

• only on Edge v42
• works well on IE 11/Chrome 70/Safari 12

[nikparo]

We are seeing this issue as well. The issue is still present with Edge 44.18362.387.0 and react / react-dom 16.8.4 and 16.11.0.

This issue seems highly related to https://github.com/facebook/react/issues/11768, especially since the line that throws the error per my investigation is the first Object.defineProperty targeted by the fix for it: https://github.com/facebook/react/pull/11870/files

Seemingly the bug in Edge has grown more severe and the above fix is no longer enough...

[nikparo]

Edit: I was confused by the result of getOwnPropertyDescriptor being different when logged to the console than what it is during the function call.

---

~~It seems that Object.getOwnPropertyDescriptor(node.constructor.prototype, ...);~~ fails if node and Object are part of different windows. (function trackValueOnNode in inputValueTracking.js

~~The returned value is { 0: "<Object doesn't support property or method 'Symbol.iterator'>"}~~

On the other hand, if we redefine Object the rest of the code works:

const Object = node.ownerDocument.defaultView.Object;

const descriptor = Object.getOwnPropertyDescriptor(
  node.constructor.prototype,
  valueField,
);

[nikparo]

After a bit more testing, it seems that Object.defineProperty is indeed at the core of the issue, as it's enough to use the external window's Object for that one line.

inputValueTracking.js:

node.ownerDocument.defaultView.Object.defineProperty(node, valueField, {
  configurable: true,
  get: function() {
    return get.call(this);
  },
  set: function(value) {
    currentValue = '' + value;
    set.call(this, value);
  },
});

[jimwash]

I've run into this issue also, are there plans to release a fix for it?

[PKBadiger]

Facing above issue in my project. could you please let us know in which release the fix will be available ?

Below are the versions which I am using in my project: "react": "^16.8.6", "react-dom": "^16.8.6",

[PhilipJohnBasile]

Since IE is not supported anymore we should close this.

[nikparo]

Whether IE is supported doesn’t seem relevant since this was a (mislabelled?) Edge issue. However, chances are it went away when Edge became chromium based in 2020.