how to test menu in ADropDown component with @testing-library/vue

[Fallsleep]

component like ADropDown has a default delay for rendering overlay slot，after calling userEvent.hover() trigger with@testing-library/user-event，use findBy api instead of getBy

here's demo，run npm test .

import { describe, expect, test } from 'vitest';
import { render, fireEvent, screen } from '@testing-library/vue';
import userEvent from '@testing-library/user-event';
import DropDown from '../DropDown.vue';

describe('Drop Down Test', () => {
  test('Hovor to Show Menu', () => {
    render(DropDown);
    const dropDown = screen.getByText('Drop Down');
    // drop donw mounted is ok
    expect(dropDown).toBeTruthy();
    // menu not exist
    expect(screen.queryByText('Menu')).toBeNull();

    // trigger drop down
    userEvent.hover(dropDown);
    // menu exist is ok
    expect(screen.findByText('Menu')).toBeTruthy();
    // will throw error
    // expect(screen.getByText('Menu')).toBeTruthy();
  });
});

[pavitra-infocusp]

Any idea how to test dropdown components? The menu items in the popover doesn't exist when testing.