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

Remove the use of proxies for synthetic events in DEV #13225

Merged
merged 5 commits into from
Jul 17, 2018

Conversation

gaearon
Copy link
Collaborator

@gaearon gaearon commented Jul 17, 2018

Fixes #12171.

Motivation: this is very confusing. I've seen quite a few complaints about this and also bumped into it myself when I played with React occasionally. The warning is just not worth it.

The first commit (ac71c29) is pretty much a revert of #5947. #5947 cleared a few more properties than the code before it (which is nice) so I kept the current behavior (but removed the key list indirection).

The second commit (3c97680) fixes a bug that was introduced by #5947. Specifically, it was nulling out isPropagationStopped() and isDefaultPrevented(). While you shouldn't access them, nulling them out can lead to confusing crashes. So I just changed them to behave similarly to preventDefault() and stopPropagation() (which get shimmed with noops while the event is pooled). I consider it a bugfix — can't imagine somebody relying on whether it's nulled out or not in a way that isn't broken for some other reason.

I considered adding some kind of warning instead of this one (e.g. by counting the keys on every release). But it just seemed too complicated and not worth it. I imagine the situation is pretty rare anyway. And we can fix it in 17 for good with #13224.

This was a bug introduced by facebook#5947. It's very confusing that they become nulled while stopPropagation/preventDefault don't.
@gaearon
Copy link
Collaborator Author

gaearon commented Jul 17, 2018

console.log(e) in debugger during the event before:

screen shot 2018-07-17 at 11 55 20 pm

console.log(e) in debugger during the event after:

screen shot 2018-07-17 at 11 54 30 pm

@pull-bot
Copy link

pull-bot commented Jul 17, 2018

ReactDOM: size: -0.0%, gzip: -0.1%

Details of bundled changes.

Comparing: 171e0b7...2f3a2d0

react-dom

File Filesize Diff Gzip Diff Prev Size Current Size Prev Gzip Current Gzip ENV
react-dom.development.js -0.2% -0.3% 640.56 KB 639.4 KB 150.26 KB 149.88 KB UMD_DEV
react-dom.production.min.js -0.0% -0.1% 95.41 KB 95.4 KB 30.88 KB 30.86 KB UMD_PROD
react-dom.development.js -0.2% -0.3% 636.7 KB 635.53 KB 149.08 KB 148.7 KB NODE_DEV
react-dom.production.min.js -0.0% -0.0% 95.39 KB 95.38 KB 30.38 KB 30.38 KB NODE_PROD
react-dom-test-utils.development.js -2.6% -3.4% 44.89 KB 43.74 KB 12.31 KB 11.89 KB UMD_DEV
react-dom-test-utils.production.min.js -0.1% -0.7% 10.06 KB 10.06 KB 3.74 KB 3.72 KB UMD_PROD
react-dom-test-utils.development.js -2.6% -3.4% 44.61 KB 43.46 KB 12.25 KB 11.83 KB NODE_DEV
react-dom-test-utils.production.min.js -0.1% -0.9% 9.86 KB 9.85 KB 3.7 KB 3.66 KB NODE_PROD
react-dom-unstable-native-dependencies.development.js -1.9% -2.9% 59.96 KB 58.81 KB 15.85 KB 15.4 KB UMD_DEV
react-dom-unstable-native-dependencies.production.min.js -0.1% -0.5% 11.05 KB 11.04 KB 3.82 KB 3.8 KB UMD_PROD
react-dom-unstable-native-dependencies.development.js -1.9% -2.9% 59.63 KB 58.48 KB 15.72 KB 15.27 KB NODE_DEV
react-dom-unstable-native-dependencies.production.min.js -0.1% -0.5% 10.87 KB 10.86 KB 3.75 KB 3.73 KB NODE_PROD
ReactDOM-dev.js -0.2% -0.3% 643.74 KB 642.46 KB 147.58 KB 147.18 KB FB_WWW_DEV
ReactDOM-prod.js -0.0% -0.1% 276.73 KB 276.61 KB 51.71 KB 51.67 KB FB_WWW_PROD
ReactTestUtils-dev.js -2.9% -3.8% 43.28 KB 42.02 KB 11.83 KB 11.38 KB FB_WWW_DEV
ReactDOMUnstableNativeDependencies-dev.js -2.1% -3.1% 58.88 KB 57.62 KB 15.17 KB 14.7 KB FB_WWW_DEV
ReactDOMUnstableNativeDependencies-prod.js -0.4% -1.0% 26.26 KB 26.14 KB 5.33 KB 5.28 KB FB_WWW_PROD
react-dom.profiling.min.js -0.0% -0.1% 96.48 KB 96.47 KB 30.77 KB 30.76 KB NODE_PROFILING
ReactDOM-profiling.js -0.0% -0.1% 279.73 KB 279.62 KB 52.39 KB 52.35 KB FB_WWW_PROFILING

