import { render } from '@testing-library/react';

import { RichTextEditor } from '../rich-text-editor';
import type { CrystallizeRichText } from '../types/crystallize-rich-text-types';
import { sleep } from './utils';

describe('RichTextEditor model basics', () => {
  it('will leave a simple model unchanged', async () => {
    const onChange = vi.fn();

    render(
      <RichTextEditor
        initialData={[{ kind: 'block', type: 'paragraph', textContent: 'rabbit' }]}
        triggerOnChangeOnAutoFocus
        autoFocus
        onChange={onChange}
      />,
    );

    await sleep(1);

    expect(onChange).toBeCalledWith([
      { kind: 'block', type: 'paragraph', textContent: 'rabbit' },
    ] as CrystallizeRichText);
  });

  it('will bump the textContent to the parent if it is a single text leaf node', async () => {
    const onChange = vi.fn();

    render(
      <RichTextEditor
        initialData={[
          {
            kind: 'block',
            type: 'paragraph',
            children: [
              {
                textContent: 'rabbit',
                kind: 'inline',
              },
            ],
          },
        ]}
        onChange={onChange}
        triggerOnChangeOnAutoFocus
        autoFocus
      />,
    );

    await sleep(1);

    expect(onChange).toBeCalledWith([
      { kind: 'block', type: 'paragraph', textContent: 'rabbit' },
    ] as CrystallizeRichText);
  });
});
