VirtualizedList passive event listener warning

[tienifr]

Is there an existing issue for this?

• I have searched the existing issues

Describe the issue

Passive event warning [Violation] Added non-passive event listener to a scroll-blocking 'wheel' event appears when using VirtualizedList. Happens on Chrome 51 or later which support passive event listener.

Expected behavior

The passive event warning does not appear.

Steps to reproduce

1. Use a VirtualizedList component
2. Observe the warning in Chrome 51 or later

Test case

https://codesandbox.io/s/summer-dew-txtgt2

Additional comments

Proposed solution

Root cause

We're not using passive options for performance improvement when adding listener for the wheel event here:

react-native-web/packages/react-native-web/src/vendor/react-native/VirtualizedList/index.js

Lines 748 to 750 in a3ea2a0

	this._scrollRef.getScrollableNode().addEventListener('wheel',
	this.invertedWheelEventHandler
	);

Solution

1. Add passive: true to wheel event listener with passive event feature detection in order not to collide with capture option
2. Remove event preventDefault in the listener here:

react-native-web/packages/react-native-web/src/vendor/react-native/VirtualizedList/index.js

Line 484 in a3ea2a0

ev.preventDefault();