Merge branch 'master' of https://github.com/facebook/react into hide_…

…portal_container
facebook · Oct 2, 2019 · e31a360 · e31a360
2 parents df5d478 + 10277cc
commit e31a360
Show file tree

Hide file tree

Showing 141 changed files with 3,347 additions and 633 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -6,6 +6,33 @@
   </summary>
 </details>
 
+## 16.10.1 (September 28, 2019)
+
+### React DOM
+
+* Fix regression in Next.js apps by allowing Suspense mismatch during hydration to silently proceed ([@sebmarkbage](https://github.com/sebmarkbage) in [#16943](https://github.com/facebook/react/pull/16943))
+
+## 16.10.0 (September 27, 2019)
+
+### React DOM
+
+* Fix edge case where a hook update wasn't being memoized. ([@sebmarkbage](http://github.com/sebmarkbage) in [#16359](https://github.com/facebook/react/pull/16359))
+* Fix heuristic for determining when to hydrate, so we don't incorrectly hydrate during an update. ([@sebmarkbage](http://github.com/sebmarkbage) in [#16739](https://github.com/facebook/react/pull/16739))
+* Clear additional fiber fields during unmount to save memory. ([@trueadm](http://github.com/trueadm) in [#16807](https://github.com/facebook/react/pull/16807))
+* Fix bug with required text fields in Firefox. ([@halvves](http://github.com/halvves) in [#16578](https://github.com/facebook/react/pull/16578))
+* Prefer `Object.is` instead of inline polyfill, when available. ([@ku8ar](http://github.com/ku8ar) in [#16212](https://github.com/facebook/react/pull/16212))
+* Fix bug when mixing Suspense and error handling. ([@acdlite](http://github.com/acdlite) in [#16801](https://github.com/facebook/react/pull/16801))
+
+
+### Scheduler (Experimental)
+
+* Improve queue performance by switching its internal data structure to a min binary heap. ([@acdlite](http://github.com/acdlite) in [#16245](https://github.com/facebook/react/pull/16245))
+* Use `postMessage` loop with short intervals instead of attempting to align to frame boundaries with `requestAnimationFrame`. ([@acdlite](http://github.com/acdlite) in [#16214](https://github.com/facebook/react/pull/16214))
+
+### useSubscription
+
+* Avoid tearing issue when a mutation happens and the previous update is still in progress. ([@bvaughn](http://github.com/bvaughn) in [#16623](https://github.com/facebook/react/pull/16623))
+
 ## 16.9.0 (August 8, 2019)
 
 ### React

diff --git a/fixtures/dom/src/components/fixtures/mouse-events/index.js b/fixtures/dom/src/components/fixtures/mouse-events/index.js
@@ -1,5 +1,6 @@
 import FixtureSet from '../../FixtureSet';
 import MouseMovement from './mouse-movement';
+import MouseEnter from './mouse-enter';
 
 const React = window.React;
 
@@ -8,6 +9,7 @@ class MouseEvents extends React.Component {
     return (
       <FixtureSet title="Mouse Events">
         <MouseMovement />
+        <MouseEnter />
       </FixtureSet>
     );
   }

diff --git a/fixtures/dom/src/components/fixtures/mouse-events/mouse-enter.js b/fixtures/dom/src/components/fixtures/mouse-events/mouse-enter.js
@@ -0,0 +1,73 @@
+import TestCase from '../../TestCase';
+
+const React = window.React;
+const ReactDOM = window.ReactDOM;
+
+const MouseEnter = () => {
+  const containerRef = React.useRef();
+
+  React.useEffect(function() {
+    const hostEl = containerRef.current;
+    ReactDOM.render(<MouseEnterDetect />, hostEl, () => {
+      ReactDOM.render(<MouseEnterDetect />, hostEl.childNodes[1]);
+    });
+  }, []);
+
+  return (
+    <TestCase
+      title="Mouse Enter"
+      description=""
+      affectedBrowsers="Chrome, Safari, Firefox">
+      <TestCase.Steps>
+        <li>Mouse enter the boxes below, from different borders</li>
+      </TestCase.Steps>
+      <TestCase.ExpectedResult>
+        Mouse enter call count should equal to 1; <br />
+        Issue{' '}
+        <a
+          rel="noopener noreferrer"
+          target="_blank"
+          href="https://github.com/facebook/react/issues/16763">
+          #16763
+        </a>{' '}
+        should not happen.
+        <br />
+      </TestCase.ExpectedResult>
+      <div ref={containerRef} />
+    </TestCase>
+  );
+};
+
+const MouseEnterDetect = () => {
+  const [log, setLog] = React.useState({});
+  const firstEl = React.useRef();
+  const siblingEl = React.useRef();
+
+  const onMouseEnter = e => {
+    const timeStamp = e.timeStamp;
+    setLog(log => {
+      const callCount = 1 + (log.timeStamp === timeStamp ? log.callCount : 0);
+      return {
+        timeStamp,
+        callCount,
+      };
+    });
+  };
+
+  return (
+    <React.Fragment>
+      <div
+        ref={firstEl}
+        onMouseEnter={onMouseEnter}
+        style={{
+          border: '1px solid #d9d9d9',
+          padding: '20px 20px',
+        }}>
+        Mouse enter call count: {log.callCount || ''}
+      </div>
+      <div ref={siblingEl} />
+    </React.Fragment>
+  );
+};
+
+export default MouseEnter;
diff --git a/packages/create-subscription/package.json b/packages/create-subscription/package.json
@@ -1,7 +1,7 @@
 {
   "name": "create-subscription",
   "description": "utility for subscribing to external data sources inside React components",
-  "version": "16.9.0",
+  "version": "16.10.1",
   "repository": {
     "type": "git",
     "url": "https://github.com/facebook/react.git",

diff --git a/packages/eslint-plugin-react-hooks/package.json b/packages/eslint-plugin-react-hooks/package.json
@@ -1,7 +1,7 @@
 {
   "name": "eslint-plugin-react-hooks",
   "description": "ESLint rules for React Hooks",
-  "version": "2.0.1",
+  "version": "2.1.1",
   "repository": {
     "type": "git",
     "url": "https://github.com/facebook/react.git",

diff --git a/packages/jest-react/package.json b/packages/jest-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "jest-react",
-  "version": "0.7.0",
+  "version": "0.8.1",
   "description": "Jest matchers and utilities for testing React components.",
   "main": "index.js",
   "repository": {

diff --git a/packages/legacy-events/EventPluginHub.js b/packages/legacy-events/EventPluginHub.js
@@ -132,10 +132,10 @@ export function getListener(inst: Fiber, registrationName: string) {
  */
 function extractPluginEvents(
   topLevelType: TopLevelType,
-  eventSystemFlags: EventSystemFlags,
   targetInst: null | Fiber,
   nativeEvent: AnyNativeEvent,
   nativeEventTarget: EventTarget,
+  eventSystemFlags: EventSystemFlags,
 ): Array<ReactSyntheticEvent> | ReactSyntheticEvent | null {
   let events = null;
   for (let i = 0; i < plugins.length; i++) {
@@ -144,10 +144,10 @@ function extractPluginEvents(
     if (possiblePlugin) {
       const extractedEvents = possiblePlugin.extractEvents(
         topLevelType,
-        eventSystemFlags,
         targetInst,
         nativeEvent,
         nativeEventTarget,
+        eventSystemFlags,
       );
       if (extractedEvents) {
         events = accumulateInto(events, extractedEvents);
@@ -159,17 +159,17 @@ function extractPluginEvents(
 
 export function runExtractedPluginEventsInBatch(
   topLevelType: TopLevelType,
-  eventSystemFlags: EventSystemFlags,
   targetInst: null | Fiber,
   nativeEvent: AnyNativeEvent,
   nativeEventTarget: EventTarget,
+  eventSystemFlags: EventSystemFlags,
 ) {
   const events = extractPluginEvents(
     topLevelType,
-    eventSystemFlags,
     targetInst,
     nativeEvent,
     nativeEventTarget,
+    eventSystemFlags,
   );
   runEventsInBatch(events);
 }
diff --git a/packages/legacy-events/PluginModuleType.js b/packages/legacy-events/PluginModuleType.js
@@ -25,10 +25,10 @@ export type PluginModule<NativeEvent> = {
   eventTypes: EventTypes,
   extractEvents: (
     topLevelType: TopLevelType,
-    eventSystemFlags: EventSystemFlags,
     targetInst: null | Fiber,
     nativeTarget: NativeEvent,
     nativeEventTarget: EventTarget,
+    eventSystemFlags: EventSystemFlags,
   ) => ?ReactSyntheticEvent,
   tapMoveThreshold?: number,
 };
diff --git a/packages/legacy-events/ResponderEventPlugin.js b/packages/legacy-events/ResponderEventPlugin.js
@@ -504,10 +504,10 @@ const ResponderEventPlugin = {
    */
   extractEvents: function(
     topLevelType,
-    eventSystemFlags,
     targetInst,
     nativeEvent,
     nativeEventTarget,
+    eventSystemFlags,
   ) {
     if (isStartish(topLevelType)) {
       trackedTouchCount += 1;

diff --git a/packages/legacy-events/__tests__/ResponderEventPlugin-test.internal.js b/packages/legacy-events/__tests__/ResponderEventPlugin-test.internal.js
@@ -314,10 +314,10 @@ const run = function(config, hierarchyConfig, nativeEventConfig) {
   // Trigger the event
   const extractedEvents = ResponderEventPlugin.extractEvents(
     nativeEventConfig.topLevelType,
-    PLUGIN_EVENT_SYSTEM,
     nativeEventConfig.targetInst,
     nativeEventConfig.nativeEvent,
     nativeEventConfig.target,
+    PLUGIN_EVENT_SYSTEM,
   );
 
   // At this point the negotiation events have been dispatched as part of the

diff --git a/packages/react-art/package.json b/packages/react-art/package.json
@@ -1,7 +1,7 @@
 {
   "name": "react-art",
   "description": "React ART is a JavaScript library for drawing vector graphics using React. It provides declarative and reactive bindings to the ART library. Using the same declarative API you can render the output to either Canvas, SVG or VML (IE8).",
-  "version": "16.9.0",
+  "version": "16.10.1",
   "main": "index.js",
   "repository": {
     "type": "git",
@@ -27,7 +27,7 @@
     "loose-envify": "^1.1.0",
     "object-assign": "^4.1.1",
     "prop-types": "^15.6.2",
-    "scheduler": "^0.15.0"
+    "scheduler": "^0.16.1"
   },
   "peerDependencies": {
     "react": "^16.0.0"

diff --git a/packages/react-devtools-core/package.json b/packages/react-devtools-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-devtools-core",
-  "version": "4.1.0",
+  "version": "4.1.3",
   "description": "Use react-devtools outside of the browser",
   "license": "MIT",
   "main": "./dist/backend.js",

diff --git a/packages/react-devtools-extensions/chrome/manifest.json b/packages/react-devtools-extensions/chrome/manifest.json
@@ -2,8 +2,8 @@
   "manifest_version": 2,
   "name": "React Developer Tools",
   "description": "Adds React debugging tools to the Chrome Developer Tools.",
-  "version": "4.1.0",
-  "version_name": "4.1.0",
+  "version": "4.1.3",
+  "version_name": "4.1.3",
 
   "minimum_chrome_version": "49",
 

diff --git a/packages/react-devtools-extensions/firefox/manifest.json b/packages/react-devtools-extensions/firefox/manifest.json
@@ -2,7 +2,7 @@
   "manifest_version": 2,
   "name": "React Developer Tools",
   "description": "Adds React debugging tools to the Firefox Developer Tools.",
-  "version": "4.1.0",
+  "version": "4.1.3",
 
   "applications": {
     "gecko": {

diff --git a/packages/react-devtools-extensions/src/inject.js b/packages/react-devtools-extensions/src/inject.js
diff --git a/packages/react-devtools-extensions/src/injectGlobalHook.js b/packages/react-devtools-extensions/src/injectGlobalHook.js
@@ -24,16 +24,20 @@ let lastDetectionResult;
 // So instead, the hook will use postMessage() to pass message to us here.
 // And when this happens, we'll send a message to the "background page".
 window.addEventListener('message', function(evt) {
-  if (
-    evt.source === window &&
-    evt.data &&
-    evt.data.source === 'react-devtools-detector'
-  ) {
+  if (evt.source !== window || !evt.data) {
+    return;
+  }
+  if (evt.data.source === 'react-devtools-detector') {
     lastDetectionResult = {
       hasDetectedReact: true,
       reactBuildType: evt.data.reactBuildType,
     };
     chrome.runtime.sendMessage(lastDetectionResult);
+  } else if (evt.data.source === 'react-devtools-inject-backend') {
+    const script = document.createElement('script');
+    script.src = chrome.runtime.getURL('build/backend.js');
+    document.documentElement.appendChild(script);
+    script.parentNode.removeChild(script);
   }
 });
 

diff --git a/packages/react-devtools-extensions/src/main.js b/packages/react-devtools-extensions/src/main.js
@@ -4,7 +4,6 @@ import {createElement} from 'react';
 import {unstable_createRoot as createRoot, flushSync} from 'react-dom';
 import Bridge from 'react-devtools-shared/src/bridge';
 import Store from 'react-devtools-shared/src/devtools/store';
-import inject from './inject';
 import {
   createViewElementSource,
   getBrowserName,
@@ -135,7 +134,14 @@ function createPanelIfReactLoaded() {
 
         // Initialize the backend only once the Store has been initialized.
         // Otherwise the Store may miss important initial tree op codes.
-        inject(chrome.runtime.getURL('build/backend.js'));
+        chrome.devtools.inspectedWindow.eval(
+          `window.postMessage({ source: 'react-devtools-inject-backend' }, '*');`,
+          function(response, evalError) {
+            if (evalError) {
+              console.error(evalError);
+            }
+          },
+        );
 
         const viewElementSourceFunction = createViewElementSource(
           bridge,
@@ -155,7 +161,7 @@ function createPanelIfReactLoaded() {
               overrideTab,
               profilerPortalContainer,
               showTabBar: false,
-              showWelcomeToTheNewDevToolsDialog: true,
+              warnIfUnsupportedVersionDetected: true,
               store,
               viewElementSourceFunction,
             }),

diff --git a/packages/react-devtools-inline/package.json b/packages/react-devtools-inline/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-devtools-inline",
-  "version": "4.1.0",
+  "version": "4.1.3",
   "description": "Embed react-devtools within a website",
   "license": "MIT",
   "main": "./dist/backend.js",