import React from "react";
import { render } from "@testing-library/react";
import { describe, it, expect } from "vitest";
import { TransitRoutes } from ".";
describe("TransitRoutes", () => {
    it("does not render when no routes are provided", () => {
        const { container } = render(React.createElement(TransitRoutes, { routes: [] }));
        expect(container.firstChild).toBeNull();
    });
    it("does not render when routes are undefined", () => {
        const { container } = render(React.createElement(TransitRoutes, { routes: undefined }));
        expect(container.firstChild).toBeNull();
    });
    it("renders a list of transit routes", () => {
        const routes = [
            {
                short_name: "Route 1",
                long_name: "Route 1 Long",
                route_color: "FF0000",
                text_color: "FFFFFF",
            },
            {
                short_name: "Route 2",
                long_name: "Route 2 Long",
                route_color: "00FF00",
                text_color: "000000",
            },
        ];
        const { getByTestId, getAllByTestId } = render(React.createElement(TransitRoutes, { routes: routes }));
        const container = getByTestId("transit-routes-container");
        expect(container).toBeInTheDocument();
        const items = getAllByTestId("transit-routes-item");
        expect(items).toHaveLength(2);
        expect(items[0]).toHaveTextContent("Route 1");
        expect(items[1]).toHaveTextContent("Route 2");
    });
    it("uses long names when useLongName is true", () => {
        const routes = [
            {
                short_name: "Route 1",
                long_name: "Route 1 Long",
                route_color: "FF0000",
                text_color: "FFFFFF",
            },
        ];
        const { getByTestId } = render(React.createElement(TransitRoutes, { routes: routes, useLongName: true }));
        const item = getByTestId("transit-routes-item");
        expect(item).toHaveTextContent("Route 1 Long");
    });
    it("applies correct styles based on route colors", () => {
        const routes = [
            {
                short_name: "Route 1",
                long_name: "Route 1 Long",
                route_color: "FF0000",
                text_color: "FFFFFF",
            },
        ];
        const { getByTestId } = render(React.createElement(TransitRoutes, { routes: routes }));
        const item = getByTestId("transit-routes-item");
        expect(item).toHaveStyle({
            "--transit-route-color": "#FF0000",
            "--transit-route-text-color": "#FFFFFF",
        });
    });
    it("handles routes with missing colors gracefully", () => {
        const routes = [
            {
                short_name: "Route 1",
                long_name: "Route 1 Long",
            },
        ];
        // @ts-expect-error Testing missing colors
        const { getByTestId } = render(React.createElement(TransitRoutes, { routes: routes }));
        const item = getByTestId("transit-routes-item");
        expect(item).toHaveStyle({
            "--transit-route-color": undefined,
            "--transit-route-text-color": undefined,
        });
    });
    it("handles routes with black colors correctly", () => {
        const routes = [
            {
                short_name: "Route 1",
                long_name: "Route 1 Long",
                route_color: "000000",
                text_color: "000000",
            },
        ];
        const { getByTestId } = render(React.createElement(TransitRoutes, { routes: routes }));
        const item = getByTestId("transit-routes-item");
        expect(item).toHaveStyle({
            "--transit-route-color": undefined,
            "--transit-route-text-color": undefined,
        });
    });
});
//# sourceMappingURL=index.test.js.map