Commit Graph
981 Commits
Author SHA1 Message Date
Dan Abramov 4f19558c6b Use public API in tests wherever possible (#9954)
* Use public API in tests wherever possible

* Add missing src/node_modules files
2017-06-14 00:58:35 +01:00
Dan Abramov 2d9d4f6349 Return empty static markup for null components (#9907) 2017-06-09 16:32:00 +01:00
Dominic Gannaway d13f07925f Add support for implicitly mocked components using ReactServerRenderer (#9906)
* adds the fix (from stack) and adds a test

* updated name of test and ran fiber script
2017-06-09 16:27:00 +01:00
Dan Abramov 5c6a496d98 Inline some internals, reduce shared/ utilities between isomorphic and renderers (#9903)
* Make ReactControlledValuePropTypes DEV-only

* Remove canDefineProperty

This breaks IE8. We don't support it.

* Remove getNextDebugID

It was added temporarily to avoid Stack shared state issues across renderers.
Not a problem anymore.

* Make KeyEscapeUtils.unescape() DEV-only

* Remove unused deprecated() module

It's unlikely we'll deprecate anything else on React.* object soon.

* Inline getIteratorFn at the call sites

* Inline ReactElementSymbol

* Inline KeyEscapeUtils into Children and move the file into Stack

It's only used in one place in isomorphic.
It's used more broadly in Stack so we move it there to die.

* Update artifacts

* Reorder declarations for consistency

* Fix Flow
2017-06-09 12:41:50 +01:00
Dan Abramov a37012a6b5 Add Bailout effectTag for React DevTools (#9887)
* Add Bailout effectTag for React DevTools

* Instead of tracking bailout, track performed work
2017-06-08 21:23:34 +01:00
Dan Abramov 80fffbe0de Fix a bug with memoizedState affecting React DevTools (#9886)
* Fix a bug with memoizedState affecting React DevTools

* Restructure to avoid duplication
2017-06-07 19:54:57 +01:00
Dan Abramov b840229286 Remove prepareNewChildrenBeforeUnmountInStack flag (#9872) 2017-06-06 23:22:34 +01:00
Sebastian Markbåge 262b9c72f5 Don't hydrate any properties other than event listeners and text content (#9858)
* Don't hydrate any properties other than event listeners and text content

This strategy assumes that the rendered HTML is correct if the tree lines
up. Therefore we don't diff any attributes of the rendered HTML.

However, as a precaution I ensure that textContent *is* updated. This
ensures that if something goes wrong with keys lining up etc. at least
there is some feedback that the event handlers might not line up. With
what you expect. This might not be what you want e.g. for date formatting
where it can different between server and client.

It is expected that content will line up. To ensure that I will in a follow
up ensure that the warning is issued if it doesn't line up so that in
development this can be addressed.

The text content updates are now moved to the commit phase so if the tree
is asynchronously hydrated it doesn't start partially swapping out. I use
the regular update side-effect with payload if the content doesn't match up.

Since we no longer guarantee that attributes is correct I changed the
bad mark up SSR integration tests to only assert on the textContent
instead.

* Hydrate text node if possible

Currently we're never matching text nodes so we need to properly branch.
2017-06-06 15:19:38 -07:00
Edvin Erikson b9ddd206f9 Fiber SSR tests (#9846) 2017-06-04 15:44:24 -07:00
Brian Vaughn a5d659d07e shouldSetTextContent accepts type parameter in addition to props (#9841) 2017-06-02 10:40:29 -07:00
Dustan Kasten 5f99a48229 Update to Flow 0.47 (#9815)
* bump flow to 0.47

* Fix variadic function flow issues in fiber

* Fix variadic function flow issues in ReactFiberNative

* fix ReactDOM type issues with flow 0.47

* getChildHostContext *does* take an `instance` argument

* change recently added anys to mixedies

* HydrationContext needs a handle on the rootContainerInstance

* prettier
2017-06-01 12:17:21 -07:00
Sebastian Markbåge 9dcc60af33 Delete logTopLevelRenders flag and console timing (#9825)
This was mostly used for timing of initial mounts. However, we haven't
implemented that in Fiber and yet nobody has complained despite running
without it. Further more the update tracks any update within the tree,
not just updates to the props of the top level. This is much less useful
due to the variation.

I could make this track initial mounts too but it's a bit awkward so I'd
rather just delete it if possible. We can run the full profiling mode if
we want more coverage.
2017-06-01 13:00:45 -04:00
Brian Vaughn 8ca82e1df6 Fixed arity issues in advance of Flow strict checking being enabled (#9816) 2017-05-30 13:50:11 -07:00
Dustan Kasten 80bdebc1f9 Fix ReactFiberReconciler annotation to include PI (#8751)
* Fix ReactFiberReconciler annotation to include `PI`

https://github.com/facebook/react/pull/8628#issuecomment-271970297

* Make getPublicInstance type safe

* attempting to trigger the issue @sebmarkbage described

https://github.com/facebook/react/pull/8751#discussion_r95669118

* Unify renderer-specific getPublicInstance with getRootInstance

* Switch on fiber type HostComponent for getPublicRootInstance

* Fix test that was too dynamic (and failing)

* Use PI in reconciler public API

* Prettier
2017-05-30 20:15:48 +01:00
Sebastian Markbåge 9c7a312d7c Hydration of previously rendered server markup (#9580)
* Don't double validate the DOM container

The warnings need to check a valid container but that should happen in
unstable_renderSubtreeIntoContainer too so might as well move it in.

* Hydrating DOM

Hydrates a server-rendered DOM tree by traversing it and connecting up the nodes if they match. Attributes are not diffed. They're assumed to be accurate on matching nodes.

* Remove meta data filtering from test

Because the current server renderer includes the meta data, it remains in a revived tree.

* Annotate because Flow

* Don't track insertion effects if we're going to hydrate

During initial mount, we should not track Placement

* Fix up test cases to ignore errors that we no longer throw

TODO make these warnings instead.

* Correctly track hydration state inside a newly inserted tree

When we don't match the first hydration node, we'll do an insertion.
Currently we keep the next hydratable sibling so that we know where to
pick up once we're done with the insertion. Unfortunately this makes the
nodes inside the insertion think that there's a node to hydrate.

I used to check for the direct parent but that doesn't work on nested host components.

We need to instead keep track of that we're in an hydration context but
we're not currently hydrating. Once we pop passed the inserted node can
we resume hydrating.

* Hacky fix to isMounted

isMounted checks whether a component is inside a Placement. During
hydration we ideally don't do any Placements if hydration matches the tree.

To work around this I use the Placement flag on the root, which isn't used
for anything else. But only temporarily while we're hydrating. Then reset
it before committing.

* Record tests

* Comments
2017-05-25 15:19:19 -04:00
Toru Kobayashi cbef3fd412 Warn it only in DEV (#9772) 2017-05-25 07:31:35 -07:00
Brian Vaughn c22b94f14a ReactNative flat renderer bundles (#9626)
* Split ReactNativeFiber into separate ReactNativeFiberRenderer module
Hopefully this is sufficient to work around Rollup circular dependency problems. (To be seen in subsequent commits...)

* Split findNodeHandle into findNodeHandleFiber + findNodeHandleStack
This allowed me to remove the ReactNative -> findNodeHandle injections, which should in turn allow me to require a fully-functional findNodeHandle without going through ReactNative. This will hopefully allow ReactNativeBaseomponent to avoid a circular dependency.

* Un-forked findNodeHandle in favor of just inlining the findNode function impl

* takeSnapshot no longer requires/depends-on ReactNative for findNodeHandle
Instead it uses the new, renderer-specific wrappers (eg findNodeHandleFiberWrapper and findNodeHandleStackWrapper) to ensure the returned value is numeric (or null). This avoids a circular dependency that would trip up Rollup.

* NativeMethodsMixin requires findNodeHandler wrapper(s) directly rather than ReactNative
This works around a potential circular dependency that would break the Rollup build

* Add RN_* build targets to hash-finle-name check

* Strip @providesModule annotations from headers for RN_* builds

* Added process.env.REACT_NATIVE_USE_FIBER to ReactNativeFeatureFlags
This is kind of a hacky solution, but it is temporary. It works around the fact that ReactNativeFeatureFlag values need to be set at build time in order to avoid a mismatch between runtime flag values. DOM avoids the need to do this by using injection but Native is not able to use this same approach due to circular dependency issues.

* Moved a couple of SECRET exports to dev-only. Removed SyntheticEvent and PooledClass from SECRET exports. Converted Rollup helper function to use named params.

* Split NativeMethodsMixins interface and object-type

* Add @noflow header to flat-bundle template to avoid triggering Flow problems
When Flow tries to infer such a large file, it consumes massive amounts of CPU/RAM and can often lead to programs crashing. It is better for such large files to use .flow.js types instead.

* NativeMethodsMixin and ReactNativeFiberHostComponent now share the same Flow type

* Collocated (externally exposed) ReactTypes and ReactNativeTypes into single files to be synced to fbsource. ReactNativeFiber and ReactNativeStack use ReactNativeType Flow type

* Build script syncs RN types and PooledClass automatically

* Added optional sync-RN step to Rollup build script

* Added results.json for new RN bundles
2017-05-24 17:06:30 +01:00
Flarnie Marchan 964c263d8f Downgrade deprecation warnings from errors to warnings (#9650)
* Initial regeneration of results.json

**what is the change?:**
We ran `yarn build` and updated the perf. stats record.

**why make this change?:**
Some commits have landed without updating this. By getting an initial update, I can run the build script again after my changes and see any size regressions.

* Downgrade deprecation warnings from errors to warnings

**what is the change?:**
Swapping out `warning` module for a fork that uses `console.warn`.
It looks like we were using the `warning` module for deprecation notices, *but* there is also a 'deprecated' module designed specifically for deprecation notices.

However, we could not find any place that it was currently used.

Since React's build process is not 100% clear to me, I assume it could still be used somewhere by something and just updated it along with other deprecation notices.

We might consider a follow-up diff that does some clean up here;
 - remove 'deprecated' module if it's unused, OR
 - use 'deprecated' module for all our current deprecation warnings

**why make this change?:**
- We have had complaints about noisy warnings, in particular after introducing new deprecations
- They potentially cause CI failures
- Deprecations are not really time-sensitive, can ship without breaking your app, etc.

For more context - https://github.com/facebook/react/issues/9395

**test plan:**
`npm run test`
and unit tests for the new modules
and manual testing (WIP)

**issue:**
https://github.com/facebook/react/issues/9395

* Add 'lowPriorityWarning' to ReactExternals

**what is the change?:**
We won't bundle 'lowPriorityWarning' with the rest of React when building for Facebook.
NOTE: A parallel commit will introduce an internal implementation of 'lowPriorityWarning' in Facebook's codebase, to compensate. Will post a comment with the diff number once that is up.

**why make this change?:**
So that the sync between github and Facebook can go more smoothly!

**test plan:**
We will see when I run the sync! But this is a reasonable first step imo.

**issue:**
https://github.com/facebook/react/issues/9398

* Make state mutations an error, not low-pri warning

**what is the change?:**
Even though this is a "deprecation" warning, we still want to use 'console.error' for it.

**why make this change?:**
- It's not likely to come up now, hopefully, because this warning has been present for some time
- This will cause real issues in production if ignored

**test plan:**
`yarn test` - we did fix one test which failed bc of this change

**issue:**
https://github.com/facebook/react/issues/9398

* Fix test of assigning to this.state that was only passing in fiber

**what is the change?:**
updated a unit test for assigning directly to state; it once again raises an error and not a warning.

**why make this change?:**
So that tests pass

**test plan:**
 REACT_DOM_JEST_USE_FIBER=1 yarn run test

**issue:**

* Update results.json
2017-05-23 09:35:42 -07:00
Sebastian Markbåge e5e874d0e8 Add package builds for new server renderer and enable tests (#9710)
* Adjust some expectations of the server markup format of Fiber

Currently this case is using the stack renderer.

* Ensure debug hooks are injected into the Stack server renderer

In our tests this normally happens because ReactDOM.js injects them into
the shared module, but when Fiber is enabled or this is its own flat
bundle, that doesn't happen.

* Add package builds for new server renderer and enable tests

ReactServer -> ReactDOMServerStream

This file is going to be the replacement for ReactDOMServer.

I mock ReactDOMServer and user ReactDOMServerStream when we have
the fiber flag enabled. I'm now also enabling this as the default for
distributions builds (react-dom/server on npm and
react-dom-server.production.min.js as umd bundle).

I'm using traverseStackChildren instead of traverseAllChildren because
traverseAllChildren is now only in the isomorphic package and we don't
want to build all of that that into the server package.

I also have to require lower case react for the builds to work.
2017-05-17 17:19:11 -07:00
Toru Kobayashi 17ab69c1ec [Fiber] Fix to call deferred callbackQueue even if updates are aborted (#9634)
* Fix to call deferred callbackQueue even if updates are aborted

* Add an assertion to make sure the update processed, but wasn't committed yet
2017-05-12 10:45:51 -07:00
Andrew Clark 767a5d60e8 updateQueue -> newUpdateQueue
Fix typo introduced after renaming a variable to address shadowing.
2017-05-05 14:21:17 -07:00
Andrew Clark 628b82c808 Allow assigning to this.state inside componentWillMount, with a warning 2017-05-05 14:03:29 -07:00
Andrew Clark 1232666590 Don't recreate instance when resuming a class component's initial mount
Recreating the class instance causes refs (and other callbacks) to close
over stale instances.

Instead, re-use the previous instance. componentWillMount is called
again. We also call componentWillReceiveProps, to ensure that
state derived from props remains in sync.
2017-05-05 14:03:29 -07:00
Andrew Clark 4d8174480c Only perform class checks on initial mount
Avoids firing warnings multiple times
2017-05-01 15:53:19 -07:00
Andrew Clark 9145f40eb8 Fix bug where null props is passed to constructor when resuming mount
Another example of where the pending/progressed/memoized props model
would benefit from a refactor.
2017-05-01 15:53:19 -07:00
Andrew Clark ae4fa9ad94 Demonstrate failing test when resuming mount of class component 2017-05-01 15:53:14 -07:00
Dan Abramov 8dcf9c7be7 Change warning casing (#9573)
* Change warning casing

* Update ReactFiberClassComponent.js

* Update ReactCompositeComponent.js
2017-05-01 21:51:47 +01:00
Andrew Clark b1384062d2 Move AsyncUpdates flag check to class-only path (#9570) 2017-05-01 13:23:54 -07:00
Andrew Clark 835c21a5ef Don't prevent extensions on Fiber if using bad Map polyfill (#9572)
Many Map polyfills work by adding an extra field to the key type.

In the future, we'll likely print a warning.
2017-05-01 13:23:37 -07:00
Abhay Nikam 1f5693ec67 Warning message updated if defaultProps were defined as an instance property (#9493)
* Updated the warning message for setting defaultProps on instance property.

* Updated the testcases for the defaultProps warning.

* Updated the warning message for defaultProps set on instance property.
2017-05-01 13:30:40 -05:00
Manas 182642b2ea Fiber ReactDOM shouldn't throw on import in Node environment if it's unused (#9389)
* Fixes #9102 by fake polyfilling rAF (and rIC)

* Ensure we restore globals even if test fails + minor nits

* Remove periods
2017-04-27 13:13:03 +01:00
Nathan Hunzaker a9d0deb8e1 Consolidate events between EventConstants and BrowserEventEmitter (#9512) 2017-04-25 09:24:10 -07:00
Brian Vaughn 9d225b5a44 Stop passing prevContext param to componentDidUpdate (#8631) 2017-04-21 13:15:22 -07:00
Soo Jae Hwang ec527cc834 [WIP] Warn in dev if shouldComponentUpdate is defined on PureComponent (#9240)
* Add test for React.PureComponent

* Add warning when shouldComponentUpdate is declared in a PureComponent

* Add actionable warning

* Add warning in Fiber

* Format added code by running yarn prettier

* Move pure sCU check to checkClassInstance

That way it warns before the component updates
2017-04-21 09:55:16 -05:00
Abhay Nikam 5518bd44a9 Warning added if defaultProps were defined as an instance property (#9433)
* Added warning when defaultProps was defined as an instance property

* Added testcases to check warning message for defaultProps

* Update fiber tests
2017-04-21 09:46:19 -05:00
Andrew Clark 28bc8860bc Run prettier after update to 1.2 in master 2017-04-20 11:39:04 -07:00
Andrew Clark b4d77b98ed Fix subtree tests so that async component is not top-level 2017-04-20 11:38:13 -07:00
Andrew Clark 9b676a7d0b Remove enableAsyncSubtreeAPI from host config
Use a ReactFeatureFlag instead. It won't be per-renderer, but we likely
won't need that.

When enableAsyncSubtreeAPI is false, unstable_asyncUpdates is ignored,
but does not warn or throw. That way if we discover a bug in async mode,
we can flip the flag and revert back to sync without code changes.
2017-04-20 11:38:13 -07:00
Andrew Clark 0c896ffe6b Change unstable_asyncUpdates from an instance to a static property
This lets us check for its existence before the instance is constructed.

Also works with functional components.
2017-04-20 11:38:13 -07:00
Andrew Clark 488b973d68 Use number type for bitfields
Unions don't enumerate all the possible combinations of bitfields. I'm
not actually sure why this was type-checking before.

number doesn't provide much safety but it's more correct.
2017-04-20 11:38:13 -07:00
Andrew Clark f69748601d Remove unstable_asyncRender() API in favor of always using a wrapper 2017-04-20 11:38:13 -07:00
Andrew Clark abd07dffb3 Rename contextTag -> internalContextTag 2017-04-20 11:38:13 -07:00
Andrew Clark 26d70fd334 Add enableAsyncSubtreeAPI to host config
Allows us to control this feature on a per-renderer basis
2017-04-20 11:37:18 -07:00
Andrew Clark ada638a064 Run prettier 2017-04-20 11:37:18 -07:00
Andrew Clark 609e97ebe7 instance.unstable_asyncUpdates = true creates an async subtree
Same behavior as unstable_asyncRender. Can be used to wrap a specific
subtree, rather than an entire root.
2017-04-20 11:37:18 -07:00
Andrew Clark 3bf398bcbc ReactDOM.unstable_asyncRender creates an async-by-default tree
The default priority of updates in a async tree is LowPriority, rather
than SynchronousPriority.

Warns if you call unstable_asyncRender on a tree that was created with
the normal, sync ReactDOM.render.
2017-04-20 11:37:18 -07:00
Andrew Clark 6f8fec4b80 Use different default priority depending on the AsyncUpdate context flag
- A priority context of NoWork represents the default priority
- Changed the signature of getPriorityContext to accept the fiber that
is about to be updated.
2017-04-20 11:36:35 -07:00
Andrew Clark 1b388366c1 Inherit contextTag from the parent on creation
A fiber has all the context flags of its parent. It may also add
additional ones during construction/mount. After mounting, contextTag
shouldn't change.
2017-04-20 11:35:08 -07:00
Andrew Clark f1df675b93 Add contextTag field to Fiber type
contextTag is a bitmask that describes properties about the fiber
and its subtree. For example, the AsyncUpdates flag indicates whether
the subtree should use async scheduling.

When a fiber is created, it inherits the bitmask of its parent.
2017-04-20 11:35:08 -07:00
Ben Alpert b1768b5a48 Prettier 1.2 (#9462) 2017-04-20 11:18:33 -07:00