Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add unstable APIs for async rendering to test renderer #12478

Merged
merged 1 commit into from
Mar 28, 2018

Conversation

acdlite
Copy link
Collaborator

@acdlite acdlite commented Mar 28, 2018

These are based on the ReactNoop renderer, which we use to test React itself. This gives library authors (Relay, Apollo, Redux, et al.) a way to test their components for async compatibility.

  • Pass unstable_isAsync to TestRenderer.create to create an async renderer instance. This causes updates to be lazily flushed.
  • renderer.unstable_yield tells React to yield execution after the currently rendering component.
  • renderer.unstable_flushAll flushes all pending async work, and returns an array of yielded values.
  • renderer.unstable_flushThrough receives an array of expected values, begins rendering, and stops once those values have been yielded. It returns the array of values that are actually yielded. The user should assert that they are equal.

Although we've used this pattern successfully in our own tests, I'm not sure if these are the final APIs we'll make public.

@acdlite acdlite requested a review from bvaughn March 28, 2018 21:00
@acdlite acdlite changed the title Add unstable APIs for async renderering to test renderer Add unstable APIs for async rendering to test renderer Mar 28, 2018
Copy link
Contributor

@bvaughn bvaughn left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I checked out this branch and converted some of my NOOP tests to use the new test renderer API. Worked well. 👍

import typeof * as PersistentFeatureFlagsType from './ReactFeatureFlags.persistent';

export const debugRenderPhaseSideEffects = false;
export const debugRenderPhaseSideEffectsForStrictMode = false;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice!

@bvaughn
Copy link
Contributor

bvaughn commented Mar 28, 2018

🤔 Looks like some tests are failing on CI, although they all pass for me locally.

Edit: Looks like it's the test-build target that's failing. I was only running test and test-prod locally. I can reproduce the error after running yarn build && yarn test-build locally.

These are based on the ReactNoop renderer, which we use to test React
itself. This gives library authors (Relay, Apollo, Redux, et al.) a way
to test their components for async compatibility.

- Pass `unstable_isAsync` to `TestRenderer.create` to create an async
renderer instance. This causes updates to be lazily flushed.
- `renderer.unstable_yield` tells React to yield execution after the
currently rendering component.
- `renderer.unstable_flushAll` flushes all pending async work, and
returns an array of yielded values.
- `renderer.unstable_flushThrough` receives an array of expected values,
begins rendering, and stops once those values have been yielded. It
returns the array of values that are actually yielded. The user should
assert that they are equal.

Although we've used this pattern successfully in our own tests, I'm not
sure if these are the final APIs we'll make public.
@acdlite
Copy link
Collaborator Author

acdlite commented Mar 28, 2018

Yeah I fucked up a feature flag config. Pushed an update.

@bvaughn
Copy link
Contributor

bvaughn commented Mar 28, 2018

Cool. That change fixed it for me locally.

@acdlite acdlite merged commit 268a3f6 into facebook:master Mar 28, 2018
This was referenced Mar 30, 2018
rhagigi pushed a commit to rhagigi/react that referenced this pull request Apr 19, 2018
These are based on the ReactNoop renderer, which we use to test React
itself. This gives library authors (Relay, Apollo, Redux, et al.) a way
to test their components for async compatibility.

- Pass `unstable_isAsync` to `TestRenderer.create` to create an async
renderer instance. This causes updates to be lazily flushed.
- `renderer.unstable_yield` tells React to yield execution after the
currently rendering component.
- `renderer.unstable_flushAll` flushes all pending async work, and
returns an array of yielded values.
- `renderer.unstable_flushThrough` receives an array of expected values,
begins rendering, and stops once those values have been yielded. It
returns the array of values that are actually yielded. The user should
assert that they are equal.

Although we've used this pattern successfully in our own tests, I'm not
sure if these are the final APIs we'll make public.
NMinhNguyen referenced this pull request in enzymejs/react-shallow-renderer Jan 29, 2020
These are based on the ReactNoop renderer, which we use to test React
itself. This gives library authors (Relay, Apollo, Redux, et al.) a way
to test their components for async compatibility.

- Pass `unstable_isAsync` to `TestRenderer.create` to create an async
renderer instance. This causes updates to be lazily flushed.
- `renderer.unstable_yield` tells React to yield execution after the
currently rendering component.
- `renderer.unstable_flushAll` flushes all pending async work, and
returns an array of yielded values.
- `renderer.unstable_flushThrough` receives an array of expected values,
begins rendering, and stops once those values have been yielded. It
returns the array of values that are actually yielded. The user should
assert that they are equal.

Although we've used this pattern successfully in our own tests, I'm not
sure if these are the final APIs we'll make public.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants