refactors/removes stack dependent tests to work with fiber
Dominic Gannaway committed
Feb 28, 2017 at 15:00 UTC
04cd2b2a81f4d6e8a777b8c2585733e00cf9f7a1
5 files changed
+50
-167
src/renderers/__tests__/ReactUpdates-test.js
-34
@@ -14,7 +14,6 @@
14
var React;
15
var ReactDOM;
16
var ReactTestUtils;
17
-var ReactUpdates;
17
var ReactDOMFeatureFlags = require('ReactDOMFeatureFlags');
18
19
describe('ReactUpdates', () => {
@@ -23,7 +22,6 @@ describe('ReactUpdates', () => {
22
ReactDOM = require('ReactDOM');
23
ReactDOMFeatureFlags = require('ReactDOMFeatureFlags');
24
ReactTestUtils = require('ReactTestUtils');
26
- ReactUpdates = require('ReactUpdates');
25
});
26
27
it('should batch state when updating state twice', () => {
@@ -507,38 +505,6 @@ describe('ReactUpdates', () => {
505
);
506
});
507
510
- it('should share reconcile transaction across different roots', () => {
511
- if (ReactDOMFeatureFlags.useFiber) {
512
- return;
513
- }
514
- var ReconcileTransaction = ReactUpdates.ReactReconcileTransaction;
515
- spyOn(ReconcileTransaction, 'getPooled').and.callThrough();
516
-
517
- class Component extends React.Component {
518
- render() {
519
- return <div>{this.props.text}</div>;
520
- }
521
- }
522
-
523
- var containerA = document.createElement('div');
524
- var containerB = document.createElement('div');
525
-
526
- // Initial renders aren't batched together yet...
527
- ReactDOM.unstable_batchedUpdates(function() {
528
- ReactDOM.render(<Component text="A1" />, containerA);
529
- ReactDOM.render(<Component text="B1" />, containerB);
530
- });
531
- expect(ReconcileTransaction.getPooled.calls.count()).toBe(2);
532
-
533
- // ...but updates are! Here only one more transaction is used, which means
534
- // we only have to initialize and close the wrappers once.
535
- ReactDOM.unstable_batchedUpdates(function() {
536
- ReactDOM.render(<Component text="A2" />, containerA);
537
- ReactDOM.render(<Component text="B2" />, containerB);
538
- });
539
- expect(ReconcileTransaction.getPooled.calls.count()).toBe(3);
540
- });
541
-
508
it('should queue mount-ready handlers across different roots', () => {
509
// We'll define two components A and B, then update both of them. When A's
510
// componentDidUpdate handlers is called, B's DOM should already have been
src/renderers/dom/shared/ReactDOMFeatureFlags.js
+1
-1
@@ -13,7 +13,7 @@
13
14
var ReactDOMFeatureFlags = {
15
useCreateElement: true,
16
- useFiber: false,
16
+ useFiber: true,
17
};
18
19
module.exports = ReactDOMFeatureFlags;
src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js
+49
-81
@@ -692,111 +692,55 @@ describe('ReactDOMComponent', () => {
692
});
693
694
describe('createOpenTagMarkup', () => {
695
- var genMarkup;
696
-
695
function quoteRegexp(str) {
696
return (str + '').replace(/([.?*+\^$\[\]\\(){}|-])/g, '\\$1');
697
}
698
701
- beforeEach(() => {
702
- var ReactDOMInjection = require('ReactDOMInjection');
703
- ReactDOMInjection.inject();
704
- var ReactDOMStackInjection = require('ReactDOMStackInjection');
705
- ReactDOMStackInjection.inject();
706
-
707
- var ReactDOMComponent = require('ReactDOMComponent');
708
- var ReactReconcileTransaction = require('ReactReconcileTransaction');
709
-
710
- var NodeStub = function(initialProps) {
711
- this._currentElement = {props: initialProps};
712
- this._rootNodeID = 1;
713
- };
714
- Object.assign(NodeStub.prototype, ReactDOMComponent.Mixin);
715
-
716
- genMarkup = function(props) {
717
- var transaction = new ReactReconcileTransaction();
718
- return (new NodeStub(props))._createOpenTagMarkupAndPutListeners(
719
- transaction,
720
- props
721
- );
722
- };
699
+ function toHaveAttribute(actual, expected) {
700
+ var [attr, value] = expected;
701
+ var re = '(?:^|\\s)' + attr + '=[\\\'"]';
702
+ if (typeof value !== 'undefined') {
703
+ re += quoteRegexp(value) + '[\\\'"]';
704
+ }
705
+ return (new RegExp(re)).test(actual);
706
+ }
707
724
- jasmine.addMatchers({
725
- toHaveAttribute() {
726
- return {
727
- compare(actual, expected) {
728
- var [attr, value] = expected;
729
- var re = '(?:^|\\s)' + attr + '=[\\\'"]';
730
- if (typeof value !== 'undefined') {
731
- re += quoteRegexp(value) + '[\\\'"]';
732
- }
733
- return {
734
- pass: (new RegExp(re)).test(actual),
735
- };
736
- },
737
- };
738
- },
739
- });
740
- });
708
+ function genMarkup(props) {
709
+ return ReactDOMServer.renderToString(<div {...props} />);
710
+ }
711
712
it('should generate the correct markup with className', () => {
743
- expect(genMarkup({className: 'a'})).toHaveAttribute(['class', 'a']);
744
- expect(genMarkup({className: 'a b'})).toHaveAttribute(['class', 'a b']);
745
- expect(genMarkup({className: ''})).toHaveAttribute(['class', '']);
713
+ expect(toHaveAttribute(genMarkup({className: 'a'}), ['class', 'a']));
714
+ expect(toHaveAttribute(genMarkup({className: 'a b'}), ['class', 'a b']));
715
+ expect(toHaveAttribute(genMarkup({className: ''}), ['class', '']));
716
});
717
718
it('should escape style names and values', () => {
749
- expect(genMarkup({
719
+ expect(toHaveAttribute(genMarkup({
720
style: {'b&ckground': '<3'},
751
- })).toHaveAttribute(['style', 'b&ckground:<3;']);
721
+ }), ['style', 'b&ckground:<3;']));
722
});
723
});
724
725
describe('createContentMarkup', () => {
756
- var genMarkup;
757
-
726
function quoteRegexp(str) {
727
return (str + '').replace(/([.?*+\^$\[\]\\(){}|-])/g, '\\$1');
728
}
729
762
- beforeEach(() => {
763
- var ReactDOMComponent = require('ReactDOMComponent');
764
- var ReactReconcileTransaction = require('ReactReconcileTransaction');
730
+ function genMarkup(props) {
731
+ return ReactDOMServer.renderToString(<div {...props} />);
732
+ }
733
766
- var NodeStub = function(initialProps) {
767
- this._currentElement = {props: initialProps};
768
- this._rootNodeID = 1;
769
- };
770
- Object.assign(NodeStub.prototype, ReactDOMComponent.Mixin);
771
-
772
- genMarkup = function(props) {
773
- var transaction = new ReactReconcileTransaction();
774
- return (new NodeStub(props))._createContentMarkup(
775
- transaction,
776
- props,
777
- {}
778
- );
779
- };
780
-
781
- jasmine.addMatchers({
782
- toHaveInnerhtml() {
783
- return {
784
- compare(actual, expected) {
785
- var re = '^' + quoteRegexp(expected) + '$';
786
- return {
787
- pass: (new RegExp(re)).test(actual),
788
- };
789
- },
790
- };
791
- },
792
- });
793
- });
734
+ function toHaveInnerhtml(actual, expected) {
735
+ var re = '^' + quoteRegexp(expected) + '$';
736
+ return (new RegExp(re)).test(actual);
737
+ }
738
739
it('should handle dangerouslySetInnerHTML', () => {
740
var innerHTML = {__html: 'testContent'};
741
expect(
798
- genMarkup({dangerouslySetInnerHTML: innerHTML})
799
- ).toHaveInnerhtml('testContent');
742
+ toHaveInnerhtml(genMarkup({dangerouslySetInnerHTML: innerHTML}), 'testContent')
743
+ );
744
});
745
});
746
@@ -1824,4 +1768,28 @@ describe('ReactDOMComponent', () => {
1768
);
1769
});
1770
});
1771
+
1772
+ describe('whitespace', () => {
1773
+ it('renders innerHTML and preserves whitespace', () => {
1774
+ const container = document.createElement('div');
1775
+ const html = '\n \t <span> \n testContent \t </span> \n \t';
1776
+ const elem = <div dangerouslySetInnerHTML={{ __html: html }} />;
1777
+
1778
+ ReactDOM.render(elem, container);
1779
+ expect(container.firstChild.innerHTML).toBe(html);
1780
+ });
1781
+
1782
+ it('render and then updates innerHTML and preserves whitespace', () => {
1783
+ const container = document.createElement('div');
1784
+ const html = '\n \t <span> \n testContent1 \t </span> \n \t';
1785
+ const elem = <div dangerouslySetInnerHTML={{ __html: html }} />;
1786
+ ReactDOM.render(elem, container);
1787
+
1788
+ const html2 = '\n \t <div> \n testContent2 \t </div> \n \t';
1789
+ const elem2 = <div dangerouslySetInnerHTML={{ __html: html2 }} />;
1790
+ ReactDOM.render(elem2, container);
1791
+
1792
+ expect(container.firstChild.innerHTML).toBe(html2);
1793
+ });
1794
+ });
1795
});
src/renderers/dom/shared/__tests__/ReactDOMIDOperations-test.js
deleted
-37
@@ -1,37 +0,0 @@
1
-/**
2
- * Copyright 2013-present, Facebook, Inc.
3
- * All rights reserved.
4
- *
5
- * This source code is licensed under the BSD-style license found in the
6
- * LICENSE file in the root directory of this source tree. An additional grant
7
- * of patent rights can be found in the PATENTS file in the same directory.
8
- *
9
- * @emails react-core
10
- */
11
-
12
-'use strict';
13
-
14
-describe('ReactDOMIDOperations', () => {
15
- var ReactDOMComponentTree = require('ReactDOMComponentTree');
16
- var ReactDOMIDOperations = require('ReactDOMIDOperations');
17
-
18
- it('should update innerHTML and preserve whitespace', () => {
19
- var stubNode = document.createElement('div');
20
- var stubInstance = {_debugID: 1};
21
- ReactDOMComponentTree.precacheNode(stubInstance, stubNode);
22
-
23
- var html = '\n \t <span> \n testContent \t </span> \n \t';
24
- ReactDOMIDOperations.dangerouslyProcessChildrenUpdates(
25
- stubInstance,
26
- [{
27
- type: 'SET_MARKUP',
28
- content: html,
29
- fromIndex: null,
30
- toIndex: null,
31
- }],
32
- []
33
- );
34
-
35
- expect(stubNode.innerHTML).toBe(html);
36
- });
37
-});
src/renderers/dom/shared/__tests__/ReactMount-test.js
-14
@@ -14,7 +14,6 @@
14
var React;
15
var ReactDOM;
16
var ReactDOMServer;
17
-var ReactMount;
17
var ReactTestUtils;
18
var WebComponents;
19
@@ -25,7 +24,6 @@ describe('ReactMount', () => {
24
React = require('React');
25
ReactDOM = require('ReactDOM');
26
ReactDOMServer = require('ReactDOMServer');
28
- ReactMount = require('ReactMount');
27
ReactTestUtils = require('ReactTestUtils');
28
29
try {
@@ -297,18 +295,6 @@ describe('ReactMount', () => {
295
expect(calls).toBe(5);
296
});
297
300
- it('tracks root instances', () => {
301
- // Used by devtools.
302
- expect(Object.keys(ReactMount._instancesByReactRootID).length).toBe(0);
303
- ReactTestUtils.renderIntoDocument(<span />);
304
- expect(Object.keys(ReactMount._instancesByReactRootID).length).toBe(1);
305
- var container = document.createElement('div');
306
- ReactDOM.render(<span />, container);
307
- expect(Object.keys(ReactMount._instancesByReactRootID).length).toBe(2);
308
- ReactDOM.unmountComponentAtNode(container);
309
- expect(Object.keys(ReactMount._instancesByReactRootID).length).toBe(1);
310
- });
311
-
298
it('marks top-level mounts', () => {
299
var ReactFeatureFlags = require('ReactFeatureFlags');
300