import React from 'react';
import { render as renderDom, screen } from '@testing-library/react';
import { SectionBody } from '../components/sectionBody';
import { Section } from '../section';
import type { SectionProps } from '../types';

describe('<Section>', () => {
    const render = (props?: Partial<SectionProps>) =>
        // eslint-disable-next-line react/no-children-prop
        renderDom(<Section children="test" {...props} />);

    test('renders content', () => {
        const bodyContent = 'TEST TEXT';
        render({ children: bodyContent });

        expect(screen.getByText(bodyContent)).toBeVisible();
    });

    test('applies style', () => {
        render({ style: { marginTop: 10 } });

        expect(screen.getByTestId('SuiteSection')).toHaveStyle({ marginTop: '10px' });
    });

    describe('level', () => {
        test('defaults to top', () => {
            render();

            expect(screen.getByTestId('SuiteSection')).toHaveClass('SuiteSection-top');
        });

        test('can be overridden', () => {
            render({ level: 'nested' });

            expect(screen.getByTestId('SuiteSection')).toHaveClass('SuiteSection-nested');
        });
    });

    describe('expandable', () => {
        const renderWithBody = (props?: Partial<SectionProps>) =>
            renderDom(
                <Section {...props}>
                    <SectionBody>body content</SectionBody>
                </Section>
            );

        test('does not include ExpandableBody classes when expandable is not set', () => {
            renderWithBody();
            expect(screen.getByText('body content')).toBeVisible();
            const body = screen.getByTestId('SuiteSection-body');
            expect(body).not.toHaveClass('ExpandableBody');
            expect(body).not.toHaveAttribute('aria-hidden');
        });

        test('does not include ExpandableBody classes when expandable is false', () => {
            renderWithBody({ expandable: false });
            expect(screen.getByText('body content')).toBeVisible();
            const body = screen.getByTestId('SuiteSection-body');
            expect(body).not.toHaveClass('ExpandableBody');
            expect(body).not.toHaveAttribute('aria-hidden');
        });

        test('includes ExpandableBody classes when expandable is true', () => {
            renderWithBody({ expandable: true });
            const body = screen.getByTestId('SuiteSection-body');
            expect(body).toHaveClass('ExpandableBody');
            expect(body).toHaveAttribute('aria-hidden', 'false');
        });

        test('starts collapsed when expandable is true and defaultExpanded is false', () => {
            renderWithBody({ expandable: true, defaultExpanded: false });
            const body = screen.getByTestId('SuiteSection-body');
            expect(body).toHaveClass('ExpandableBody-collapsed');
            expect(body).toHaveAttribute('aria-hidden', 'true');
        });
    });
});