diff --git a/src/components/ebay-tooltip/test/test.browser.js b/src/components/ebay-tooltip/test/test.browser.js index 3cc10bad6..03bdbb821 100644 --- a/src/components/ebay-tooltip/test/test.browser.js +++ b/src/components/ebay-tooltip/test/test.browser.js @@ -1,4 +1,4 @@ -import { afterEach, beforeEach, describe, it, expect, vi } from "vitest"; +import { afterEach, beforeEach, describe, it, expect } from "vitest"; import { composeStories } from "@storybook/marko"; import { render, fireEvent, cleanup, waitFor } from "@marko/testing-library"; import * as stories from "../tooltip.stories"; @@ -12,16 +12,11 @@ let component; const renderBodyText = "View options"; -describe("given the default tooltip", () => { +describe("default tooltip", () => { beforeEach(async () => { - vi.useFakeTimers(); component = await render(Standard); }); - afterEach(() => { - vi.useRealTimers(); - }); - describe("when the host element is hovered", () => { beforeEach(async () => { await fireEvent.mouseEnter(component.getByText(renderBodyText)); @@ -33,32 +28,46 @@ describe("given the default tooltip", () => { ); }); - describe("when the host element loses hover", () => { + describe("when the escape key is pressed", () => { it("then it emits the collapse event", async () => { - await fireEvent.mouseLeave( - component.getByText(renderBodyText).parentElement, - ); + await fireEvent.keyDown(document, { + key: "Escape", + keyCode: 27, + }); - await vi.advanceTimersByTimeAsync(500); - await waitFor( - () => expect(component.emitted("collapse")).has.length(1), - 2000, + await waitFor(() => + expect(component.emitted("collapse")).has.length(1), ); }); }); + }); +}); - describe("when the escape key is pressed", () => { +describe("default tooltip", () => { + beforeEach(async () => { + component = await render(Standard); + }); + + describe("when the host element is hovered", () => { + beforeEach(async () => { + await fireEvent.focus(component.getByText(renderBodyText)); + }); + + it("then it emits the expand event", async () => { + await waitFor(() => + expect(component.emitted("expand")).has.length(1), + ); + }); + + describe("when it loses focus", () => { it("then it emits the collapse event", async () => { - await fireEvent.keyDown( + await fireEvent.mouseLeave( component.getByText(renderBodyText).parentElement, - { - key: "Escape", - keyCode: 27, - }, ); - await waitFor(() => - expect(component.emitted("collapse")).has.length(1), + await waitFor( + () => expect(component.emitted("collapse")).has.length(1), + { timeout: 2000 }, ); }); });