react-native-renderer

File Filesize Diff Gzip Diff Prev Size Current Size Prev Gzip Current Gzip ENV
ReactNativeRenderer-dev.js -0.3% -0.4% 481.54 KB 480.28 KB 106.48 KB 106.03 KB RN_FB_DEV
ReactNativeRenderer-prod.js -0.1% -0.1% 212.73 KB 212.61 KB 37 KB 36.95 KB RN_FB_PROD
ReactNativeRenderer-dev.js -0.3% -0.4% 481.27 KB 480.01 KB 106.43 KB 105.97 KB RN_OSS_DEV
ReactNativeRenderer-prod.js -0.1% -0.1% 202.18 KB 202.07 KB 35.35 KB 35.31 KB RN_OSS_PROD
ReactFabric-dev.js -0.3% -0.4% 471.75 KB 470.49 KB 104.04 KB 103.58 KB RN_FB_DEV
ReactFabric-prod.js -0.1% -0.1% 193.06 KB 192.94 KB 33.77 KB 33.72 KB RN_FB_PROD
ReactFabric-dev.js -0.3% -0.4% 471.79 KB 470.53 KB 104.06 KB 103.6 KB RN_OSS_DEV
ReactFabric-prod.js -0.1% -0.1% 193.09 KB 192.97 KB 33.79 KB 33.74 KB RN_OSS_PROD
ReactNativeRenderer-profiling.js -0.1% -0.1% 205.3 KB 205.19 KB 36.04 KB 35.99 KB RN_OSS_PROFILING
ReactFabric-profiling.js -0.1% -0.1% 195.87 KB 195.75 KB 34.39 KB 34.34 KB RN_OSS_PROFILING
ReactNativeRenderer-profiling.js -0.1% -0.1% 215.81 KB 215.69 KB 37.68 KB 37.64 KB RN_FB_PROFILING
ReactFabric-profiling.js -0.1% -0.1% 195.83 KB 195.71 KB 34.37 KB 34.32 KB RN_FB_PROFILING

Generated by 🚫 dangerJS

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'm not super familiar with this code, but the change looks good to me, and the debug output looks much nicer now.

@@ -270,25 +326,25 @@ describe('SyntheticEvent', () => {
);
});

it('should warn if Proxy is supported and the synthetic event is added a property', () => {
// TODO: we might want to re-add a warning like this in the future,
// but it shouldn't use Proxies because they making debugging difficult.
Copy link
Contributor

Choose a reason for hiding this comment

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

nit "they make debugging"

// but it shouldn't use Proxies because they making debugging difficult.
// Or we might disallow this pattern altogether:
// https://github.com/facebook/react/issues/13224
xit('should warn if synthetic event is added a property', () => {
Copy link
Contributor

Choose a reason for hiding this comment

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

supernit "should warn if a property is added to a synthetic event"

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

Yeah, it already had the grammar issue before. Will do

@nhunzaker
Copy link
Contributor

Late to the game on this, but this is a great change! 👍

@gaearon
Copy link
Collaborator Author

gaearon commented Jul 18, 2018

We should've done this like a year earlier 😛
This was so annoying when I was preparing for a conf talk, I was surprised people didn't complain louder

@gaearon gaearon deleted the no-proxies branch July 18, 2018 01:34
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.

Remove use of Proxy for events in development
5 participants