-
Notifications
You must be signed in to change notification settings - Fork 46.5k
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
Fix missing react dependency in some addon umd builds #9919
Fix missing react dependency in some addon umd builds #9919
Conversation
NOTE: Never going to merge this commit, but I may cherry-pick it onto branches in order to test fixes for issue facebook#9765 **what is the change?:** Require and use the UMD bundles of 'create-react-class' in three fixtures to test the three supported uses; - test Global JS with globals.html - test AMD with requirejs.html - test CommonJS with webpack-alias **why make this change?:** To test facebook#9761 and other PRs fixing facebook#9765 **test plan:** Manual testing; - cd into the directory in fixtures - run the build step if needed - open the file **issue:** facebook#9765
**what is the change?:** Renamed some fixtures. **why make this change?:** This is part of setting up manual tests of the add-ons we are fixing. **test plan:** `cd fixtures && node ./build-all.js` and manually open the renamed fixtures. **issue:** facebook#9765
**what is the change?:** `prettier addons/react-linked-input/react-linked-input.js | pbcopy` and replaced the contents of the file. **why make this change?:** I am manually tweaking this file and want it to be more readable. **test plan:** about to set up manual testing of this with fixtures. I expect that right now only the use of it as a global will work, and subsequent commits will fix the AMD and CommonJS use cases. **issue:** facebook#9765
**what is the change?:** Setting up the fixtures to enable manual testing of the `react-linked-input` and `create-fragment` UMD builds. This was a painstaking and frustrating process and we need something better before making any more fixes to addons. Here is roughly what I did; - add 'console.log' statements to the add-on to confirm that you've loaded the right build case - copy the add-on into 'build/packages' so that the 'webpack-alias' can find it. - make copies of each of the following three fixtures for each add-on you want to test, renaming them to specify what you are testing: - globals.js - requirejs.js - webpack-alias/* - modify those fixtures to use the add-on you intend to text **why make this change?:** We need to verify the current state of the bug before fixing it, to confirm that the change actually is fixing the bug. **test plan:** `open fixtures/globals-with-create-react-fragment.html` `open fixtures/globals-with-react-linked-input.html` `open fixtures/requirejswith-create-react-fragment.html` `open fixtures/requirejswith-react-linked-input.html` `cd fixtures/webpack-aliaswith-create-react-fragment/ && yarn build && open index.html` `cd fixtures/webpack-aliaswith-react-linked-input/ && yarn build && open index.html` **issue:** facebook#9765
**what is the change?:** Manually tweaking the UMD builds for both add-ons to include a dependency on React. **why make this change?:** They were broken before for AMD and CommonJS. For reasons I have not debugged, the CommonJS builds are still broken, but the AMD is now fixed and globals still work: ``` do 'react-linked-input' and 'create-react-fragment' work? before after + my + my + en^ironment | fix | fix | +---------------------------------------- | | | Global JS | :) yes | :) yes | +---------------------------------------- | | | AMD | X no | :) yes | +---------------------------------------- | | | CommonJS | X no | X no | +-------------+-----------+-----------+-- ``` **test plan:** In the previous commit we set up fixtures to manually test these. **issue:** facebook#9765
Not worth explaining - just committing as a 'save point' while I fiddle with the fixtures.
**what is the change?:** We forked three of the fixtures into two variations to test two of the react addons. We also added `console.log` statements to the addons to verify that we were loading the right build. This commit cleans it up by - deleting forked fixtures - re-adding the original fixtures - removing `console.log` statements **why make this change?:** To get this branch ready for review. **test plan:** `cd fixtures && node ./build-all.js` and then check the updated fixtures manually **issue:** facebook#9765
3eebf12
to
5f30b23
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Unfortunately we don't have a test suite that can run entirely against our public API. If we did, we could run all our tests against each type of build. It is probably a surmountable hurdle to make it happen though.
|
||
g.LinkedInput = f(g.React); | ||
} | ||
})(function(React) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
nit: why is this fully expanded while the previous one is in one line? a little easier to compare them if they match style
fixtures/webpack/input.js
Outdated
@@ -1,3 +1,4 @@ | |||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
rm
var warning = require("fbjs/lib/warning"); | ||
|
||
var hasReadOnlyValue = { | ||
button: true, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Maybe you ran prettier over all of this? The quotes here changed. It is not a big deal but would be better to keep the original version in case there are slight semantic differences (closure compiler advanced probably doesn't work properly on this code anyway, but it does treat these differently).
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I did run it through prettier - was wary of trying to take specific parts of the changes because I might miss a closing bracket somewhere.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I can fix the quotes at least though.
**what is the change?:** `:%s /"/'/gc` I left double quotes wrapping cases where we have single quotes in the string. **why make this change?:** I ran the code for the unminified 'react-linked-input' through 'prettier' so it would be easier for me to manually fix the UMD wrapper. And 'prettier' changed many single quotes into double quotes. @spicyj pointed out this will be treated differently by the google closure compiler, and may have semantic differences. **test plan:** It's not worth testing imo. **issue:** facebook#9765
It's actually quotes vs no quotes in object keys and property accesses which makes a difference, not double vs single. (Is it difficult to un-prettier it?) |
I can fix the object keys, and how would I un-prettier it? I ran it through prettier and then made changes, so reverting the whole thing would lose the changes I made by hand. And I couldn't see where to make the changes without prettifying it. |
We absolutely need a build process and tests before making any further changes to these addons.
That said, this is a quick fix to hopefully improve the situation in conjunction with the 15.6 release. We will probably continue working on fixing the add-on packages after 15.6.
The fix:
what is the change?:
Manually tweaking the UMD builds for both add-ons to include a
dependency on React.
why make this change?:
They were broken before for AMD and CommonJS.
For reasons I have not debugged, the CommonJS builds are still broken,
but the AMD is now fixed and globals still work:
The process for testing the fix:
what is the change?:
Setting up the fixtures to enable manual testing of the
react-linked-input
andcreate-fragment
UMD builds.This was a painstaking and frustrating process and we need something
better before making any more fixes to addons. Here is roughly what I
did;
why make this change?:
We need to verify the current state of the bug before fixing it, to
confirm that the change actually is fixing the bug.
test plan:
open fixtures/globals-with-create-react-fragment.html
open fixtures/globals-with-react-linked-input.html
open fixtures/requirejswith-create-react-fragment.html
open fixtures/requirejswith-react-linked-input.html
cd fixtures/webpack-aliaswith-create-react-fragment/ && yarn build && open index.html
cd fixtures/webpack-aliaswith-react-linked-input/ && yarn build && open index.html