import { ScanView } from '@3cr/types-ts';
import { DOMWrapper, mount } from '@vue/test-utils';
import Flip3dAction from '@/components/modal/actions/Flip3dAction.vue';
import { useViewer3cr } from '@/composables/useViewer3cr';

describe('Flip3dAction tests', () => {
  const viewer3cr = useViewer3cr();
  const props = { view: ScanView.Volume };

  const spy = vi.spyOn(viewer3cr, 'invertTransform').mockResolvedValue();
  const wrapper = mount(Flip3dAction, { props });

  it('should flip sagittal', async () => {
    const activator = wrapper.findComponentByTestId('activator');
    await activator.trigger('click');
    const menu = new DOMWrapper(document.querySelector('[data-testid="menu"]'));
    const sagittal = menu.findComponentByTestId('sagittal');
    await sagittal.trigger('click');
    expect(spy).toHaveBeenCalledWith({
      message: {
        InvertedSagittal: true,
        InvertedCoronal: false,
        InvertedTransverse: false,
        Version: '0.0.0',
      },
    });
    await activator.trigger('click');
    await sagittal.trigger('click');
    expect(spy).toHaveBeenCalledWith({
      message: {
        InvertedSagittal: true,
        InvertedCoronal: false,
        InvertedTransverse: false,
        Version: '0.0.0',
      },
    });
  });

  it('should flip coronal', async () => {
    const activator = wrapper.findComponentByTestId('activator');
    await activator.trigger('click');
    const menu = new DOMWrapper(document.querySelector('[data-testid="menu"]'));
    const coronal = menu.findComponentByTestId('coronal');
    await coronal.trigger('click');
    expect(spy).toHaveBeenCalledWith({
      message: {
        InvertedSagittal: false,
        InvertedCoronal: true,
        InvertedTransverse: false,
        Version: '0.0.0',
      },
    });
    await activator.trigger('click');
    await coronal.trigger('click');
    expect(spy).toHaveBeenCalledWith({
      message: {
        InvertedSagittal: false,
        InvertedCoronal: false,
        InvertedTransverse: false,
        Version: '0.0.0',
      },
    });
  });

  it('should flip transverse', async () => {
    const activator = wrapper.findComponentByTestId('activator');
    await activator.trigger('click');
    const menu = new DOMWrapper(document.querySelector('[data-testid="menu"]'));
    const transverse = menu.findComponentByTestId('transverse');
    await transverse.trigger('click');
    expect(spy).toHaveBeenCalledWith({
      message: {
        InvertedSagittal: false,
        InvertedCoronal: false,
        InvertedTransverse: true,
        Version: '0.0.0',
      },
    });
    await activator.trigger('click');
    await transverse.trigger('click');
    expect(spy).toHaveBeenCalledWith({
      message: {
        InvertedSagittal: false,
        InvertedCoronal: false,
        InvertedTransverse: false,
        Version: '0.0.0',
      },
    });
  });
});