Commit Graph
42 Commits
Author SHA1 Message Date
Dan AbramovandGitHub 46d5afc54d Replace console.error() with a throw in setTimeout() as last resort exception logging (#13310)
* Add a regression test for #13188

* Replace console.error() with a throw in setTimeout() as last resort

* Fix lint and comment

* Fix tests to check we throw after all

* Fix build tests
2018-08-02 18:16:47 +01:00
jddxfandDan Abramov 6d3e262880 Remove unnecessary typeof checks (#13196)
This aligns with #10351 which removed extra check on `injectInternals`.
2018-07-17 20:18:15 +01:00
Thibault MalbrancheandDan Abramov 21ac62c77a Fix a portal unmounting crash for renderers with distinct Instance and Container (#13220)
* Fix Portal unmount

Before that change, currentParent is not set as a container even if it should so it break on react-native and probably other custom renderers

* Assert that *ToContainer() methods receive containers

* Add regression tests

* Add comments
2018-07-17 01:35:33 +01:00
Dan AbramovandGitHub f9358c51c8 Change warning() to automatically inject the stack, and add warningWithoutStack() as opt-out (#13161)
* Use %s in the console calls

* Add shared/warningWithStack

* Convert some warning callsites to warningWithStack

* Use warningInStack in shared utilities and remove unnecessary checks

* Replace more warning() calls with warningWithStack()

* Fixes after rebase + use warningWithStack in react

* Make warning have stack by default; warningWithoutStack opts out

* Forbid builds that may not use internals

* Revert newly added stacks

I changed my mind and want to keep this PR without functional changes. So we won't "fix" any warnings that are already missing stacks. We'll do it in follow-ups instead.

* Fix silly find/replace mistake

* Reorder imports

* Add protection against warning argument count mismatches

* Address review
2018-07-16 22:31:59 +01:00
Dan AbramovandBrian Vaughn e6076ecf48 Remove ad-hoc forks of getComponentName() and fix it (#13197)
* Fix getComponentName() for types with nested $$typeof

* Temporarily remove Profiler ID from messages

* Change getComponentName() signature to take just type

It doesn't actually need the whole Fiber.

* Remove getComponentName() forks in isomorphic and SSR

* Remove unnecessary .type access where we already have a type

* Remove unused type
2018-07-12 07:32:06 -07:00
Dan AbramovandGitHub 5662595677 Refactor stack handling (no functional changes) (#13165)
* Refactor ReactDebugCurrentFiber to use named exports

This makes the difference between it and ReactFiberCurrentFrame a bit clearer.

ReactDebugCurrentFiber is Fiber's own implementation.
ReactFiberCurrentFrame is the thing that holds a reference to the current implementation and delegates to it.

* Unify ReactFiberComponentTreeHook and ReactDebugCurrentFiber

Conceptually they're very related.

ReactFiberComponentTreeHook contains implementation details of reading Fiber's stack (both in DEV and PROD).
ReactDebugCurrentFiber contained a reference to the current fiber, and used the above utility.

It was confusing when to use which one. Colocating them makes it clearer what you could do with each method.

In the future, the plan is to stop using these methods explicitly in most places, and instead delegate to a warning system that includes stacks automatically. This change makes future refactorings simpler by colocating related logic.

* Rename methods to better reflect their meanings

Clarify which are DEV or PROD-only.
Clarify which can return null.

I believe the "work in progress only" was a mistake. I introduced it because I wasn't sure what guarantees we have around .return. But we know for sure that following a .return chain gives us an accurate stack even if we get into WIP trees because we don't have reparenting. So it's fine to relax that naming.

* Rename ReactDebugCurrentFiber -> ReactCurrentFiber

It's not completely DEV-only anymore.
Individual methods already specify whether they work in DEV or PROD in their names.
2018-07-07 01:09:41 +01:00
Brian VaughnandGitHub 6f6b560a64 Renamed selfBaseTime/treeBaseTime Fiber attributes to selfBaseDuration/treeBaseDuration (#13156)
This is an unobservable change to all but the (under development) DevTools Profiler plugin. It is being done so that the plugin can safely feature detect a version of React that supports it. The profiler API has existed since the 16.4.0 release, but it did not support the DevTools plugin prior to PR #13058.

Side note: I am not a big fan of the term "base duration". Both it and "actual duration" are kind of awkward and vague. If anyone has suggestions for better names– this is the best time to bikeshed about them.
2018-07-06 08:25:29 -07:00
Andrew ClarkandGitHub 88d7ed8bfb React.Timeout -> React.Placeholder (#13105)
Changed the API to match what we've been using in our latest discussions.

Our tentative plans are for <Placeholder> to automatically hide the timed-out
children, instead of removing them, so their state is not lost. This part is
not yet implemented. We'll likely have a lower level API that does not include
the hiding behavior. This is also not yet implemented.
2018-07-03 19:47:00 -07:00
Andrew ClarkandGitHub f128fdea48 Suspending outside of strict trees and async trees (#13098)
We can support components that suspend outside of an async mode tree
by immediately committing their placeholders.

In strict mode, the Timeout acts effectively like an error boundary.
Within a single render pass, we unwind to the nearest Timeout and
re-render the placeholder view.

Outside of strict mode, it's not safe to unwind and re-render the
siblings without committing. (Technically, this is true of error
boundaries, too, though probably not a huge deal, since we don't support
using error boundaries for control flow (yet, at least)). We need to be
clever. What we do is pretend the suspended component rendered null.*
There's no unwinding. The siblings commit like normal.

Then, in the commit phase, schedule an update on the Timeout to
synchronously re-render the placeholder. Although this requires an extra
commit, it will not be observable. And because the siblings were not
blocked from committing, they don't have to be strict mode compatible.

Another caveat is that if a component suspends during an async render,
but it's captured by a non-async Timeout, we need to revert to sync
mode. In other words, if any non-async component renders, the entire
tree must complete and commit without yielding.

* The downside of rendering null is that the existing children will be
deleted. We should hide them instead. I'll work on this in a follow-up.
2018-07-03 19:44:19 -07:00
Andrew ClarkandGitHub aa8266c4f7 Prepare placeholders before timing out (#13092)
* Prepare placeholders before timing out

While a tree is suspended, prepare for the timeout by pre-rendering the
placeholder state.

This simplifies the implementation a bit because every render now
results in a completed tree.

* Suspend inside an already timed out Placeholder

A component should be able to suspend inside an already timed out
placeholder. The time at which the placeholder committed is used as 
the start time for a subsequent suspend.

So, if a placeholder times out after 3 seconds, and an inner
placeholder has a threshold of 2 seconds, the inner placeholder will
not time out until 5 seconds total have elapsed.
2018-07-03 19:22:41 -07:00
Andrew ClarkandGitHub 4fe6eec15b Always batch updates of like priority within the same event (#13071)
Expiration times are computed by adding to the current time (the start
time). However, if two updates are scheduled within the same event, we
should treat their start times as simultaneous, even if the actual clock
time has advanced between the first and second call.

In other words, because expiration times determine how updates are
batched, we want all updates of like priority that occur within the same
event to receive the same expiration time. Otherwise we get tearing.

We keep track of two separate times: the current "renderer" time and the
current "scheduler" time. The renderer time can be updated whenever; it
only exists to minimize the calls performance.now.

But the scheduler time can only be updated if there's no pending work,
or if we know for certain that we're not in the middle of an event.
2018-06-19 10:34:19 -07:00
Dan AbramovandGitHub aeda7b745d Remove fbjs dependency (#13069)
* Inline fbjs/lib/invariant

* Inline fbjs/lib/warning

* Remove remaining usage of fbjs in packages/*.js

* Fix lint

* Remove fbjs from dependencies

* Protect against accidental fbjs imports

* Fix broken test mocks

* Allow transitive deps on fbjs/ for UMD bundles

* Remove fbjs from release script
2018-06-19 16:03:45 +01:00
Brian VaughnandGitHub 5578700671 Record "actual" times for all Fibers within a Profiler tree (alt) (#12910)
* Moved actual time fields from Profiler stateNode to Fiber

* Record actual time for all Fibers within a ProfileMode tree

* Changed how profiler accumulates time

This change gives up on accumulating time across renders of different priority, but in exchange- simplifies how the commit phase (reset) code works, and perhaps also makes the profiling code more compatible with future resuming behavior
2018-05-25 14:51:13 -07:00
Brian VaughnandGitHub 13003654e7 Pass "start time" and "commit time" to Profiler callback (#12852)
* Added start time parameter to Profiler onRender callback
* Profiler also captures commit time
* Only init Profiler stateNode if enableProfilerTimer feature flag enabled
2018-05-21 09:49:22 -07:00
Dan AbramovandGitHub 47b003a828 Resolve host configs at build time (#12792)
* Extract base Jest config

This makes it easier to change the source config without affecting the build test config.

* Statically import the host config

This changes react-reconciler to import HostConfig instead of getting it through a function argument.

Rather than start with packages like ReactDOM that want to inline it, I started with React Noop and ensured that *custom* renderers using react-reconciler package still work. To do this, I'm making HostConfig module in the reconciler look at a global variable by default (which, in case of the react-reconciler npm package, ends up being the host config argument in the top-level scope).

This is still very broken.

* Add scaffolding for importing an inlined renderer

* Fix the build

* ES exports for renderer methods

* ES modules for host configs

* Remove closures from the reconciler

* Check each renderer's config with Flow

* Fix uncovered Flow issue

We know nextHydratableInstance doesn't get mutated inside this function, but Flow doesn't so it thinks it may be null.
Help Flow.

* Prettier

* Get rid of enable*Reconciler flags

They are not as useful anymore because for almost all cases (except third party renderers) we *know* whether it supports mutation or persistence.

This refactoring means react-reconciler and react-reconciler/persistent third-party packages now ship the same thing.
Not ideal, but this seems worth how simpler the code becomes. We can later look into addressing it by having a single toggle instead.

* Prettier again

* Fix Flow config creation issue

* Fix imprecise Flow typing

* Revert accidental changes
2018-05-19 11:29:11 +01:00
Dan AbramovandGitHub b245795de3 Re-enable Flow for ReactFiber and fix Flow issues (#12842)
* Lint for untyped imports and enable Flow typing in ReactFiber

* Re-enable Flow for ReactFiber and fix Flow issues

* Avoid an invariant in DEV-only code

I just introduced it, but on a second thought, it's better to keep it as a warning.

* Address review
2018-05-17 17:14:12 +01:00
Dan AbramovandGitHub 9097f3cdf0 Delete React Call/Return experiment (#12820) 2018-05-15 19:16:29 +01:00
Andrew ClarkandGitHub 6565795377 Suspense (#12279)
* Timeout component

Adds Timeout component. If a promise is thrown from inside a Timeout component,
React will suspend the in-progress render from committing. When the promise
resolves, React will retry. If the render is suspended for longer than the
maximum threshold, the Timeout switches to a placeholder state.

The timeout threshold is defined as the minimum of:
- The expiration time of the current render
- The `ms` prop given to each Timeout component in the ancestor path of the
thrown promise.

* Add a test for nested fallbacks

Co-authored-by: Andrew Clark <acdlite@fb.com>

* Resume on promise rejection

React should resume rendering regardless of whether it resolves
or rejects.

* Wrap Suspense code in feature flag

* Children of a Timeout must be strict mode compatible

Async is not required for Suspense, but strict mode is.

* Simplify list of pending work

Some of this was added with "soft expiration" in mind, but now with our revised
model for how soft expiration will work, this isn't necessary.

It would be nice to remove more of this, but I think the list itself is inherent
because we need a way to track the start times, for <Timeout ms={ms} />.

* Only use the Timeout update queue to store promises, not for state

It already worked this way in practice.

* Wrap more Suspense-only paths in the feature flag

* Attach promise listener immediately on suspend

Instead of waiting for commit phase.

* Infer approximate start time using expiration time

* Remove list of pending priority levels

We can replicate almost all the functionality by tracking just five
separate levels: the highest/lowest priority pending levels, the
highest/lowest priority suspended levels, and the lowest pinged level.

We lose a bit of granularity, in that if there are multiple levels of
pending updates, only the first and last ones are known. But in practice
this likely isn't a big deal.

These heuristics are almost entirely isolated to a single module and
can be adjusted later, without API changes, if necessary.

Non-IO-bound work is not affected at all.

* ReactFiberPendingWork -> ReactFiberPendingPriority

* Renaming method names from "pending work" to "pending priority"

* Get rid of SuspenseThenable module

Idk why I thought this was neccessary

* Nits based on Sebastian's feedback

* More naming nits + comments

* Add test for hiding a suspended tree to unblock

* Revert change to expiration time rounding

This means you have to account for the start time approximation
heuristic when writing Suspense tests, but that's going to be
true regardless.

When updating the tests, I also made a fix related to offscreen
priority. We should never timeout inside a hidden tree.

* palceholder -> placeholder
2018-05-10 18:09:10 -07:00
Brian VaughnandGitHub fc3777b1fe Add Profiler component for collecting new render timing info (#12745)
Add a new component type, Profiler, that can be used to collect new render time metrics. Since this is a new, experimental API, it will be exported as React.unstable_Profiler initially.

Most of the functionality for this component has been added behind a feature flag, enableProfileModeMetrics. When the feature flag is disabled, the component will just render its children with no additional behavior. When the flag is enabled, React will also collect timing information and pass it to the onRender function (as described below).
2018-05-10 15:25:32 -07:00
Andrew ClarkandGitHub b548b3cd64 Decouple update queue from Fiber type (#12600)
* Decouple update queue from Fiber type

The update queue is in need of a refactor. Recent bugfixes (#12528) have
exposed some flaws in how it's modeled. Upcoming features like Suspense
and [redacted] also rely on the update queue in ways that weren't
anticipated in the original design.

Major changes:

- Instead of boolean flags for `isReplace` and `isForceUpdate`, updates
have a `tag` field (like Fiber). This lowers the cost for adding new
types of updates.
- Render phase updates are special cased. Updates scheduled during
the render phase are dropped if the work-in-progress does not commit.
This is used for `getDerivedStateFrom{Props,Catch}`.
- `callbackList` has been replaced with a generic effect list. Aside
from callbacks, this is also used for `componentDidCatch`.

* Remove first class UpdateQueue types and use closures instead

I tried to avoid this at first, since we avoid it everywhere else in the Fiber
codebase, but since updates are not in a hot path, the trade off with file size
seems worth it.

* Store captured errors on a separate part of the update queue

This way they can be reused independently of updates like
getDerivedStateFromProps. This will be important for resuming.

* Revert back to storing hasForceUpdate on the update queue

Instead of using the effect tag. Ideally, this would be part of the
return type of processUpdateQueue.

* Rename UpdateQueue effect type back to Callback

I don't love this name either, but it's less confusing than UpdateQueue
I suppose. Conceptually, this is usually a callback: setState callbacks,
componentDidCatch. The only case that feels a bit weird is Timeouts,
which use this effect to attach a promise listener. I guess that kinda
fits, too.

* Call getDerivedStateFromProps every render, even if props did not change

Rather than enqueue a new setState updater for every props change, we
can skip the update queue entirely and merge the result into state at
the end. This makes more sense, since "receiving props" is not an event
that should be observed. It's still a bit weird, since eventually we do
persist the derived state (in other words, it accumulates).

* Store captured effects on separate list from "own" effects (callbacks)

For resuming, we need the ability to discard the "own" effects while
reusing the captured effects.

* Optimize for class components

Change `process` and `callback` to match the expected payload types
for class components. I had intended for the update queue to be reusable
for both class components and a future React API, but we'll likely have
to fork anyway.

* Only double-invoke render phase lifecycles functions in DEV

* Use global state to track currently processing queue in DEV
2018-04-22 23:05:28 -07:00
Brian VaughnandGitHub e1a106a071 New commit phase lifecycle: getSnapshotBeforeUpdate (#12404)
* Implemented new getSnapshotBeforeUpdate lifecycle
* Store snapshot value from Fiber to instance (__reactInternalSnapshotBeforeUpdate)
* Use commitAllHostEffects() traversal for getSnapshotBeforeUpdate()
* Added DEV warnings and tests for new lifecycle
* Don't invoke legacy lifecycles if getSnapshotBeforeUpdate() is defined. DEV warn about this.
* Converted did-warn objects to Sets in ReactFiberClassComponent
* Replaced redundant new lifecycle checks in a few methods
* Check for polyfill suppress flag on cWU as well before warning
* Added Snapshot bit to HostEffectMask
2018-03-26 13:28:10 -07:00
Dan AbramovandGitHub 7d31311de3 Don't pass a Fiber to showErrorDialog() (#12445)
* Don't pass a Fiber to showErrorDialog()

* Only fill in the fields for classes

* Reorder for clarity
2018-03-23 21:52:53 +00:00
Dan AbramovandGitHub 3553489f7b Fix now-missing errorInfo argument to componentDidCatch() (#12416)
* Add a failing test verifying componentInfo is missing

* Pass componentInfo to componentDidCatch and getDerivedStateFromCatch

* Only expect stack in DEV

* Don't pass the stack to getDerivedStateFromCatch()
2018-03-21 16:38:24 +00:00
Roman HotsiyandDan Abramov d38616d693 Fix typo in unexpected ref object warning (#12377) 2018-03-15 12:30:50 +00:00
Brian VaughnandGitHub 77196100b8 Renamed createRef .value attribute to .current (#12375)
* Renamed createRef .value attribute to .current

* Warn if invalid ref object is passed
2018-03-14 09:43:20 -07:00
Andrew ClarkandGitHub 94518b068b Add stack unwinding phase for handling errors (#12201)
* Add stack unwinding phase for handling errors

A rewrite of error handling, with semantics that more closely match
stack unwinding.

Errors that are thrown during the render phase unwind to the nearest
error boundary, like before. But rather than synchronously unmount the
children before retrying, we restart the failed subtree within the same
render phase. The failed children are still unmounted (as if all their
keys changed) but without an extra commit.

Commit phase errors are different. They work by scheduling an error on
the update queue of the error boundary. When we enter the render phase,
the error is popped off the queue. The rest of the algorithm is
the same.

This approach is designed to work for throwing non-errors, too, though
that feature is not implemented yet.

* Add experimental getDerivedStateFromCatch lifecycle

Fires during the render phase, so you can recover from an error within the same
pass. This aligns error boundaries more closely with try-catch semantics.

Let's keep this behind a feature flag until a future release. For now, the
recommendation is to keep using componentDidCatch. Eventually, the advice will
be to use getDerivedStateFromCatch for handling errors and componentDidCatch
only for logging.

* Reconcile twice to remount failed children, instead of using a boolean

* Handle effect immediately after its thrown

This way we don't have to store the thrown values on the effect list.

* ReactFiberIncompleteWork -> ReactFiberUnwindWork

* Remove startTime

* Remove TypeOfException

We don't need it yet. We'll reconsider once we add another exception type.

* Move replay to outer catch block

This moves it out of the hot path.
2018-02-23 17:38:42 -08:00
Dominic GannawayandGitHub 8dc8f88d5a Adds createRef() as per RFC (#12162)
* Adds createRef() as per RFC
2018-02-06 20:19:49 +00:00
Sebastian MarkbågeandGitHub 6031bea239 Add Experimental Fabric Renderer (#12069) 2018-01-22 09:58:35 -08:00
Raphael AmorimandDan Abramov 37e4329bc8 Remove vars (#11766)
* react: convert packages/react

* react-reconciler: convert packages/react-reconciler

* react-noop-renderer: convert packages/react-noop-renderer

* react-dom: convert packages/react-dom/src/shared

* react-dom: convert packages/react-dom/src/server
2017-12-05 13:47:57 +00:00
Raphael AmorimandDan Abramov 6074664f73 react-reconciler: convert vars into let/const (#11729) 2017-11-30 23:59:05 +00:00
Sebastian MarkbågeandGitHub acabf11245 Update Flow and Fix Hydration Types (#11493)
* Update Flow

* Fix createElement() issue

The * type was too ambiguous. It's always a string so what's the point?

Suppression for missing Flow support for {is: ''} web component argument to createElement() didn't work for some reason.
I don't understand what the regex is testing for anyway (a task number?) so I just removed that, and suppression got fixed.

* Remove deleted $Abstract<> feature

* Expand the unsound isAsync check

Flow now errors earlier because it can't find .type on a portal.

* Add an unsafe cast for the null State in UpdateQueue

* Introduce "hydratable instance" type

The Flow error here highlighted a quirk in our typing of hydration.
React only really knows about a subset of all possible nodes that can
exist in a hydrated tree. Currently we assume that the host renderer
filters them out to be either Instance or TextInstance. We also assume
that those are different things which they might not be. E.g. it could
be fine for a renderer to render "text" as the same type as one of the
instances, with some default props.

We don't really know what it will be narrowed down to until we call
canHydrateInstance or canHydrateTextInstance. That's when the type is
truly refined.

So to solve this I use a different type for hydratable instance that is
used in that temporary stage between us reading it from the DOM and until
it gets refined by canHydrate(Text)Instance.

* Have the renderer refine Hydratable Instance to Instance or Text Instance

Currently we assume that if canHydrateInstance or canHydrateTextInstance
returns true, then the types also match up. But we don't tell that to Flow.

It just happens to work because `fiber.stateNode` is still `any`.

We could potentially use some kind of predicate typing but instead
of that I can just return null or instance from the "can" tests.

This ensures that the renderer has to do the refinement properly.
2017-11-11 17:00:33 -08:00
Clement HoangandGitHub 94f44aeba7 Update prettier to 1.8.1 (#10785)
* Change prettier dependency in package.json version 1.8.1

* Update yarn.lock

* Apply prettier changes

* Fix ReactDOMServerIntegration-test.js

* Fix test for ReactDOMComponent-test.js
2017-11-07 18:09:33 +00:00
Dan AbramovandGitHub 3b27160f82 Put perf integration behind a feature flag (#11455)
* Enable User Timing API integration with a feature flag

* Expose a way to toggle user timing flag in www

* Update ReactNativeCSFeatureFlags.js

* Update ReactFeatureFlags.js
2017-11-06 16:07:08 +00:00
Dan AbramovandGitHub 46f7b0d945 Fix dead code elimination for feature flags (#11453)
* Fix dead code elimination for feature flags

Turning flags into named exports fixes dead code elimination.

This required some restructuring of how we verify that flag types match up. I used the Check<> trick combined with import typeof, as suggested by @calebmer.

For www, we can no longer re-export `require('ReactFeatureFlags')` directly, and instead destructure it. This means flags have to be known at init time. This is already the case so it's not a problem. In fact it may be better since it removes extra property access in tight paths.

For things that we *want* to be dynamic on www (currently, only performance flag) we can export a function to toggle it, and then put it on the secret exports. In fact this is better than just letting everyone mutate the flag at arbitrary times since we can provide, e.g., a ref counting interface to it.

* Record sizes
2017-11-06 14:14:48 +00:00
Dan AbramovandGitHub 45c1ff348e Remove unnecessary 'use strict' in the source (#11433)
* Remove use strict from ES modules

* Delete unused file

This was unused since Stack.
2017-11-02 20:32:48 +00:00
Dan AbramovandGitHub 21d0c11523 Convert the Source to ES Modules (#11389)
* Update transforms to handle ES modules

* Update Jest to handle ES modules

* Convert react package to ES modules

* Convert react-art package to ES Modules

* Convert react-call-return package to ES Modules

* Convert react-test-renderer package to ES Modules

* Convert react-cs-renderer package to ES Modules

* Convert react-rt-renderer package to ES Modules

* Convert react-noop-renderer package to ES Modules

* Convert react-dom/server to ES modules

* Convert react-dom/{client,events,test-utils} to ES modules

* Convert react-dom/shared to ES modules

* Convert react-native-renderer to ES modules

* Convert react-reconciler to ES modules

* Convert events to ES modules

* Convert shared to ES modules

* Remove CommonJS support from transforms

* Move ReactDOMFB entry point code into react-dom/src

This is clearer because we can use ES imports in it.

* Fix Rollup shim configuration to work with ESM

* Fix incorrect comment

* Exclude external imports without side effects

* Fix ReactDOM FB build

* Remove TODOs I don’t intend to fix yet
2017-11-02 19:50:03 +00:00
Dan AbramovandGitHub 2c0a8fb99e Add react-call-return package (#11364) 2017-10-25 22:23:55 +03:00
Dan AbramovandGitHub 087c48bb36 Reorder imports (#11359)
* Reorder imports

* Record sizes
2017-10-25 21:07:54 +03:00
Dan AbramovandGitHub 1eed302d34 Drop Haste (#11303)
* Use relative paths in packages/react

* Use relative paths in packages/react-art

* Use relative paths in packages/react-cs

* Use relative paths in other packages

* Fix as many issues as I can

This uncovered an interesting problem where ./b from package/src/a would resolve to a different instantiation of package/src/b in Jest.

Either this is a showstopper or we can solve it by completely fobbidding remaining /src/.

* Fix all tests

It seems we can't use relative requires in tests anymore. Otherwise Jest becomes confused between real file and symlink.
https://github.com/facebook/jest/issues/3830

This seems bad... Except that we already *don't* want people to create tests that import individual source files.
All existing cases of us doing so are actually TODOs waiting to be fixed.

So perhaps this requirement isn't too bad because it makes bad code looks bad.

Of course, if we go with this, we'll have to lint against relative requires in tests.
It also makes moving things more painful.

* Prettier

* Remove @providesModule

* Fix remaining Haste imports I missed earlier

* Fix up paths to reflect new flat structure

* Fix Flow

* Fix CJS and UMD builds

* Fix FB bundles

* Fix RN bundles

* Prettier

* Fix lint

* Fix warning printing and error codes

* Fix buggy return

* Fix lint and Flow

* Use Yarn on CI

* Unbreak Jest

* Fix lint

* Fix aliased originals getting included in DEV

Shouldn't affect correctness (they were ignored) but fixes DEV size regression.

* Record sizes

* Fix weird version in package.json

* Tweak bundle labels

* Get rid of output option by introducing react-dom/server.node

* Reconciler should depend on prop-types

* Update sizes last time
2017-10-25 02:55:00 +03:00
Dan AbramovandGitHub 313611572b Reorganize code structure (#11288)
* Move files and tests to more meaningful places

* Fix the build

Now that we import reconciler via react-reconciler, I needed to make a few tweaks.

* Update sizes

* Move @preventMunge directive to FB header

* Revert unintentional change

* Fix Flow coverage

I forgot to @flow-ify those files. This uncovered some issues.

* Prettier, I love you but you're bringing me down
Prettier, I love you but you're bringing me down

Like a rat in a cage
Pulling minimum wage
Prettier, I love you but you're bringing me down

Prettier, you're safer and you're wasting my time
Our records all show you were filthy but fine
But they shuttered your stores
When you opened the doors
To the cops who were bored once they'd run out of crime

Prettier, you're perfect, oh, please don't change a thing
Your mild billionaire mayor's now convinced he's a king
So the boring collect
I mean all disrespect
In the neighborhood bars I'd once dreamt I would drink

Prettier, I love you but you're freaking me out
There's a ton of the twist but we're fresh out of shout
Like a death in the hall
That you hear through your wall
Prettier, I love you but you're freaking me out

Prettier, I love you but you're bringing me down
Prettier, I love you but you're bringing me down
Like a death of the heart
Jesus, where do I start?
But you're still the one pool where I'd happily drown

And oh! Take me off your mailing list
For kids who think it still exists
Yes, for those who think it still exists
Maybe I'm wrong and maybe you're right
Maybe I'm wrong and maybe you're right
Maybe you're right, maybe I'm wrong
And just maybe you're right

And oh! Maybe mother told you true
And there'll always be somebody there for you
And you'll never be alone
But maybe she's wrong and maybe I'm right
And just maybe she's wrong
Maybe she's wrong and maybe I'm right
And if so, here's this song!
2017-10-19 19:50:24 +01:00
Sebastian MarkbågeandGitHub b52a5624e9 [CS] Persistent Updates (#11260)
* Update build size

* [CS] Clone container instead of new root concept

The extra "root" concept is kind of unnecessary. Instead of having a
mutable container even in the persistent mode, I'll instead make the
container be immutable too and be cloned. Then the "commit" just becomes
swapping the previous container for the new one.

* Change the signature or persistence again

We may need to clone without any updates, e.g. when the children are changed.

Passing in the previous node is not enough to recycle since it won't have the
up-to-date props and children. It's really only useful to for allocation pooling.

* Implement persistent updates

This forks the update path for host fibers. For mutation mode we mark
them as having an effect. For persistence mode, we clone the stateNode with
new props/children.

Next I'll do HostRoot and HostPortal.

* Refine protocol into a complete and commit phase

finalizeContainerChildren will get called at the complete phase.
replaceContainer will get called at commit.

Also, drop the keepChildren flag. We'll never keep children as we'll never
update a container if none of the children has changed.

* Implement persistent updates of roots and portals

These are both "containers". Normally we rely on placement/deletion effects
to deal with insertions into the containers. In the persistent mode we need
to clone the container and append all the changed children to it.

I needed somewhere to store these new containers before they're committed
so I added another field.

* Commit persistent work at the end by swapping out the container

* Unify cloneOrRecycle

Originally I tried to make the recyclable instance nullable but Flow didn't
like that and it's kind of sketchy since the instance type might not be
nullable.

However, the real difference which one we call is depending on whether they
are equal. We can just offload that to the renderer. Most of them won't
need to know about this at all since they'll always clone or just create
new.

The ones that do know now have to be careful to compare them so they don't
reuse an existing instance but that's probably fine to simplify the
implementation and API.

* Add persistent noop renderer for testing

* Add basic persistent tree test

* Test bail out

This adds a test for bailouts. This revealed a subtle bug. We don't set the
return pointer when stepping into newly created fibers because there
can only be one. However, since I'm reusing this mechanism for persistent
updates, I'll need to set the return pointer because a bailed out tree
won't have the right return pointer.

* Test persistent text nodes

Found another bug.

* Add persistent portal test

This creates a bit of an unfortunate feature testing in the unmount
branch.

That's because we want to trigger nested host deletions in portals in the
mutation mode.

* Don't consider container when determining portal identity

Basically, we can't use the container to determine if we should keep
identity and update an existing portal instead of recreate it. Because
for persistent containers, there is no permanent identity.

This makes it kind of strange to even use portals in this mode. It's
probably more ideal to have another concept that has permanent identity
rather than trying to swap out containers.

* Clear portals when the portal is deleted

When a portal gets deleted we need to create a new empty container and
replace the current one with the empty one.

* Add renderer mode flags for dead code elimination

* Simplify ReactNoop fix

* Add new type to the host config for persistent configs

We need container to stay as the persistent identity of the root atom.
So that we can refer to portals over time.

Instead, I'll introduce a new type just to temporarily hold the children
of a container until they're ready to be committed into the permanent
container. Essentially, this is just a fancy array that is not an array
so that the host can choose data structure/allocation for it.

* Implement new hooks

Now containers are singletons and instead their children swap. That way
portals can use the container as part of their identity again.

* Update build size and error codes

* Address comment

* Move new files to new location
2017-10-18 18:28:23 -07:00
Dan AbramovandGitHub d9c1dbd617 Use Yarn Workspaces (#11252)
* Enable Yarn workspaces for packages/*

* Move src/isomorphic/* into packages/react/src/*

* Create index.js stubs for all packages in packages/*

This makes the test pass again, but breaks the build because npm/ folders aren't used yet.
I'm not sure if we'll keep this structure--I'll just keep working and fix the build after it settles down.

* Put FB entry point for react-dom into packages/*

* Move src/renderers/testing/* into packages/react-test-renderer/src/*

Note that this is currently broken because Jest ignores node_modules,
and so Yarn linking makes Jest skip React source when transforming.

* Remove src/node_modules

It is now unnecessary. Some tests fail though.

* Add a hacky workaround for Jest/Workspaces issue

Jest sees node_modules and thinks it's third party code.

This is a hacky way to teach Jest to still transform anything in node_modules/react*
if it resolves outside of node_modules (such as to our packages/*) folder.

I'm not very happy with this and we should revisit.

* Add a fake react-native package

* Move src/renderers/art/* into packages/react-art/src/*

* Move src/renderers/noop/* into packages/react-noop-renderer/src/*

* Move src/renderers/dom/* into packages/react-dom/src/*

* Move src/renderers/shared/fiber/* into packages/react-reconciler/src/*

* Move DOM/reconciler tests I previously forgot to move

* Move src/renderers/native-*/* into packages/react-native-*/src/*

* Move shared code into packages/shared

It's not super clear how to organize this properly yet.

* Add back files that somehow got lost

* Fix the build

* Prettier

* Add missing license headers

* Fix an issue that caused mocks to get included into build

* Update other references to src/

* Re-run Prettier

* Fix lint

* Fix weird Flow violation

I didn't change this file but Flow started complaining.
Caleb said this annotation was unnecessarily using $Abstract though so I removed it.

* Update sizes

* Fix stats script

* Fix packaging fixtures

Use file: instead of NODE_PATH since NODE_PATH.
NODE_PATH trick only worked because we had no react/react-dom in root node_modules, but now we do.

file: dependency only works as I expect in Yarn, so I moved the packaging fixtures to use Yarn and committed lockfiles.
Verified that the page shows up.

* Fix art fixture

* Fix reconciler fixture

* Fix SSR fixture

* Rename native packages
2017-10-19 00:22:21 +01:00