Skip to content

Commit

Permalink
Mock ReactDOM for Fiber Tests (#7206)
Browse files Browse the repository at this point in the history
We currently write all our tests against the DOM implementation.
I need a way to run the Fiber tests against it. But I don't want
to take on any package dependencies on Fiber modules yet.

There's a problem with jest right now where you can't globally
mock modules that already exist. So I have to add a global call
to jest.mock.

Luckily we already have a way to test the useCreateElement paths
using a feature flag. I won't activate this flag in travis until
it passes, but the idea is to run all three variants in travis.

I'm not sure that invoking rAF and rIC synchronously is the best
way to test this since it doesn't capture the backwards
compatibility aspect. I.e. the fact that people might be relying
on the synchronous nature in real apps too. It's a start.

Ideally, jest would have these built-in.
  • Loading branch information
sebmarkbage authored Aug 11, 2016
1 parent 1f31357 commit c06a68a
Show file tree
Hide file tree
Showing 4 changed files with 31 additions and 0 deletions.
9 changes: 9 additions & 0 deletions scripts/jest/environment.js
Original file line number Diff line number Diff line change
@@ -1,2 +1,11 @@
/* eslint-disable */
global.__DEV__ = true;

// For testing DOM Fiber, we synchronously invoke all the scheduling.
global.requestAnimationFrame = function(callback) {
callback();
};

global.requestIdleCallback = function(callback) {
callback({ timeRemaining() { return Infinity; } });
};
4 changes: 4 additions & 0 deletions scripts/jest/test-framework-setup.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,9 @@
'use strict';

// We want to globally mock this but jest doesn't let us do that by default
// for a file that already exists. So we have to explicitly mock it.
jest.mock('ReactDOM');

var env = jasmine.getEnv();

var callCount = 0;
Expand Down
17 changes: 17 additions & 0 deletions src/renderers/dom/__mocks__/ReactDOM.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
/**
* Copyright 2013-2015, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*/

'use strict';

var ReactDOMFeatureFlags = require('ReactDOMFeatureFlags');

var useFiber = ReactDOMFeatureFlags.useFiber;

module.exports =
useFiber ? require('ReactDOMFiber') : require.requireActual('ReactDOM');
1 change: 1 addition & 0 deletions src/renderers/dom/shared/ReactDOMFeatureFlags.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@

var ReactDOMFeatureFlags = {
useCreateElement: true,
useFiber: false,
};

module.exports = ReactDOMFeatureFlags;

0 comments on commit c06a68a

Please sign in to comment.