* WIP Improve error message thrown in Fiber with multiple copies of React **what is the change?:** Adding an 'invariant' with detailed error message for the problem that occurs when you load two copies of React with the Fiber reconciler. WIP: - Is there any other likely cause for this error besides two copies of React? - How can we make the message more clear? Still TODO: - Write a unit test - Write a documentation page and create the link to the page, similar to https://facebook.github.io/react/warnings/refs-must-have-owner.html It would also be nice to have a page with instructions on how to fix common cases of accidental double-loading of React, but we can open a separate issue on that and let the community do it. **why make this change?:** This error comes up relatively often and we want to make things clear when it happens in v16.0+ **test plan:** WIP **issue:** Fixes #9962 * Add improved warning and docs for 'refs must have owner' in Fiber **what is the change?:** - Added warning in the place where this error is thrown in Fiber, to get parity with older versions of React. - Updated docs to mention new error message as well as old one. I started to write a new docs page for the new error, and realized the content was the same as the old one. So then I just updated the existing error page. **why make this change?:** We want to avoid confusion when this error is thrown from React v16. **test plan:** - manually inspected docs page - manually tested in a CRA to trigger the error message (Flarnie will insert screenshots) **issue:** Fixes #9962 Related to #8854 * Add test for the informative warning around multiple react copies @gaearon debugged the test for this and now it works!!!!!!!!!!!!!!! !!!!!!!!!!!!!!!!!!!!!!!!!!!!! :) **what is the change?:** We now test for the warning that the previous commits add in Fiber, and also test for the old warning in the stack reconciler. **why make this change?:** This is an especially important warning, and we want to know that it will fire correctly. **test plan:** `yarn test src/renderers/__tests__/multiple-copies-of-react-test.js` `REACT_DOM_JEST_USE_FIBER=1 yarn test src/renderers/__tests__/multiple-copies-of-react-test.js` * Fix up test for 'multiple copies of react' **what is the change?:** refactor test for 'multiple copies of React' to be simpler and remove some copypasta * run prettier * Fix conditionals in 'multiple copies of react' test **what is the change?:** When moving the 'fiber' and 'non-fiber' conditions from two assertions into one, we copy pasted the wrong message into the 'fiber' condition. This wasn't caught because we were using an outdated name for the 'fiber' constant when running the tests locally with fiber enabled. This fixes the copy-paste error and we now are actually running the tests with fiber enabled locally. * Run scripts/fiber/record-tests
React Documentation & Website
Read the React Documentation
This folder is not the right place to read the documentation.
Instead, head over to the React website to read it.
This folder only contains the source code for the website.
Installation
If you are working on the site, you will want to install and run a local copy of it.
We use Jekyll to build the site using (mostly) Markdown, and we host it by pushing HTML to GitHub Pages.
Dependencies
In order to use Jekyll, you will need to have Ruby installed. macOS comes pre-installed with Ruby, but you may need to update RubyGems (via gem update --system).
Otherwise, RVM and rbenv are popular ways to install Ruby.
The version of the Pygment syntax highlighter used by Jekyll requires Python 2.7.x (not 3.x). macOS comes pre-installed with Python 2.7, but you may need to install it on other OSs.
- Python (version 2.7.x)
Once you have RubyGems and installed Bundler (via gem install bundler), use it to install the dependencies:
$ cd react/docs
$ bundle install # Might need sudo.
$ npm install
Instructions
The site requires React, so first make sure you've built the project (via grunt).
Use Jekyll to serve the website locally (by default, at http://localhost:4000):
$ cd react/docs
$ bundle exec rake
$ bundle exec rake fetch_remotes
$ bundle exec jekyll serve -w
$ open http://localhost:4000/react/index.html
We use SASS (with Bourbon) for our CSS, and we use JSX to transform some of our JS. If you only want to modify the HTML or Markdown, you do not have to do anything because we package pre-compiled copies of the CSS and JS. If you want to modify the CSS or JS, use Rake to compile them:
$ cd react/docs
$ bundle exec rake watch # Automatically compiles as needed.
# bundle exec rake Manually compile CSS and JS.
# bundle exec rake js Manually compile JS, only.
Afterthoughts
Updating facebook.github.io/react
The easiest way to do this is to have a separate clone of this repository, checked out to the gh-pages branch. We have a build step that expects this to be in a directory named react-gh-pages at the same depth as react. Then it's just a matter of running grunt docs, which will compile the site and copy it out to this repository. From there, you can check it in.
Note: This should only be done for new releases. You should create a tag corresponding to the release tag in the main repository.
We also have a rake task that does the same thing (without creating commits). It expects the directory structure mentioned above.
$ bundle exec rake release
Removing the Jekyll / Ruby Dependency
In an ideal world, we would not be adding a Ruby dependency on part of our project. We would like to move towards a point where we are using React to render the website.