Keep onTouchStart, onTouchMove, and onWheel passive#19654
Merged
Conversation
|
This pull request is automatically built and testable in CodeSandbox. To see build info of the built libraries, click here or the icon next to each commit SHA. Latest deployment of this branch, based on commit 31deb7f:
|
Details of bundled changes.Comparing: 87b3e2d...31deb7f react-dom
ReactDOM: size: 0.0%, gzip: -0.0% Size changes (stable) |
Details of bundled changes.Comparing: 87b3e2d...31deb7f react-dom
ReactDOM: size: 0.0%, gzip: -0.0% Size changes (experimental) |
Collaborator
Author
|
Seems like it might be risky in WWW in case we rely on old behavior. I'll put it behind a flag but set it on in open source. |
Collaborator
Author
|
I put it behind a flag in WWW but left it enabled in open source. |
facebook-github-bot
added
CLA Signed
React Core Team
Contributor
|
What about pointer events? |
Collaborator
Author
|
I don't think they're relevant here? Chrome doesn't print anything if you |
Contributor
|
@gaearon Ah okay. Thanks for looking into it! :) |
trueadm
approved these changes
Aug 19, 2020
Contributor
|
We should also follow up with a test and check that the below works as expected (it should do, as we check if const setClick = ReactDOM.unstable_createEventHandle('touchstart', {passive: false});
function Component() {
const ref = useRef(null);
useEffect(() => {
return setClick(ref.current, e => e.preventDefault());
});
return <button ref={ref}></button>
} |
Contributor
facebook-github-bot
pushed a commit
to react/react-native
that referenced
this pull request
Oct 27, 2020
Summary: This sync includes the following changes: - **[eaaf4cb](react/react@eaaf4cbce )**: 17.0.1 //<Dan Abramov>// - **[6f62abb](react/react@6f62abb58 )**: Remove usage of Array#fill ([#20071](react/react#20071)) //<Dan Abramov>// - **[40cfe1f](react/react@40cfe1f48 )**: Update CHANGELOG.md //<Dan Abramov>// - **[f021a98](react/react@f021a983a )**: Bump versions for 17 ([#20062](react/react#20062)) //<Dan Abramov>// - **[d1bb4d8](react/react@d1bb4d851 )**: Profiler: Include ref callbacks in onCommit duration ([#20060](react/react#20060)) //<Brian Vaughn>// - **[c59c3df](react/react@c59c3dfe5 )**: useRef: Warn about reading or writing mutable values during render ([#18545](react/react#18545)) //<Brian Vaughn>// - **[7b6cac9](react/react@7b6cac952 )**: Improved Profiler commit hooks test ([#20053](react/react#20053)) //<Brian Vaughn>// - **[dfb6a40](react/react@dfb6a4033 )**: [Fast Refresh] Fix crashes caused by rogue Proxies ([#20030](react/react#20030)) ([#20039](react/react#20039)) //<Kai Riemann>// - **[37cb732](react/react@37cb732c5 )**: Use bitwise OR to define flag masks ([#20044](react/react#20044)) //<Andrew Clark>// - **[eb3181e](react/react@eb3181e77 )**: Add Visibility flag for hiding/unhiding trees ([#20043](react/react#20043)) //<Andrew Clark>// - **[0dd809b](react/react@0dd809bdf )**: Remove last schedulePassiveEffectCallback call ([#20042](react/react#20042)) //<Andrew Clark>// - **[8df7b79](react/react@8df7b7911 )**: Remove Passive flag from "before mutation" phase ([#20038](react/react#20038)) //<Andrew Clark>// - **[c57fe4a](react/react@c57fe4a2c )**: ReactIs.isValidElementType Unit Test extended with PureComponent case ([#20033](react/react#20033)) //<adasq>// - **[02da938](react/react@02da938fd )**: Don't double-invoke effects in legacy roots ([#20028](react/react#20028)) //<Brian Vaughn>// - **[d95c493](react/react@d95c4938d )**: [EventSystem] Revise onBeforeBlur propagation mechanics ([#20020](react/react#20020)) //<Dominic Gannaway>// - **[f46a80a](react/react@f46a80ae1 )**: Update outdated links and fix two broken links ([#19985](react/react#19985)) //<Saikat Guha>// - **[0a4c7c5](react/react@0a4c7c565 )**: [Flight] Don't warn for key, but error for ref ([#19986](react/react#19986)) //<Sebastian Markbåge>// - **[993ca53](react/react@993ca533b )**: Enable eager listeners statically ([#19983](react/react#19983)) //<Dan Abramov>// - **[40c52de](react/react@40c52de96 )**: [Flight] Add Runtime Errors for Non-serializable Values ([#19980](react/react#19980)) //<Sebastian Markbåge>// - **[1992d97](react/react@1992d9730 )**: Revert "Temporarily disable Profiler commit hooks flag ([#19900](react/react#19900))" ([#19960](react/react#19960)) //<Brian Vaughn>// - **[44d39c4](react/react@44d39c4d7 )**: Removed skip-error-boundaries modifications from old fork ([#19961](react/react#19961)) //<Brian Vaughn>// - **[cc77be9](react/react@cc77be957 )**: Remove unnecessary error overriding in ([#19949](react/react#19949)) //<Paul Doyle>// - **[9762527](react/react@97625272a )**: Debug tracing tests for CPU bound suspense ([#19943](react/react#19943)) //<Brian Vaughn>// - **[43363e2](react/react@43363e279 )**: Fix codestyle for typeof comparison ([#19928](react/react#19928)) //<Eugene Maslovich>// - **[5427b46](react/react@5427b4657 )**: Temporarily disable Profiler commit hooks flag ([#19900](react/react#19900)) //<Brian Vaughn>// - **[1faf9e3](react/react@1faf9e3dd )**: Suspense for CPU-bound trees ([#19936](react/react#19936)) //<Andrew Clark>// - **[7f08e90](react/react@7f08e908b )**: Fix missing context to componentDidMount() when double-invoking lifecycles ([#19935](react/react#19935)) //<Brian Vaughn>// - **[9198a5c](react/react@9198a5cec )**: Refactor layout effect methods ([#19895](react/react#19895)) //<Brian Vaughn>// - **[ba82eea](react/react@ba82eea38 )**: Remove disableSchedulerTimeoutInWorkLoop flag ([#19902](react/react#19902)) //<Andrew Clark>// - **[c63741f](react/react@c63741fb3 )**: offscreen double invoke effects ([#19523](react/react#19523)) //<Luna Ruan>// - **[c691734](react/react@c6917346f )**: Fixed broken Profiler test ([#19894](react/react#19894)) //<Brian Vaughn>// - **[87c023b](react/react@87c023b1c )**: Profiler onRender only called when we do work ([#19885](react/react#19885)) //<Brian Vaughn>// - **[81aaee5](react/react@81aaee56a )**: Don't call onCommit et al if there are no effects ([#19863](react/react#19863)) //<Andrew Clark>// - **[7355bf5](react/react@7355bf575 )**: Consolidate commit phase hook functions ([#19864](react/react#19864)) //<Andrew Clark>// - **[bc6b7b6](react/react@bc6b7b6b1 )**: Don't trigger lazy in DEV during element creation ([#19871](react/react#19871)) //<Dan Abramov>// - **[a774502](react/react@a774502e0 )**: Use single quotes in getComponentName return ([#19873](react/react#19873)) //<Gustavo Saiani>// - **[8b2d378](react/react@8b2d3783e )**: Use Passive flag to schedule onPostCommit ([#19862](react/react#19862)) //<Andrew Clark>// - **[50d9451](react/react@50d9451f3 )**: Improve DevTools editing interface ([#19774](react/react#19774)) //<Brian Vaughn>// - **[6fddca2](react/react@6fddca27e )**: Remove passive intervention flag ([#19849](react/react#19849)) //<Dan Abramov>// - **[36df918](react/react@36df9185c )**: chore(docs): Removed outdated comment about fb.me link ([#19830](react/react#19830)) //<Adnaan Bheda>// - **[16fb2b6](react/react@16fb2b6f9 )**: Moved resetChildLanes into complete work ([#19836](react/react#19836)) //<Brian Vaughn>// - **[cc58106](react/react@cc581065d )**: [email protected] //<Dan Abramov>// - **[0044805](react/react@0044805c8 )**: Update CHANGELOG.md //<Dan Abramov>// - **[0f70d4d](react/react@0f70d4dd6 )**: Consider components in jsx as missing dependencies in typescript-eslint/[email protected] ([#19815](react/react#19815)) //<Sebastian Silbermann>// - **[84558c6](react/react@84558c61b )**: Don't visit passive effects during layout phase ([#19809](react/react#19809)) //<Andrew Clark>// - **[ad8a0a8](react/react@ad8a0a8cd )**: [email protected] //<Dan Abramov>// - **[77544a0](react/react@77544a0d6 )**: Update CHANGELOG.md //<Dan Abramov>// - **[ed4fdfc](react/react@ed4fdfc73 )**: test(eslint-plugin-react-hooks): Run with TS parsers >= 2.x ([#19792](react/react#19792)) //<Sebastian Silbermann>// - **[cd75f93](react/react@cd75f93c0 )**: eslint-plugin-react-hooks: fix compatibility with typescript-eslint/[email protected]+ ([#19751](react/react#19751)) //<Matthias Schiffer>// - **[781212a](react/react@781212aab )**: Remove double space in test name ([#19762](react/react#19762)) //<Gustavo Saiani>// - **[e7b2553](react/react@e7b255341 )**: Internal `act`: Flush timers at end of scope ([#19788](react/react#19788)) //<Andrew Clark>// - **[d17086c](react/react@d17086c7c )**: Decouple public, internal act implementation ([#19745](react/react#19745)) //<Andrew Clark>// - **[d38ec17](react/react@d38ec17b1 )**: [Flight] Set dispatcher for duration of performWork() ([#19776](react/react#19776)) //<Joseph Savona>// - **[4f3f7ee](react/react@4f3f7eeb7 )**: Bugfix: Effect clean up when deleting suspended tree ([#19752](react/react#19752)) //<Andrew Clark>// - **[7baf9d4](react/react@7baf9d412 )**: Combine Flags and SubtreeFlags types ([#19775](react/react#19775)) //<Andrew Clark>// - **[1665443](react/react@166544360 )**: Rename effect fields ([#19755](react/react#19755)) //<Andrew Clark>// - **[708fa77](react/react@708fa77a7 )**: Decrease expiration time of input updates ([#19772](react/react#19772)) //<Andrew Clark>// - **[36df483](react/react@36df483af )**: Add feature flag to disable scheduler timeout in work loop ([#19771](react/react#19771)) //<Ricky>// - **[bcc0aa4](react/react@bcc0aa463 )**: Revert "Revert "Remove onScroll bubbling flag ([#19535](react/react#19535))" ([#19655](react/react#19655))" ([#19761](react/react#19761)) //<Dan Abramov>// - **[99cae88](react/react@99cae887f )**: Add failing test for passive effect cleanup functions and memoized components ([#19750](react/react#19750)) //<Brian Vaughn>// - **[2cfd73c](react/react@2cfd73c4d )**: Fix typo in comment (Noticable→Noticeable) ([#19737](react/react#19737)) //<Ikko Ashimine>// - **[53e622c](react/react@53e622ca7 )**: Fix instances of function declaration after return ([#19733](react/react#19733)) //<Bhumij Gupta>// - **[b7d18c4](react/react@b7d18c4da )**: Support Babel's envName option in React Refresh plugin ([#19009](react/react#19009)) //<Kevin Weber>// - **[1f38dcf](react/react@1f38dcff6 )**: Remove withSuspenseConfig ([#19724](react/react#19724)) //<Andrew Clark>// - **[1396e4a](react/react@1396e4a8f )**: Fixes eslint warning when node type is ChainExpression ([#19680](react/react#19680)) //<Pascal Fong Kye>// - **[a8500be](react/react@a8500be89 )**: Add `startTransition` as a known stable method ([#19720](react/react#19720)) //<Andrew Clark>// - **[380dc95](react/react@380dc95de )**: Revert "Append text string to <Text> error message ([#19581](react/react#19581))" ([#19723](react/react#19723)) //<Timothy Yung>// - **[ddd1faa](react/react@ddd1faa19 )**: Remove config argument from useTransition ([#19719](react/react#19719)) //<Andrew Clark>// - **[92fcd46](react/react@92fcd46cc )**: Replace SuspenseConfig object with an integer ([#19706](react/react#19706)) //<Andrew Clark>// - **[b754caa](react/react@b754caaaf )**: Enable eager listeners in open source ([#19716](react/react#19716)) //<Dan Abramov>// - **[c1ac052](react/react@c1ac05215 )**: [Flight] Support more element types and Hooks for Server and Hybrid Components ([#19711](react/react#19711)) //<Dan Abramov>// - **[1eaafc9](react/react@1eaafc9ad )**: Clean up timeoutMs-related implementation details ([#19704](react/react#19704)) //<Andrew Clark>// - **[8da0da0](react/react@8da0da093 )**: Disable timeoutMs argument ([#19703](react/react#19703)) //<Andrew Clark>// - **[60ba723](react/react@60ba723bf )**: Add SuspenseList to devTools ([#19684](react/react#19684)) //<Ben Pernick>// - **[5564f2c](react/react@5564f2c95 )**: Add React.startTransition ([#19696](react/react#19696)) //<Ricky>// - **[c4e0768](react/react@c4e0768d7 )**: Remove unused argument from `finishConcurrentRender` ([#19689](react/react#19689)) //<inottn>// - **[848bb24](react/react@848bb2426 )**: Attach Listeners Eagerly to Roots and Portal Containers ([#19659](react/react#19659)) //<Dan Abramov>// - **[d2e914a](react/react@d2e914ab4 )**: Remove remaining references to effect list ([#19673](react/react#19673)) //<Andrew Clark>// - **[d6e4338](react/react@d6e433899 )**: Use Global Render Timeout for CPU Suspense ([#19643](react/react#19643)) //<Sebastian Markbåge>// - **[64ddef4](react/react@64ddef44c )**: Revert "Remove onScroll bubbling flag ([#19535](react/react#19535))" ([#19655](react/react#19655)) //<Dan Abramov>// - **[dd651df](react/react@dd651df05 )**: Keep onTouchStart, onTouchMove, and onWheel passive ([#19654](react/react#19654)) //<Dan Abramov>// - **[b8fa09e](react/react@b8fa09e9e )**: provide profiling bundle for react-reconciler ([#19559](react/react#19559)) //<Julien Gilli>// - **[23595ff](react/react@23595ff59 )**: Add missing param to safelyCallDestroy() ([#19638](react/react#19638)) //<Brian Vaughn>// - **[ee409ea](react/react@ee409ea3b )**: change destroy to safelyCallDestroy ([#19605](react/react#19605)) //<Luna Ruan>// - **[bcca5a6](react/react@bcca5a6ca )**: Always skip unmounted/unmounting error boundaries ([#19627](react/react#19627)) //<Brian Vaughn>// - **[1a41a19](react/react@1a41a196b )**: Append text string to <Text> error message ([#19581](react/react#19581)) //<Timothy Yung>// - **[e4afb2f](react/react@e4afb2fdd )**: [email protected] //<Dan Abramov>// - **[ced05c4](react/react@ced05c46c )**: Update CHANGELOG.md //<Dan Abramov>// - **[702fad4](react/react@702fad4b1 )**: refactor fb.me redirect link to reactjs.org/link ([#19598](react/react#19598)) //<CY Lim>// - **[49cd77d](react/react@49cd77d24 )**: fix: leak strict mode with UMD builds ([#19614](react/react#19614)) //<Toru Kobayashi>// - **[ffb749c](react/react@ffb749c95 )**: Improve error boundary handling for unmounted subtrees ([#19542](react/react#19542)) //<Brian Vaughn>// - **[9b35dd2](react/react@9b35dd2fc )**: Permanently removed component stacks from scheduling profiler data ([#19615](react/react#19615)) //<Brian Vaughn>// - **[3f8115c](react/react@3f8115cdd )**: Remove `didTimeout` check from work loop //<Andrew Clark>// - **[9abc278](react/react@9abc2785c )**: Remove wasteful checks from `shouldYield` //<Andrew Clark>// - **[1d5e10f](react/react@1d5e10f70 )**: [eslint-plugin-react-hooks] Report constant constructions ([#19590](react/react#19590)) //<Jordan Eldredge>// - **[dab0854](react/react@dab0854c5 )**: Move commit passive unmount/mount to CommitWork ([#19599](react/react#19599)) //<Sebastian Markbåge>// - **[ccb6c39](react/react@ccb6c3945 )**: Remove unused argument ([#19600](react/react#19600)) //<inottn>// - **[6291255](react/react@629125555 )**: [Scheduler] Re-throw unhandled errors ([#19595](react/react#19595)) //<Andrew Clark>// - **[b8ed6a1](react/react@b8ed6a1aa )**: [Scheduler] Call postTask directly ([#19551](react/react#19551)) //<Andrew Clark>// - **[ce37bfa](react/react@ce37bfad5 )**: Remove resolutions from test renderer package.json ([#19577](react/react#19577)) //<Dan Abramov>// - **[2704bb5](react/react@2704bb537 )**: Add ReactVersion to SchedulingProfiler render scheduled marks ([#19553](react/react#19553)) //<Kartik Choudhary>// - **[0c52e24](react/react@0c52e24cb )**: Support inner component _debugOwner in memo ([#19556](react/react#19556)) //<Brian Vaughn>// - **[0cd9a6d](react/react@0cd9a6de5 )**: Parallelize Jest in CI ([#19552](react/react#19552)) //<Andrew Clark>// - **[a63893f](react/react@a63893ff3 )**: Warn about undefined return value for memo and forwardRef ([#19550](react/react#19550)) //<Brian Vaughn>// - **[32ff428](react/react@32ff42868 )**: Add feature flag for setting update lane priority ([#19401](react/react#19401)) //<Ricky>// - **[5bdd4c8](react/react@5bdd4c8c6 )**: Remove unused argument from call to jest method ([#19546](react/react#19546)) //<Gustavo Saiani>// - **[a5fed98](react/react@a5fed98a9 )**: Register more node types that are used later as JSXIdentifiers ([#19514](react/react#19514)) //<Mateusz Burzyński>// - **[f77c7b9](react/react@f77c7b9d7 )**: Re-add discrete flushing timeStamp heuristic (behind flag) ([#19540](react/react#19540)) //<Dominic Gannaway>// Changelog: [general] [feature] Upgrade to React 17 Reviewed By: cpojer Differential Revision: D24491201 fbshipit-source-id: c947da9dcccbd614e9dc58f3339b63e24829aca7
This was referenced Mar 6, 2021
koto
pushed a commit
to koto/react
that referenced
this pull request
Jun 15, 2021
* Keep onTouchStart, onTouchMove, and onWheel passive * Put it behind a feature flag on WWW
This was referenced Oct 1, 2024
This was referenced Apr 17, 2026
This was referenced May 6, 2026
mrizwanashiq
pushed a commit
to mrizwanashiq/react
that referenced
this pull request
Jun 25, 2026
* Keep onTouchStart, onTouchMove, and onWheel passive * Put it behind a feature flag on WWW
This was referenced Jun 30, 2026
This was referenced Jul 8, 2026
Merged
luisegarduno
added a commit
to luisegarduno/varagity
that referenced
this pull request
Jul 19, 2026
Phase 3 of the codebase-map plan: the rendering surface, reachable only
by typing /map (the developer-mode gating of its entry points is
Phase 4).
- web/app/map/page.tsx: thin server page (the corpus/page.tsx house
shape, not spec §5.5's client page) — exports metadata and renders
<CodebaseMapView/>; next build emits it as a static route.
- web/components/map/CodebaseMapView.tsx: the "use client" canvas.
layout() memoized once over the static import; pan via pointer
capture on a full-viewBox background rect; zoom-to-cursor with the
wheel attached as a native { passive: false } listener in a cleanup-
returning ref callback (React's synthetic onWheel is forcibly
passive — react/react#19654; attach is idempotent for Strict
Mode's element → null → element cycle), plus +/−/0 keys and
on-screen buttons, clamped 0.4×–2.5×. Click/Enter traces the
memoized transitive-downstream closure — active edges brighten and
reveal a kind chip, everything else drops to 15% opacity; Escape or
a second click clears. No useEffect anywhere (house rule).
- A11y per the SVG-AAM findings: role="application" + aria-label +
aria-describedby usage hint on the <svg>; each node a
<g role="button" tabIndex={0}> with an explicit aria-label (the
button role hides child <text> from the a11y tree); a non-aria-hidden
sr-only <ul> mirrors every node and its edges as the browse-mode text
equivalent. Trace transitions are motion-safe: only.
- web/components/map/MapNode.tsx / MapLegend.tsx / NodeDetail.tsx:
kinds told apart by shape + border + tint, never color alone (thick
left bar / doubled border / pill / cylinder top / dotted border; no
cron row); the legend reuses the same NodeShape for its swatches; the
detail panel renders detail, monospace sourceRef, and in/out edges as
sentences.
- web/lib/codebase-map.data.ts: web-map gains sourceRef
"web/app/map/page.tsx" in the same commit that creates the page —
guard and artifact land together (the openapi.json precedent); the
phase-scoped test assertion moves in lock-step.
Verification: Vitest 268 green, coverage floors hold
(79.49/76.53/71.48/79.97 vs 60/70/50/60); lint (no-useEffect gate) +
typecheck clean; next build emits /map as static. Owner-confirmed live
on the rebuilt web container: all 41 nodes + 3 bands render;
pan/zoom/trace and the keyboard-only walk pass at both densities and
themes; reduced motion honored; columns read fine — no §9 rank hint
added.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
5 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Resolves #19651.
This means that
e.preventDefault()in them stays broken, like it was in React 16 due to Chrome's intervention, even though we've switched from putting them on thedocumentto putting them on the root.This makes React 17 match the React 16 behavior closer, as our goal is to reduce the breaking changes between them.
Note that this also means that any browsers that don't implement the intervention but do implement passive events will now get the post-intervention behavior:
This seems like technically it could be breaking if you target iOS Safari, however MDN may be out of date.
For example, this answer says iOS 11 aligned with Chrome.
So it should be ok.
Test Plan
Should be self-explanatory but I did some manual testing for
onWheel.I'll test others before merge.Tested.