No ion-datetime instance found for 'anid'

I am getting this error alot when running unit tests, but it is intermittent.

An error was thrown in afterAll
  Error: Failed: [Ionic Error]: No ion-datetime instance found for ID 'birthdate-id'.
      at <Jasmine>
      at console.error (http://localhost:9876/_karma_webpack_/webpack:/src/test.ts:26:32)
      at printIonError (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@ionic/core/dist/esm/index-c4b11676.js:21:1)
      at http://localhost:9876/_karma_webpack_/webpack:/node_modules/@ionic/core/dist/esm/ion-datetime-button.entry.js:223:20
      at Generator.next (<anonymous>)

the place in question where this happens is

<form>
      <ion-item>
        <ion-label data-cy="signup-list-birthday-label">Date of Birth</ion-label>
        <ion-input data-cy="signup-list-birthday-input" [hidden]="true" formControlName="birthDate"></ion-input>
        <ion-datetime-button data-cy="signup-list-birthday-datetimeBtn" slot="end" placeholder="Date of Birth" datetime="birthdate-id"></ion-datetime-button>
        <ion-text data-cy="signup-list-birthday-error" slot="error" class="ion-text-center" color="danger"
          *ngIf="signupForm.get('birthDate').hasError('required') && registerAttemp">
          Birthday is required
        </ion-text>
      </ion-item>

    <ion-modal #birthdateModal [keepContentsMounted]="true">
      <ng-template>
        <ion-datetime presentation="date" formControlName="birthDate" id="birthdate-id" [showDefaultButtons]="true">
        </ion-datetime>
      </ng-template>
    </ion-modal>
</form>

any hints to assist me solve this?