@samitouri / QOS-React-2 / commits / 510155e027

Fix instrumentation in shallow rendering (#6867)

Previously, this threw: ``` FAIL src/test/__tests__/ReactTestUtils-test.js (7.291s) ● ReactTestUtils › it can fail context when shallowly rendering - TypeError: Cannot read property '_source' of null at describeID (src/renderers/shared/devtools/ReactComponentTreeDevtool.js:70:46) at Object.ReactComponentTreeDevtool.getStackAddendumByID (src/renderers/shared/devtools/ReactComponentTreeDevtool.js:203:15) at checkReactTypeSpec (src/isomorphic/classic/types/checkReactTypeSpec.js:76:58) at ReactCompositeComponentMixin._checkContextTypes (src/renderers/shared/stack/reconciler/ReactCompositeComponent.js:668:5) at ReactCompositeComponentMixin._processContext (src/renderers/shared/stack/reconciler/ReactCompositeComponent.js:607:14) at ReactCompositeComponentMixin.mountComponent (src/renderers/shared/stack/reconciler/ReactCompositeComponent.js:191:30) at ReactShallowRenderer._render (src/test/ReactTestUtils.js:483:14) at _batchedRender (src/test/ReactTestUtils.js:460:12) at ReactDefaultBatchingStrategyTransaction.Mixin.perform (src/shared/utils/Transaction.js:140:20) at Object.ReactDefaultBatchingStrategy.batchedUpdates (src/renderers/shared/stack/reconciler/ReactDefaultBatchingStrategy.js:65:19) at Object.batchedUpdates (src/renderers/shared/stack/reconciler/ReactUpdates.js:112:20) at ReactShallowRenderer.render (src/test/ReactTestUtils.js:453:16) at Spec.eval (src/test/__tests__/ReactTestUtils-test.js:289:34) at jasmine.Block.execute (node_modules/jest-jasmine1/vendor/jasmine-1.3.0.js:1067:17) at jasmine.Queue.next_ (node_modules/jest-jasmine1/vendor/jasmine-1.3.0.js:2100:31) at jasmine.Queue.start (node_modules/jest-jasmine1/vendor/jasmine-1.3.0.js:2053:8) at Spec.jasmine.Spec.execute (node_modules/jest-jasmine1/vendor/jasmine-1.3.0.js:2380:14) at jasmine.Queue.next_ (node_modules/jest-jasmine1/vendor/jasmine-1.3.0.js:2100:31) at onComplete (node_modules/jest-jasmine1/vendor/jasmine-1.3.0.js:2096:18) at Spec.jasmine.Spec.finish (node_modules/jest-jasmine1/vendor/jasmine-1.3.0.js:2354:5) at eval [as onComplete] (node_modules/jest-jasmine1/vendor/jasmine-1.3.0.js:2381:10) at jasmine.Queue.next_ (node_modules/jest-jasmine1/vendor/jasmine-1.3.0.js:2110:14) at eval (node_modules/jest-jasmine1/vendor/jasmine-1.3.0.js:2090:18) at Timeout.e [as _onTimeout] (node_modules/jsdom/lib/jsdom/browser/Window.js:440:19) at tryOnTimeout (timers.js:224:11) at Timer.listOnTimeout (timers.js:198:5) ```

Ben Alpert committed May 25, 2016 at 09:46 UTC 510155e027d56ce3cf5c890c9939d894528cf007
2 files changed +37 -3
src/test/ReactTestUtils.js
+14 -3
@@ -23,6 +23,8 @@ var ReactElement = require('ReactElement');
23 var ReactBrowserEventEmitter = require('ReactBrowserEventEmitter');
24 var ReactCompositeComponent = require('ReactCompositeComponent');
25 var ReactInstanceMap = require('ReactInstanceMap');
26 +var ReactInstrumentation = require('ReactInstrumentation');
27 +var ReactReconciler = require('ReactReconciler');
28 var ReactUpdates = require('ReactUpdates');
29 var SyntheticEvent = require('SyntheticEvent');
30
@@ -407,7 +409,11 @@ NoopInternalComponent.prototype = {
409 };
410
411 var ShallowComponentWrapper = function(element) {
412 + // TODO: Consolidate with instantiateReactComponent
413 this._debugID = nextDebugID++;
414 + var displayName = element.type.displayName || element.type.name || 'Unknown';
415 + ReactInstrumentation.debugTool.onSetDisplayName(this._debugID, displayName);
416 +
417 this.construct(element);
418 };
419 Object.assign(
@@ -471,16 +477,21 @@ ReactShallowRenderer.prototype.getRenderOutput = function() {
477
478 ReactShallowRenderer.prototype.unmount = function() {
479 if (this._instance) {
474 - this._instance.unmountComponent(false);
480 + ReactReconciler.unmountComponent(this._instance, false);
481 }
482 };
483
484 ReactShallowRenderer.prototype._render = function(element, transaction, context) {
485 if (this._instance) {
480 - this._instance.receiveComponent(element, transaction, context);
486 + ReactReconciler.receiveComponent(
487 + this._instance,
488 + element,
489 + transaction,
490 + context
491 + );
492 } else {
493 var instance = new ShallowComponentWrapper(element);
483 - instance.mountComponent(transaction, null, null, context);
494 + ReactReconciler.mountComponent(instance, transaction, null, null, context);
495 this._instance = instance;
496 }
497 };
src/test/__tests__/ReactTestUtils-test.js
+23
@@ -275,6 +275,29 @@ describe('ReactTestUtils', function() {
275 expect(result).toEqual(<div>foo</div>);
276 });
277
278 + it('can fail context when shallowly rendering', function() {
279 + spyOn(console, 'error');
280 + var SimpleComponent = React.createClass({
281 + contextTypes: {
282 + name: React.PropTypes.string.isRequired,
283 + },
284 + render: function() {
285 + return <div>{this.context.name}</div>;
286 + },
287 + });
288 +
289 + var shallowRenderer = ReactTestUtils.createRenderer();
290 + shallowRenderer.render(<SimpleComponent />);
291 + expect(console.error.argsForCall.length).toBe(1);
292 + expect(
293 + console.error.argsForCall[0][0].replace(/\(at .+?:\d+\)/g, '(at **)')
294 + ).toBe(
295 + 'Warning: Failed context type: Required context `name` was not ' +
296 + 'specified in `SimpleComponent`.\n' +
297 + ' in SimpleComponent (at **)'
298 + );
299 + });
300 +
301 it('can scryRenderedDOMComponentsWithClass with TextComponent', function() {
302 var Wrapper = React.createClass({
303 render: function() {