Functional `ref` prop throws a `Maximum update depth exceeded` error when suspending.

React version: `18.0.0-alpha-464f27572-20210713`

## Steps To Reproduce

1. Click on the `suspend` button: https://codesandbox.io/s/ref-set-too-many-times-jm0c3?file=/src/App.js.

## The current behavior

Clicking on the `suspend` button throws a `Maximum update depth exceeded` error.

## The expected behavior

Clicking on the `suspend` button suspends.
outer: while (parentFiber !== null) {
              switch (parentFiber.tag) {
                case HostRoot:
                  const root = parentFiber.stateNode;
                  root.effectDuration += effectDuration;
                  break outer;
                case Profiler:
                  const parentStateNode = parentFiber.stateNode;
                  parentStateNode.effectDuration += effectDuration;
                  break outer;
              }
              parentFiber = parentFiber.return;
            }
          }
        }
        break;
      }
      case SuspenseComponent: {
        commitSuspenseHydrationCallbacks(finishedRoot, finishedWork);
        break;
      }
      case SuspenseListComponent:
      case IncompleteClassComponent:
      case ScopeComponent:
      case OffscreenComponent:
      case LegacyHiddenComponent:
        break;
      default:
        invariant(
          false,