diff --git a/src/renderers/art/ReactART.js b/src/renderers/art/ReactART.js index 0f102926e31ba..bf1e298ef0184 100644 --- a/src/renderers/art/ReactART.js +++ b/src/renderers/art/ReactART.js @@ -93,7 +93,7 @@ function injectAfter(parentNode, referenceNode, node) { // ContainerMixin for components that can hold ART nodes -const ContainerMixin = assign({}, ReactMultiChild, { +const ContainerMixin = assign({}, ReactMultiChild.prototype, { /** * Moves a child component to the supplied index. diff --git a/src/renderers/dom/shared/ReactDOMComponent.js b/src/renderers/dom/shared/ReactDOMComponent.js index c9bae5a8026aa..3429c287638a6 100644 --- a/src/renderers/dom/shared/ReactDOMComponent.js +++ b/src/renderers/dom/shared/ReactDOMComponent.js @@ -1200,7 +1200,7 @@ ReactDOMComponent.Mixin = { Object.assign( ReactDOMComponent.prototype, ReactDOMComponent.Mixin, - ReactMultiChild + ReactMultiChild.prototype ); module.exports = ReactDOMComponent; diff --git a/src/renderers/native/ReactNativeBaseComponent.js b/src/renderers/native/ReactNativeBaseComponent.js index 2192b019fc4ab..1872386b6896a 100644 --- a/src/renderers/native/ReactNativeBaseComponent.js +++ b/src/renderers/native/ReactNativeBaseComponent.js @@ -224,7 +224,7 @@ ReactNativeBaseComponent.Mixin = { */ Object.assign( ReactNativeBaseComponent.prototype, - ReactMultiChild, + ReactMultiChild.prototype, ReactNativeBaseComponent.Mixin, NativeMethodsMixin ); diff --git a/src/renderers/shared/stack/reconciler/ReactMultiChild.js b/src/renderers/shared/stack/reconciler/ReactMultiChild.js index 220de49f3e6b5..d567c96573aea 100644 --- a/src/renderers/shared/stack/reconciler/ReactMultiChild.js +++ b/src/renderers/shared/stack/reconciler/ReactMultiChild.js @@ -169,8 +169,8 @@ if (__DEV__) { * children. This is used by `ReactDOMComponent` to mount, update, and * unmount child components. */ -var ReactMultiChild = { - _reconcilerInstantiateChildren: function(nestedChildren, transaction, context) { +class ReactMultiChild { + _reconcilerInstantiateChildren(nestedChildren, transaction, context) { if (__DEV__) { var selfDebugID = getDebugID(this); if (this._currentElement) { @@ -187,9 +187,9 @@ var ReactMultiChild = { return ReactChildReconciler.instantiateChildren( nestedChildren, transaction, context ); - }, + } - _reconcilerUpdateChildren: function( + _reconcilerUpdateChildren( prevChildren, nextNestedChildrenElements, mountImages, @@ -235,7 +235,7 @@ var ReactMultiChild = { selfDebugID ); return nextChildren; - }, + } /** * Generates a "mount image" for each of the supplied children. In the case @@ -245,7 +245,7 @@ var ReactMultiChild = { * @return {array} An array of mounted representations. * @internal */ - mountChildren: function(nestedChildren, transaction, context) { + mountChildren(nestedChildren, transaction, context) { var children = this._reconcilerInstantiateChildren( nestedChildren, transaction, context ); @@ -278,7 +278,7 @@ var ReactMultiChild = { } return mountImages; - }, + } /** * Replaces any rendered children with a text content string. @@ -286,7 +286,7 @@ var ReactMultiChild = { * @param {string} nextContent String of content. * @internal */ - updateTextContent: function(nextContent) { + updateTextContent(nextContent) { var prevChildren = this._renderedChildren; // Remove any rendered children. ReactChildReconciler.unmountChildren(prevChildren, false); @@ -298,7 +298,7 @@ var ReactMultiChild = { // Set new text content. var updates = [makeTextContent(nextContent)]; processQueue(this, updates); - }, + } /** * Replaces any rendered children with a markup string. @@ -306,7 +306,7 @@ var ReactMultiChild = { * @param {string} nextMarkup String of markup. * @internal */ - updateMarkup: function(nextMarkup) { + updateMarkup(nextMarkup) { var prevChildren = this._renderedChildren; // Remove any rendered children. ReactChildReconciler.unmountChildren(prevChildren, false); @@ -317,7 +317,7 @@ var ReactMultiChild = { } var updates = [makeSetMarkup(nextMarkup)]; processQueue(this, updates); - }, + } /** * Updates the rendered children with new children. @@ -326,10 +326,10 @@ var ReactMultiChild = { * @param {ReactReconcileTransaction} transaction * @internal */ - updateChildren: function(nextNestedChildrenElements, transaction, context) { + updateChildren(nextNestedChildrenElements, transaction, context) { // Hook used by React ART this._updateChildren(nextNestedChildrenElements, transaction, context); - }, + } /** * @param {?object} nextNestedChildrenElements Nested child element maps. @@ -337,7 +337,7 @@ var ReactMultiChild = { * @final * @protected */ - _updateChildren: function(nextNestedChildrenElements, transaction, context) { + _updateChildren(nextNestedChildrenElements, transaction, context) { var prevChildren = this._renderedChildren; var removedNodes = {}; var mountImages = []; @@ -414,7 +414,7 @@ var ReactMultiChild = { if (__DEV__) { setChildrenForInstrumentation.call(this, nextChildren); } - }, + } /** * Unmounts all rendered children. This should be used to clean up children @@ -423,11 +423,11 @@ var ReactMultiChild = { * * @internal */ - unmountChildren: function(safely) { + unmountChildren(safely) { var renderedChildren = this._renderedChildren; ReactChildReconciler.unmountChildren(renderedChildren, safely); this._renderedChildren = null; - }, + } /** * Moves a child component to the supplied index. @@ -437,14 +437,14 @@ var ReactMultiChild = { * @param {number} lastIndex Last index visited of the siblings of `child`. * @protected */ - moveChild: function(child, afterNode, toIndex, lastIndex) { + moveChild(child, afterNode, toIndex, lastIndex) { // If the index of `child` is less than `lastIndex`, then it needs to // be moved. Otherwise, we do not need to move it because a child will be // inserted or moved before `child`. if (child._mountIndex < lastIndex) { return makeMove(child, afterNode, toIndex); } - }, + } /** * Creates a child component. @@ -453,9 +453,9 @@ var ReactMultiChild = { * @param {string} mountImage Markup to insert. * @protected */ - createChild: function(child, afterNode, mountImage) { + createChild(child, afterNode, mountImage) { return makeInsertMarkup(mountImage, afterNode, child._mountIndex); - }, + } /** * Removes a child component. @@ -463,9 +463,9 @@ var ReactMultiChild = { * @param {ReactComponent} child Child to remove. * @protected */ - removeChild: function(child, node) { + removeChild(child, node) { return makeRemove(child, node); - }, + } /** * Mounts a child with the supplied name. @@ -478,7 +478,7 @@ var ReactMultiChild = { * @param {ReactReconcileTransaction} transaction * @private */ - _mountChildAtIndex: function( + _mountChildAtIndex( child, mountImage, afterNode, @@ -487,7 +487,7 @@ var ReactMultiChild = { context) { child._mountIndex = index; return this.createChild(child, afterNode, mountImage); - }, + } /** * Unmounts a rendered child. @@ -497,11 +497,11 @@ var ReactMultiChild = { * @param {ReactComponent} child Component to unmount. * @private */ - _unmountChild: function(child, node) { + _unmountChild(child, node) { var update = this.removeChild(child, node); child._mountIndex = null; return update; - }, + } }; module.exports = ReactMultiChild; diff --git a/src/renderers/shared/stack/reconciler/ReactOwner.js b/src/renderers/shared/stack/reconciler/ReactOwner.js index 1e9b411f9d0ff..a804513d73583 100644 --- a/src/renderers/shared/stack/reconciler/ReactOwner.js +++ b/src/renderers/shared/stack/reconciler/ReactOwner.js @@ -15,6 +15,7 @@ var invariant = require('invariant'); import type { ReactInstance } from 'ReactInstanceType'; +import type { Transaction } from 'Transaction'; /** * @param {?object} object @@ -73,7 +74,7 @@ var ReactOwner = { component: ReactInstance, ref: string, owner: ReactInstance, - transaction, + transaction: Transaction, ): void { invariant( isValidOwner(owner), diff --git a/src/renderers/testing/ReactTestEmptyComponent.js b/src/renderers/testing/ReactTestEmptyComponent.js index 9f6659ea8dcd9..067d5e8e043bc 100644 --- a/src/renderers/testing/ReactTestEmptyComponent.js +++ b/src/renderers/testing/ReactTestEmptyComponent.js @@ -13,6 +13,8 @@ 'use strict'; class ReactTestEmptyComponent { + _currentElement: null; + constructor() { this._currentElement = null; } diff --git a/src/renderers/testing/ReactTestMount.js b/src/renderers/testing/ReactTestMount.js index 71811e4bfa890..f13e5d20f6d7f 100644 --- a/src/renderers/testing/ReactTestMount.js +++ b/src/renderers/testing/ReactTestMount.js @@ -20,8 +20,10 @@ var getHostComponentFromComposite = require('getHostComponentFromComposite'); var instantiateReactComponent = require('instantiateReactComponent'); var invariant = require('invariant'); -type TestRendererOptions = { - createNodeMock: (element: ReactElement) => Object, +import type { ReactElement } from 'ReactElementType'; + +export type TestRendererOptions = { + createNodeMock: (element: ReactElement) => any, }; var defaultTestOptions = { diff --git a/src/renderers/testing/ReactTestReconcileTransaction.js b/src/renderers/testing/ReactTestReconcileTransaction.js index ba87192001b52..50585e08be106 100644 --- a/src/renderers/testing/ReactTestReconcileTransaction.js +++ b/src/renderers/testing/ReactTestReconcileTransaction.js @@ -16,6 +16,8 @@ var PooledClass = require('PooledClass'); var Transaction = require('Transaction'); var ReactUpdateQueue = require('ReactUpdateQueue'); +import type { TestRendererOptions } from 'ReactTestMount'; + /** * Provides a `CallbackQueue` queue for collecting `onDOMReady` callbacks during * the performing of the transaction. @@ -57,7 +59,7 @@ var TRANSACTION_WRAPPERS = [ON_DOM_READY_QUEUEING]; * * @class ReactTestReconcileTransaction */ -function ReactTestReconcileTransaction(testOptions) { +function ReactTestReconcileTransaction(testOptions: TestRendererOptions) { this.reinitializeTransaction(); this.testOptions = testOptions; this.reactMountReady = CallbackQueue.getPooled(this); diff --git a/src/renderers/testing/ReactTestRenderer.js b/src/renderers/testing/ReactTestRenderer.js index a7daf6ebf91ec..a60707da6643b 100644 --- a/src/renderers/testing/ReactTestRenderer.js +++ b/src/renderers/testing/ReactTestRenderer.js @@ -24,11 +24,13 @@ var ReactTestTextComponent = require('ReactTestTextComponent'); var ReactTestEmptyComponent = require('ReactTestEmptyComponent'); import type { ReactElement } from 'ReactElementType'; +import type { ReactInstance } from 'ReactInstanceType'; type ReactTestRendererJSON = { type: string, props: { [propName: string]: string }, - children: Array, + children: null | Array, + $$typeof?: any } /** @@ -46,8 +48,13 @@ function getRenderedHostOrTextFromComponent(component) { return component; } -class ReactTestComponent { +class ReactTestComponent extends ReactMultiChild { + _currentElement: ReactElement; + _renderedChildren: null | Object; + _topLevelWrapper: null | ReactInstance; + constructor(element: ReactElement) { + super(); this._currentElement = element; this._renderedChildren = null; this._topLevelWrapper = null; @@ -89,7 +96,7 @@ class ReactTestComponent { childrenJSON.push(json); } } - var object = { + var object: ReactTestRendererJSON = { type: this._currentElement.type, props: props, children: childrenJSON.length ? childrenJSON : null, @@ -104,8 +111,6 @@ class ReactTestComponent { unmountComponent(): void {} } -Object.assign(ReactTestComponent.prototype, ReactMultiChild); - // ============================================================================= ReactUpdates.injection.injectReconcileTransaction( diff --git a/src/renderers/testing/ReactTestTextComponent.js b/src/renderers/testing/ReactTestTextComponent.js index 18e22d4e9f543..a6e61a655dcae 100644 --- a/src/renderers/testing/ReactTestTextComponent.js +++ b/src/renderers/testing/ReactTestTextComponent.js @@ -15,6 +15,8 @@ import type { ReactText } from 'ReactTypes'; class ReactTestTextComponent { + _currentElement: ReactText; + constructor(element: ReactText) { this._currentElement = element; }