import { composeStories } from "@storybook/react"
import { screen } from "@testing-library/react"
import { userEvent } from "@testing-library/user-event"
import React from "react"
import { expect, describe, test } from "vitest"
import { render } from "../../../tests/render"
import * as stories from "./TabMenu.stories"

const { Default } = composeStories(stories)

describe("<TabMenu />", () => {
  test("Default", async () => {
    render(<Default />)

    expect(screen.getByRole("button", { name: "Top" })).toHaveAttribute(
      "aria-current",
      "page",
    )
    await userEvent.click(screen.getByRole("button", { name: "Trending" }))
    expect(screen.getByRole("button", { name: "Trending" })).toHaveAttribute(
      "aria-current",
      "page",
    )
    expect(screen.getByRole("link", { name: "More" })).toHaveTextContent("More")
  })
})