[Fiber] Always flush Default priority in the microtask if a Transition was scheduled (facebook#33186)

Stacked on facebook#33160.

The purpose of this is to avoid calling `onDefaultTransitionIndicator`
when a Default priority update acts as the loading indicator, but still
call it when unrelated Default updates happens nearby.

When we schedule Default priority work that gets batched with other
events in the same frame more or less. This helps optimize by doing less
work. However, that batching means that we can't separate work from one
setState from another. If we would consider all Default priority work in
a frame when determining whether to show the default we might never show
it in cases like when you have a recurring timer updating something.

This instead flushes the Default priority work eagerly along with the
sync work at the end of the event, if this event scheduled any
Transition work. This is then used to determine if the default indicator
needs to be shown.

Author: sebmarkbage

packages/react-reconciler/src/ReactFiberRootScheduler.js

@@ -26,6 +26,7 @@ import {
   NoLane,
   NoLanes,
   SyncLane,
+  DefaultLane,
   getHighestPriorityLane,
   getNextLanes,
   includesSyncLane,
@@ -261,6 +262,13 @@ function processRootScheduleInMicrotask() {
       // render it synchronously anyway. We do this during a popstate event to
       // preserve the scroll position of the previous page.
       syncTransitionLanes = currentEventTransitionLane;
+    } else if (enableDefaultTransitionIndicator) {
+      // If we have a Transition scheduled by this event it might be paired
+      // with Default lane scheduled loading indicators. To unbatch it from
+      // other events later on, flush it early to determine whether it
+      // rendered an indicator. This ensures that setState in default priority
+      // event doesn't trigger onDefaultTransitionIndicator.
+      syncTransitionLanes = DefaultLane;
     }
   }
 

packages/react-reconciler/src/__tests__/ReactDefaultTransitionIndicator-test.js

@@ -109,10 +109,7 @@ describe('ReactDefaultTransitionIndicator', () => {
     expect(root).toMatchRenderedOutput(<div>Hi</div>);
 
     await act(() => {
-      // TODO: This should not require a discrete update ideally but work for default too.
-      ReactNoop.discreteUpdates(() => {
-        update('Loading...');
-      });
+      update('Loading...');
       React.startTransition(() => {
         update('');
         root.render(<App>{promiseB}</App>);