import React from "react";
import UniqueCheck from "@ax/components/Fields/UniqueCheck";
import { ThemeProvider } from "styled-components";
import { parseTheme } from "@ax/helpers";
import globalTheme from "@ax/themes/theme.json";
import "@testing-library/jest-dom";
import { render, screen, cleanup } from "@testing-library/react";

afterEach(cleanup);

const optionsArray = [
	{
		name: "option_1",
		value: null,
		title: "Option 1",
	},
	{
		name: "option_2",
		value: null,
		title: "Option 2",
	},
];
const initialValues = {
	name: "",
	value: null,
	options: optionsArray,
	onChange: jest.fn(),
};

describe("CheckField component rendering", () => {
	it("should render the component CheckField", () => {
		render(
			<ThemeProvider theme={parseTheme(globalTheme)}>
				<UniqueCheck {...initialValues} />
			</ThemeProvider>,
		);

		const checkFieldLabel = screen.getByTestId("check-field-label");

		expect(screen.getAllByTestId("check-field-label")).toHaveLength(1);
		expect(checkFieldLabel).toHaveTextContent("Option 1");
	});
});
