import { mount } from '@vue/test-utils';
import ViewerScanView from '@/components/modal/ViewerScanView.vue';
import { PositionData, ScanView } from '@3cr/types-ts';
import VerticalSliderSelector from '@/components/shared/VerticalSliderSelector.vue';
import * as scan from '@/models/scanState';
import { VBtn, VIcon } from 'vuetify/components';
import ViewerActionRail from '@/components/modal/ViewerActionRail.vue';

describe('ViewerScanView tests', () => {
  const canvas = document.createElement('canvas');

  it('should mount volume', () => {
    const props = {
      position: { DefaultView: ScanView.Volume } as PositionData,
      canvas,
    };
    const wrapper = mount(ViewerScanView, { props });
    expect(wrapper).toBeTruthy();
  });

  it('should mount transverse', async () => {
    const props = {
      position: { DefaultView: ScanView.Transverse } as PositionData,
      canvas,
    };
    const wrapper = mount(ViewerScanView, { props });
    await wrapper.findComponent(VerticalSliderSelector).setValue(100, 'value');
    expect(scan.scanState.value.Orientations.Transverse.Slice).toBe(100);
  });

  it('should mount coronal', async () => {
    const props = {
      position: { DefaultView: ScanView.Coronal } as PositionData,
      canvas,
    };
    const wrapper = mount(ViewerScanView, { props });
    await wrapper.findComponent(VerticalSliderSelector).setValue(100, 'value');
    expect(scan.scanState.value.Orientations.Coronal.Slice).toBe(100);
  });

  it('should mount sagittal', async () => {
    const props = {
      position: { DefaultView: ScanView.Sagittal } as PositionData,
      canvas,
    };
    const wrapper = mount(ViewerScanView, { props });
    await wrapper.findComponent(VerticalSliderSelector).setValue(100, 'value');
    expect(scan.scanState.value.Orientations.Sagittal.Slice).toBe(100);
  });

  it('should horizontal flip', () => {
    vi.spyOn(scan, 'isHorizontalFlip').mockReturnValue(true);
    const props = {
      position: { DefaultView: ScanView.Sagittal } as PositionData,
      canvas,
    };
    const wrapper = mount(ViewerScanView, { props });
    expect(wrapper.findComponent(VIcon).isVisible()).toBeTruthy();
  });

  it('should vertical flip', () => {
    vi.spyOn(scan, 'isVerticalFlip').mockReturnValue(true);
    const props = {
      position: { DefaultView: ScanView.Sagittal } as PositionData,
      canvas,
    };
    const wrapper = mount(ViewerScanView, { props });
    expect(wrapper.findComponent(VIcon).isVisible()).toBeTruthy();
  });

  it('should keep hover active', async () => {
    const props = {
      position: { DefaultView: ScanView.Sagittal } as PositionData,
      canvas,
    };
    const wrapper = mount(ViewerScanView, { props });
    const actions = wrapper.findAllComponents(VBtn);
    for (const action of actions) {
      await action.trigger('click');
    }
    expect(wrapper.findComponent(ViewerActionRail).isVisible).toBeTruthy();
  });

  it('should enter', async () => {
    const props = {
      position: { DefaultView: ScanView.Volume } as PositionData,
      canvas,
    };
    const wrapper = mount(ViewerScanView, { props });
    await wrapper.trigger('mouseenter');
    await wrapper.trigger('mouseleave');
    expect(wrapper.findComponent(ViewerActionRail).isVisible).toBeTruthy();
  });
});