import {
  inflateInitialScanState,
  inflateScanState,
} from '@/functions/modelHelper';
import {
  currentColourPreset,
  currentGreyscalePreset,
  setInitialScanStateFromPayload,
  setScanState,
  thresholdSlider,
  windowSlider,
} from '@/models/scanState';
import { ColourPresetData } from '@3cr/types-ts';
import { VRangeSlider } from 'vuetify/components';
import { mount } from '@vue/test-utils';
import ViewerDisplaySettings from '@/components/navigation/display/DisplayPanel.vue';
import DoubleSliderSelector from '@/components/shared/DoubleSliderSelector.vue';

describe('ViewerDisplaySettings tests', () => {
  it('should mount', () => {
    const wrapper = mount(ViewerDisplaySettings);
    expect(wrapper).toBeTruthy();
  });

  describe('sliders', async () => {
    const wrapper = mount(ViewerDisplaySettings);
    const sliders = wrapper.findAllComponents(DoubleSliderSelector);

    it('should test window slider', async () => {
      const slider = sliders[0].findComponent(VRangeSlider);
      await slider.setValue([20, 40]);
      expect(windowSlider.value).toStrictEqual([20, 40]);
    });

    it('should test threshold slider', async () => {
      const slider = sliders[1].findComponent(VRangeSlider);
      await slider.setValue([50, 80]);
      expect(thresholdSlider.value).toStrictEqual([50, 80]);
    });
  });

  it('should set greyscale preset', async () => {
    const initial = inflateInitialScanState();
    initial.GreyscalePresets = [
      { Name: 'testing', Lower: 30, Upper: 60, Version: '1.0.0' },
    ];
    setInitialScanStateFromPayload(JSON.stringify(initial));

    const scanState = inflateScanState();
    scanState.Display.WindowLower = 30;
    scanState.Display.WindowUpper = 60;
    setScanState(JSON.stringify(scanState));

    const wrapper = mount(ViewerDisplaySettings);
    const greyscale = wrapper.findComponentByTestId('greyscale');
    await greyscale.setValue(initial.GreyscalePresets[0]);
    expect(currentGreyscalePreset.value).toStrictEqual(
      initial.GreyscalePresets[0],
    );
  });

  it('should set colour preset', async () => {
    const initial = inflateInitialScanState();
    initial.ColourPresets = [{ Name: 'testing' } as ColourPresetData];
    setInitialScanStateFromPayload(JSON.stringify(initial));

    const wrapper = mount(ViewerDisplaySettings);
    const colour = wrapper.findComponentByTestId('colour');
    await colour.setValue(initial.ColourPresets[0]);
    expect(currentColourPreset.value).toStrictEqual(initial.ColourPresets[0]);
  });

  it('should set colour preset from null', async () => {
    const initial = inflateInitialScanState();
    initial.ColourPresets = [{ Name: 'None' } as ColourPresetData];
    setInitialScanStateFromPayload(JSON.stringify(initial));

    const wrapper = mount(ViewerDisplaySettings);
    const colour = wrapper.findComponentByTestId('colour');
    await colour.setValue(null);
    expect(currentColourPreset.value).toStrictEqual(initial.ColourPresets[0]);
  });
});