Add interaction to Tooltip story play function

Author: buberdds

src/stories/Tooltip/Tooltip.stories.tsx

@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/react-vite'
 import { Tooltip } from '../../components/ui/tooltip.tsx'
 import { Button } from '../../components/ui/button.tsx'
-import { expect, within } from 'storybook/test'
+import { expect, userEvent, within } from 'storybook/test'
 
 const meta: Meta<typeof Tooltip> = {
   title: 'Components/Tooltip',
@@ -54,5 +54,12 @@ export const Default: Story = {
     const canvas = within(canvasElement)
     const button = canvas.getAllByRole('button', { name: 'Hover me' })[0]
     await expect(button).toBeInTheDocument()
+    await userEvent.hover(button)
+    const container = within(canvasElement.parentNode as HTMLElement)
+    // Is component mounted twice? https://github.com/storybookjs/storybook/issues/23921
+    const allTooltipContents = await container.findAllByText('Tooltip content', { exact: false })
+    const tooltipContent = allTooltipContents[0]
+    await expect(tooltipContent).toBeInTheDocument()
+    await expect(tooltipContent).toHaveClass('bg-popover')
   },
 }