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

afterEach(cleanup);

const defaultProps = mock<IRichTextProps>();
defaultProps.value = "This is the content";

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

		const richTextContent = screen.getByTestId("rich-text-wrapper");

		expect(richTextContent).toBeTruthy();
		expect(screen.getAllByText("This is the content")).toBeTruthy();
	});

	it("should render the component with html set to true", () => {
		defaultProps.html = true;

		render(
			<ThemeProvider theme={parseTheme(globalTheme)}>
				<RichText {...defaultProps} />
			</ThemeProvider>,
		);

		const richTextContent = screen.getByTestId("rich-text-wrapper");

		expect(richTextContent).toBeTruthy();
	});
});
