Initial commit (#12624)
This is the first step - pulling the ReactDOMFrameScheduling module out into a separate package. Co-authored-by: Brandon Dail <aweary@users.noreply.github.com>
Flarnie Marchan committed
Apr 19, 2018 at 09:29 UTC
999b656ed1c94b00fcfd043f54e18ade7553dee0
9 files changed
+113
-7
packages/react-art/src/ReactART.js
+3
-3
@@ -7,7 +7,7 @@
7
8
import React from 'react';
9
import ReactFiberReconciler from 'react-reconciler';
10
-import * as ReactDOMFrameScheduling from 'shared/ReactDOMFrameScheduling';
10
+import * as ReactScheduler from 'react-scheduler';
11
import Mode from 'art/modes/current';
12
import FastNoSideEffects from 'art/modes/fast-noSideEffects';
13
import Transform from 'art/core/transform';
@@ -468,7 +468,7 @@ const ARTRenderer = ReactFiberReconciler({
468
return emptyObject;
469
},
470
471
- scheduleDeferredCallback: ReactDOMFrameScheduling.rIC,
471
+ scheduleDeferredCallback: ReactScheduler.rIC,
472
473
shouldSetTextContent(type, props) {
474
return (
@@ -476,7 +476,7 @@ const ARTRenderer = ReactFiberReconciler({
476
);
477
},
478
479
- now: ReactDOMFrameScheduling.now,
479
+ now: ReactScheduler.now,
480
481
mutation: {
482
appendChild(parentInstance, child) {
packages/react-dom/src/__tests__/ReactDOM-test.js
+35
@@ -439,4 +439,39 @@ describe('ReactDOM', () => {
439
Object.defineProperty(global, 'document', documentDescriptor);
440
}
441
});
442
+
443
+ it('warns when requestAnimationFrame is not polyfilled in the browser', () => {
444
+ const previousRAF = global.requestAnimationFrame;
445
+ try {
446
+ global.requestAnimationFrame = undefined;
447
+ jest.resetModules();
448
+ expect(() => require('react-dom')).toWarnDev(
449
+ 'React depends on requestAnimationFrame.',
450
+ );
451
+ } finally {
452
+ global.requestAnimationFrame = previousRAF;
453
+ }
454
+ });
455
+
456
+ // We're just testing importing, not using it.
457
+ // It is important because even isomorphic components may import it.
458
+ it('can import findDOMNode in Node environment', () => {
459
+ const previousRAF = global.requestAnimationFrame;
460
+ const previousRIC = global.requestIdleCallback;
461
+ const prevWindow = global.window;
462
+ try {
463
+ global.requestAnimationFrame = undefined;
464
+ global.requestIdleCallback = undefined;
465
+ // Simulate the Node environment:
466
+ delete global.window;
467
+ jest.resetModules();
468
+ expect(() => {
469
+ require('react-dom');
470
+ }).not.toThrow();
471
+ } finally {
472
+ global.requestAnimationFrame = previousRAF;
473
+ global.requestIdleCallback = previousRIC;
474
+ global.window = prevWindow;
475
+ }
476
+ });
477
});
packages/react-dom/src/client/ReactDOM.js
+4
-4
@@ -29,7 +29,7 @@ import * as EventPluginRegistry from 'events/EventPluginRegistry';
29
import * as EventPropagators from 'events/EventPropagators';
30
import * as ReactInstanceMap from 'shared/ReactInstanceMap';
31
import ReactVersion from 'shared/ReactVersion';
32
-import * as ReactDOMFrameScheduling from 'shared/ReactDOMFrameScheduling';
32
+import * as ReactScheduler from 'react-scheduler';
33
import {ReactCurrentOwner} from 'shared/ReactGlobalSharedState';
34
import getComponentName from 'shared/getComponentName';
35
import invariant from 'fbjs/lib/invariant';
@@ -688,7 +688,7 @@ const DOMRenderer = ReactFiberReconciler({
688
return textNode;
689
},
690
691
- now: ReactDOMFrameScheduling.now,
691
+ now: ReactScheduler.now,
692
693
mutation: {
694
commitMount(
@@ -984,8 +984,8 @@ const DOMRenderer = ReactFiberReconciler({
984
},
985
},
986
987
- scheduleDeferredCallback: ReactDOMFrameScheduling.rIC,
988
- cancelDeferredCallback: ReactDOMFrameScheduling.cIC,
987
+ scheduleDeferredCallback: ReactScheduler.rIC,
988
+ cancelDeferredCallback: ReactScheduler.cIC,
989
});
990
991
ReactGenericBatching.injection.injectRenderer(DOMRenderer);
packages/react-scheduler/README.md
new
+4
@@ -0,0 +1,4 @@
1
+# React Scheduler
2
+
3
+This is a work in progress - we are building a utility to better coordinate
4
+React and other JavaScript work.
packages/react-scheduler/index.js
new
+12
@@ -0,0 +1,12 @@
1
+/**
2
+ * Copyright (c) 2013-present, Facebook, Inc.
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ *
7
+ * @flow
8
+ */
9
+
10
+'use strict';
11
+
12
+export * from './src/ReactScheduler';
packages/react-scheduler/npm/index.js
new
+7
@@ -0,0 +1,7 @@
1
+'use strict';
2
+
3
+if (process.env.NODE_ENV === 'production') {
4
+ module.exports = require('./cjs/react-scheduler.production.min.js');
5
+} else {
6
+ module.exports = require('./cjs/react-scheduler.development.js');
7
+}
packages/react-scheduler/package.json
new
+23
@@ -0,0 +1,23 @@
1
+{
2
+ "name": "react-scheduler",
3
+ "version": "0.1.0-alpha-1",
4
+ "private": true,
5
+ "description": "unstable scheduling helper for coordinating React and other JS libraries",
6
+ "main": "index.js",
7
+ "repository": "facebook/react",
8
+ "license": "MIT",
9
+ "keywords": [
10
+ "react"
11
+ ],
12
+ "bugs": {
13
+ "url": "https://github.com/facebook/react/issues"
14
+ },
15
+ "homepage": "https://reactjs.org/",
16
+ "files": [
17
+ "LICENSE",
18
+ "README.md",
19
+ "index.js",
20
+ "cjs/",
21
+ "umd/"
22
+ ]
23
+}
packages/react-scheduler/src/ReactScheduler.js
renamed
+15
@@ -7,6 +7,21 @@
7
* @flow
8
*/
9
10
+'use strict';
11
+
12
+/**
13
+ * A scheduling library to allow scheduling work with more granular priority and
14
+ * control than requestAnimationFrame and requestIdleCallback.
15
+ * Current TODO items:
16
+ * X- Pull out the rIC polyfill built into React
17
+ * - Initial test coverage
18
+ * - Support for multiple callbacks
19
+ * - Support for two priorities; serial and deferred
20
+ * - Better test coverage
21
+ * - Better docblock
22
+ * - Polish documentation, API
23
+ */
24
+
25
// This is a built-in polyfill for requestIdleCallback. It works by scheduling
26
// a requestAnimationFrame, storing the time for the start of the frame, then
27
// scheduling a postMessage which gets scheduled after paint. Within the
scripts/rollup/bundles.js
+10
@@ -351,6 +351,16 @@ const bundles = [
351
global: 'createSubscription',
352
externals: ['react'],
353
},
354
+
355
+ /******* React Scheduler (experimental) *******/
356
+ {
357
+ label: 'react-scheduler',
358
+ bundleTypes: [NODE_DEV, NODE_PROD, UMD_DEV, UMD_PROD],
359
+ moduleType: ISOMORPHIC,
360
+ entry: 'react-scheduler',
361
+ global: 'ReactScheduler',
362
+ externals: [],
363
+ },
364
];
365
366
// Based on deep-freeze by substack (public domain)