Ion Toast erroneously misplaces toast and erroneously issues warning

Ionic Framework Ionic Vue
1

I am frequently / intermittently get this error (and this misplaced toast) with Ionic 7.5 (in which the ability to position toasts relative to a DOM id just came out).

[Ionic Warning]: The positionAnchor element for ion-toast was found in the DOM, but appears to be hidden]

I’ve tried various things but nothing seems to work.

Here is how I call it:

  <ion-header id="header-entry-detail">
      <ion-toolbar>
        <ion-buttons slot="start">
          <ion-back-button></ion-back-button>
        </ion-buttons>
        <ion-title>Entry Details</ion-title>
      </ion-toolbar>
    </ion-header>

And when a button is pressed @click

const toastEntryUpdated = async () => {
      const toast = await toastController.create({
        message: 'Entry image update',
        duration: 3000,
        color: 'success',
        position: 'top',
        positionAnchor: 'header-entry-detail'

      });
      return toast.present();
    };

but also happens with this style:

  <ion-toast :is-open="show_image_gen_toast" message="Image generation queued." :duration="5000"
        @didDismiss="show_image_gen_toast = false" position="top" position-anchor="header-entry-detail"></ion-toast>

I am wondered if a computed reference to the DOM id might solve it? :position-anchor="anchorRef" is what I was thinking. But no, that doesn’t fix it.