diff --git a/src/devtools/views/Components/TreeContext.js b/src/devtools/views/Components/TreeContext.js index 1c4f4f9dae..21b16e89a0 100644 --- a/src/devtools/views/Components/TreeContext.js +++ b/src/devtools/views/Components/TreeContext.js @@ -27,7 +27,11 @@ import React, { useReducer, useRef, } from 'react'; -import { unstable_next as next } from 'scheduler'; +import { + unstable_next as next, + unstable_runWithPriority as runWithPriority, + unstable_UserBlockingPriority as UserBlockingPriority, +} from 'scheduler'; import { createRegExp } from '../utils'; import { BridgeContext, StoreContext } from '../context'; import Store from '../../store'; @@ -699,7 +703,10 @@ function TreeContextController({ children }: Props) { const dispatchWrapper = useCallback( (action: Action) => { - dispatch(action); + // Run the first update at "user-blocking" priority in case dispatch is called from a non-React event. + // In this case, the current (and "next") priorities would both be "normal", + // and suspense would potentially block both updates. + runWithPriority(UserBlockingPriority, () => dispatch(action)); next(() => dispatch({ type: 'UPDATE_INSPECTED_ELEMENT_ID' })); }, [dispatch]