import {
	getAccessibleName,
	hasAccessibleName,
} from "../../fixtures/accessibility";
import { SELECTORS } from "../../fixtures/selectors";
import { expect, test } from "../../fixtures/test";

test.describe("Icon-Only Control Accessible Names @smoke", () => {
	test.beforeEach(async ({ gotoApp, waitForAppReady }) => {
		await gotoApp();
		await waitForAppReady();
	});

	test("share buttons have accessible names", async ({ page, waitForHero }) => {
		// Open modal to access share buttons
		const hero = await waitForHero();
		await hero.locator(SELECTORS.hero.readButton).click();

		const modal = page.locator(SELECTORS.summaryModal.root);
		await expect(modal).toBeVisible();

		// Check X share button
		const shareX = modal.locator(SELECTORS.summaryModal.shareX);
		await expect(shareX).toHaveAttribute("aria-label", "Share on X");
		expect(await hasAccessibleName(shareX)).toBe(true);

		// Check WhatsApp share button
		const shareWhatsApp = modal.locator(SELECTORS.summaryModal.shareWhatsApp);
		await expect(shareWhatsApp).toHaveAttribute(
			"aria-label",
			"Share on WhatsApp",
		);
		expect(await hasAccessibleName(shareWhatsApp)).toBe(true);

		// Check LinkedIn share button
		const shareLinkedIn = modal.locator(SELECTORS.summaryModal.shareLinkedIn);
		await expect(shareLinkedIn).toHaveAttribute(
			"aria-label",
			"Share on LinkedIn",
		);
		expect(await hasAccessibleName(shareLinkedIn)).toBe(true);

		// Check copy link button
		const shareCopy = modal.locator(SELECTORS.summaryModal.shareCopy);
		await expect(shareCopy).toHaveAttribute("aria-label", "Copy article link");
		expect(await hasAccessibleName(shareCopy)).toBe(true);
	});

	test("theme menu button has accessible name", async ({ page }) => {
		const themeButton = page.locator(SELECTORS.header.themeMenuButton);

		await expect(themeButton).toHaveAttribute("aria-label", "Open theme menu");
		expect(await hasAccessibleName(themeButton)).toBe(true);
	});

	test("back to top button has accessible name", async ({ page }) => {
		// Scroll down to make back-to-top visible
		await page.evaluate(() => window.scrollTo(0, 500));
		await page.waitForTimeout(500);

		const backToTop = page.locator(SELECTORS.backToTop.root);

		// Button may not be visible yet, but should have accessible name
		const hasName = await hasAccessibleName(backToTop);
		expect(hasName).toBe(true);

		const name = await getAccessibleName(page, backToTop);
		expect(name).toContain("top");
	});

	test("modal close button has accessible name", async ({
		page,
		waitForHero,
	}) => {
		// Open modal
		const hero = await waitForHero();
		await hero.locator(SELECTORS.hero.readButton).click();

		const modal = page.locator(SELECTORS.summaryModal.root);
		await expect(modal).toBeVisible();

		// Check close button
		const closeButton = modal.locator(SELECTORS.summaryModal.closeButton);
		expect(await hasAccessibleName(closeButton)).toBe(true);

		const name = await getAccessibleName(page, closeButton);
		expect(name?.toLowerCase()).toContain("close");
	});

	test("policy modal close button has accessible name", async ({
		page,
		gotoApp,
	}) => {
		// Open policy modal
		await gotoApp({ policy: "terms" });
		await page.waitForTimeout(1000);

		const modal = page.locator(SELECTORS.policyModal.root);
		await expect(modal).toBeVisible();

		// Check close button
		const closeButton = modal.locator(SELECTORS.policyModal.closeButton);
		expect(await hasAccessibleName(closeButton)).toBe(true);

		const name = await getAccessibleName(page, closeButton);
		expect(name?.toLowerCase()).toContain("close");
	});

	test("all interactive icons have aria-hidden on SVG", async ({
		page,
		waitForHero,
	}) => {
		// Open modal to access share buttons
		const hero = await waitForHero();
		await hero.locator(SELECTORS.hero.readButton).click();

		const modal = page.locator(SELECTORS.summaryModal.root);
		await expect(modal).toBeVisible();

		// Check all SVGs in share buttons are aria-hidden
		const svgs = modal.locator(".share-icon-btn svg");
		const count = await svgs.count();

		for (let i = 0; i < count; i++) {
			const svg = svgs.nth(i);
			const ariaHidden = await svg.getAttribute("aria-hidden");
			expect(ariaHidden).toBe("true");
		}
	});
});