@3cr/viewer-browser 0.0.52 → 0.0.55

package/src/components/modal/__tests__/mftp-webgl-3dr-modal.spec.ts

@@ -0,0 +1,690 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import { shallowMountVuetify } from "~/helper";
+import MftpWebGL3DRModal from "../MftpWebGL3DRModal.vue";
+import {
+  inflateInitialScanState,
+  inflateScanState,
+} from "@/helpers/modelHelper";
+import {
+  AnchorPoint,
+  FileManagementActions,
+  FrontEndInterfaces,
+  PositionData,
+  PresetsActions,
+  ScanMovementActions,
+  ScanOrientationActions,
+  ScanStateActions,
+  ScanView,
+  SlidersActions,
+} from "@3cr/types-ts";
+import { flushPromises } from "@vue/test-utils";
+
+vi.mock("@3cr/sdk-browser", async (importOriginal) => {
+  const mod = (await importOriginal()) as object;
+  return {
+    ...mod,
+    registerVersion: vi.fn(),
+    createInstance: vi.fn(),
+    executePayload: vi.fn(),
+    registerOnPayloadHandler: vi.fn(),
+  };
+});
+
+describe("MftpWebGL3DRModal.vue", () => {
+  let wrapper = shallowMountVuetify(
+    MftpWebGL3DRModal,
+    {}
+    // { WebGL3DR: true, LoadingSpinner: true }
+  );
+
+  beforeEach(() => {
+    wrapper = shallowMountVuetify(
+      MftpWebGL3DRModal,
+      {}
+      // { WebGL3DR: true, LoadingSpinner: true }
+    );
+    // wrapper.vm.alterValue(true);
+    vi.useFakeTimers();
+  });
+
+  afterEach(() => {
+    vi.useRealTimers();
+  });
+
+  it("inflates", () => {
+    expect(wrapper).toBeTruthy();
+  });
+  describe("watchers", () => {
+    it("scanState.value.Display.Brightness", async () => {
+      await testWatcherForDisplay(wrapper, "Brightness", SlidersActions.sl01);
+    });
+
+    it("scanState.value.Display.Contrast", async () => {
+      await testWatcherForDisplay(wrapper, "Contrast", SlidersActions.sl02);
+    });
+
+    it("scanState.value.Display.Opacity", async () => {
+      await testWatcherForDisplay(wrapper, "Opacity", SlidersActions.sl03);
+    });
+
+    it("scanState.value.Display.WindowLower", async () => {
+      await testWatcherForDisplay(wrapper, "WindowLower", SlidersActions.sl04);
+    });
+
+    it("scanState.value.Display.WindowUpper", async () => {
+      await testWatcherForDisplay(wrapper, "WindowUpper", SlidersActions.sl05);
+    });
+
+    it("scanState.value.Display.ThresholdLower", async () => {
+      await testWatcherForDisplay(
+        wrapper,
+        "ThresholdLower",
+        SlidersActions.sl06
+      );
+    });
+
+    it("scanState.value.Display.ThresholdUpper", async () => {
+      await testWatcherForDisplay(
+        wrapper,
+        "ThresholdUpper",
+        SlidersActions.sl07
+      );
+    });
+
+    it("scanState.value.Slice.TransverseLower", async () => {
+      await testWatcherForSlice(
+        wrapper,
+        "TransverseLower",
+        SlidersActions.sl08
+      );
+    });
+
+    it("scanState.value.Orientations.Transverse.Slice", async () => {
+      await testWatcherForOrientation(
+        wrapper,
+        "Transverse",
+        SlidersActions.sl09
+      );
+    });
+
+    it("scanState.value.Slice.TransverseUpper", async () => {
+      await testWatcherForSlice(
+        wrapper,
+        "TransverseUpper",
+        SlidersActions.sl10
+      );
+    });
+
+    it("scanState.value.Slice.SagittalLower", async () => {
+      await testWatcherForSlice(wrapper, "SagittalLower", SlidersActions.sl11);
+    });
+
+    it("scanState.value.Orientations.Sagittal.Slice", async () => {
+      await testWatcherForOrientation(wrapper, "Sagittal", SlidersActions.sl12);
+    });
+
+    it("scanState.value.Slice.SagittalUpper", async () => {
+      await testWatcherForSlice(wrapper, "SagittalUpper", SlidersActions.sl13);
+    });
+
+    it("scanState.value.Slice.CoronalLower", async () => {
+      await testWatcherForSlice(wrapper, "CoronalLower", SlidersActions.sl14);
+    });
+
+    it("scanState.value.Orientations.Coronal.Slice", async () => {
+      await testWatcherForOrientation(wrapper, "Coronal", SlidersActions.sl15);
+    });
+
+    it("scanState.value.Slice.CoronalUpper", async () => {
+      await testWatcherForSlice(wrapper, "CoronalUpper", SlidersActions.sl16);
+    });
+
+    it("scanState.value.Slice.CoronalUpper transaction disabled", async () => {
+      wrapper.vm.transactionStarted = true;
+      await testWatcherForSlice(wrapper, "CoronalUpper", SlidersActions.sl16);
+    });
+
+    it("scanState.value.InteractionSettings.PanSensivitity transaction disabled", async () => {
+      wrapper.vm.transactionStarted = true;
+      await testWatcherForInteractionSettings(
+        wrapper,
+        "PanSensivitity",
+        ScanMovementActions.sm05
+      );
+    });
+
+    it("scanState.value.InteractionSettings.PanSensivitity", async () => {
+      await testWatcherForInteractionSettings(
+        wrapper,
+        "PanSensivitity",
+        ScanMovementActions.sm05
+      );
+    });
+
+    it("scanState.value.InteractionSettings.ZoomSensitivity", async () => {
+      await testWatcherForInteractionSettings(
+        wrapper,
+        "ZoomSensitivity",
+        ScanMovementActions.sm08
+      );
+    });
+
+    it("scanState.value.InteractionSettings.RotateSensitivity", async () => {
+      await testWatcherForInteractionSettings(
+        wrapper,
+        "RotateSensitivity",
+        ScanMovementActions.sm10
+      );
+    });
+
+    it("scanState.value.InteractionSettings.CameraRotateSensitivity", async () => {
+      await testWatcherForInteractionSettings(
+        wrapper,
+        "CameraRotateSensitivity",
+        ScanMovementActions.sm10
+      );
+    });
+  });
+  it("watches scanState", () => {
+    expect(wrapper).toBeTruthy();
+  });
+
+  it("getIconForPreset Bone", () => {
+    expect(wrapper.vm.getIconForPreset("Bone")).toBe("fa:fas fa-bone");
+  });
+
+  it("getIconForPreset Brain", () => {
+    expect(wrapper.vm.getIconForPreset("Brain")).toBe("fa:fas fa-brain");
+  });
+
+  it("getIconForPreset Liver", () => {
+    expect(wrapper.vm.getIconForPreset("Liver")).toBe("custom:liver_icon");
+  });
+
+  it("getIconForPreset Lungs", () => {
+    expect(wrapper.vm.getIconForPreset("Lungs")).toBe("fa:fas fa-lungs");
+  });
+
+  it("getIconForPreset Muscle", () => {
+    expect(wrapper.vm.getIconForPreset("Muscle")).toBe("custom:muscle_icon");
+  });
+
+  it("getIconForPreset Temporal Bones", () => {
+    expect(wrapper.vm.getIconForPreset("Temporal Bones")).toBe(
+      "custom:temporal_bones_icon"
+    );
+  });
+
+  it("getIconForPreset Soft Tissue", () => {
+    expect(wrapper.vm.getIconForPreset("Soft Tissue")).toBe(
+      "custom:torso_icon"
+    );
+  });
+
+  it("getIconForPreset Skin", () => {
+    expect(wrapper.vm.getIconForPreset("Skin")).toBe("custom:skin_icon");
+  });
+
+  it("getIconForPreset AKJSDHLKAJSDLJ", () => {
+    expect(wrapper.vm.getIconForPreset("AKJSDHLKAJSDLJ")).toBe(undefined);
+  });
+
+  it("windowSlider should be set", () => {
+    expect(wrapper.vm.windowSlider).toStrictEqual([0, 100]);
+  });
+
+  it("thresholdSlider should be set", () => {
+    expect(wrapper.vm.thresholdSlider).toStrictEqual([0, 100]);
+  });
+
+  it("tSlider should be set", () => {
+    expect(wrapper.vm.tSlider).toStrictEqual([0, 0]);
+  });
+
+  it("sSlider should be set", () => {
+    expect(wrapper.vm.sSlider).toStrictEqual([0, 0]);
+  });
+
+  it("cSlider should be set", () => {
+    expect(wrapper.vm.cSlider).toStrictEqual([0, 0]);
+  });
+
+  it("windowSlider should  set", async () => {
+    const newVals = [20, 20];
+    wrapper.vm.windowSlider = newVals;
+    await flushPromises();
+    expect(wrapper.vm.windowSlider).toStrictEqual(newVals);
+  });
+
+  it("thresholdSlider should set", async () => {
+    const newVals = [20, 20];
+    wrapper.vm.thresholdSlider = newVals;
+    await flushPromises();
+    expect(wrapper.vm.thresholdSlider).toStrictEqual(newVals);
+  });
+
+  it("tSlider should set", async () => {
+    const newVals = [0, 0];
+    wrapper.vm.tSlider = newVals;
+    await flushPromises();
+    expect(wrapper.vm.tSlider).toStrictEqual(newVals);
+  });
+
+  it("sSlider should set", async () => {
+    const newVals = [0, 0];
+    wrapper.vm.sSlider = newVals;
+    await flushPromises();
+    expect(wrapper.vm.sSlider).toStrictEqual(newVals);
+  });
+
+  it("cSlider should set", async () => {
+    const newVals = [0, 0];
+    wrapper.vm.cSlider = newVals;
+    await flushPromises();
+    expect(wrapper.vm.cSlider).toStrictEqual(newVals);
+  });
+
+  it("should closeModal", async () => {
+    wrapper.vm.closeModal();
+    wrapper.vm.m_closeDialog = true;
+
+    await flushPromises();
+    wrapper.findComponent("#close-dialog-prompt");
+  });
+
+  it("should handleOnPayload file_management", async () => {
+    wrapper.vm.handleOnPayload(
+      FrontEndInterfaces.file_management,
+      "123",
+      "123"
+    );
+  });
+
+  it("should handleOnPayload file_management", async () => {
+    wrapper.vm.handleOnPayload(
+      FrontEndInterfaces.file_management,
+      FileManagementActions.fm02,
+      JSON.stringify(inflateInitialScanState())
+    );
+  });
+  it("should handleOnPayload notifications", async () => {
+    wrapper.vm.handleOnPayload(FrontEndInterfaces.notifications, "123", "123");
+  });
+
+  it("should handleOnPayload scan_state", async () => {
+    wrapper.vm.handleOnPayload(
+      FrontEndInterfaces.scan_state,
+      ScanStateActions.ss01,
+      JSON.stringify(inflateScanState())
+    );
+  });
+
+  it("should isLayout2x2", async () => {
+    const scanState = inflateScanState();
+    scanState.Layout.PositionData = [
+      { Anchor: AnchorPoint.TOP_LEFT } as PositionData,
+      { Anchor: AnchorPoint.TOP_RIGHT } as PositionData,
+      { Anchor: AnchorPoint.BOTTOM_LEFT } as PositionData,
+      { Anchor: AnchorPoint.BOTTOM_RIGHT } as PositionData,
+    ];
+
+    wrapper.vm.setScanState(JSON.stringify(scanState));
+
+    expect(wrapper.vm.isLayout2x2).toBeTruthy();
+  });
+
+  it("should isLayout1x3", async () => {
+    const scanState = inflateScanState();
+    scanState.Layout.PositionData = [
+      { Anchor: AnchorPoint.CENTER } as PositionData,
+      { Anchor: AnchorPoint.TOP_RIGHT } as PositionData,
+      { Anchor: AnchorPoint.RIGHT } as PositionData,
+      { Anchor: AnchorPoint.BOTTOM_RIGHT } as PositionData,
+    ];
+
+    wrapper.vm.setScanState(JSON.stringify(scanState));
+
+    expect(wrapper.vm.isLayout1x3).toBeTruthy();
+  });
+
+  it("should snap", async () => {
+    await wrapper.vm.snap();
+
+    expect(wrapper.emitted()["snap"]).toStrictEqual([[]]);
+  });
+
+  it("should getCurrentGreyscalePreset", async () => {
+    const initial = inflateInitialScanState();
+
+    initial.GreyscalePresets = [
+      { Name: "testing", Lower: 30, Upper: 60, Version: "1.0.0" },
+    ];
+
+    wrapper.vm.handleOnPayload(
+      FrontEndInterfaces.file_management,
+      FileManagementActions.fm02,
+      JSON.stringify(initial)
+    );
+    await flushPromises();
+
+    const scanState = inflateScanState();
+    scanState.Display.WindowLower = 30;
+    scanState.Display.WindowUpper = 60;
+
+    wrapper.vm.setScanState(JSON.stringify(scanState));
+    await flushPromises();
+    expect(wrapper.vm.getCurrentGreyscalePreset()).toBe("testing");
+  });
+
+  it("should getCurrentGreyscalePreset", async () => {
+    const initial = inflateInitialScanState();
+
+    initial.GreyscalePresets = [
+      { Name: "testing", Lower: 30, Upper: 60, Version: "1.0.0" },
+    ];
+    initial.HuLower = 40;
+    initial.HuUpper = 50;
+
+    wrapper.vm.handleOnPayload(
+      FrontEndInterfaces.file_management,
+      FileManagementActions.fm02,
+      JSON.stringify(initial)
+    );
+    await flushPromises();
+
+    const scanState = inflateScanState();
+    scanState.Display.WindowLower = 40;
+    scanState.Display.WindowUpper = 50;
+
+    wrapper.vm.setScanState(JSON.stringify(scanState));
+    await flushPromises();
+    expect(wrapper.vm.getCurrentGreyscalePreset()).toBe("testing");
+  });
+
+  it("should getCurrentGreyscalePreset", async () => {
+    const initial = inflateInitialScanState();
+
+    initial.GreyscalePresets = [
+      { Name: "testing", Lower: 30, Upper: 60, Version: "1.0.0" },
+    ];
+    initial.HuLower = 40;
+    initial.HuUpper = 50;
+
+    wrapper.vm.handleOnPayload(
+      FrontEndInterfaces.file_management,
+      FileManagementActions.fm02,
+      JSON.stringify(initial)
+    );
+    await flushPromises();
+
+    const scanState = inflateScanState();
+    scanState.Display.WindowLower = 45;
+    scanState.Display.WindowUpper = 46;
+
+    wrapper.vm.setScanState(JSON.stringify(scanState));
+    await flushPromises();
+    expect(wrapper.vm.getCurrentGreyscalePreset()).toBe(undefined);
+  });
+
+  it("should rotateByDeg", async () => {
+    const view = ScanView.Coronal;
+    const deg = 10;
+
+    vi.spyOn(wrapper.vm, "sendPayload").mockImplementation(
+      (it: string, a: string, m: any) => {
+        expect(it).toBe(FrontEndInterfaces.scan_orientation);
+        expect(a).toBe(ScanOrientationActions.so01);
+        expect(m).toStrictEqual({
+          Version: "0.0.1",
+          View: view,
+          Angle: deg,
+        });
+        return Promise.resolve();
+      }
+    );
+
+    await wrapper.vm.rotateByDeg(view, deg);
+  });
+
+  it("should fullscreenLayout", async () => {
+    const view = ScanView.Coronal;
+
+    vi.spyOn(wrapper.vm, "sendPayload")
+      .mockImplementationOnce((it: string, a: string, m: any) => {
+        expect(it).toBe(FrontEndInterfaces.layout);
+        expect(a).toBe("lo_01");
+        expect(m).toStrictEqual({
+          Version: "0.0.1",
+        });
+        return Promise.resolve();
+      })
+      .mockImplementationOnce((it: string, a: string, m: any) => {
+        expect(it).toBe(FrontEndInterfaces.view_selection);
+        expect(a).toBe(`vs_0${view + 1}`);
+        expect(m).toStrictEqual({
+          Version: "0.0.1",
+        });
+        return Promise.resolve();
+      });
+
+    await wrapper.vm.fullscreenLayout(view);
+  });
+
+  it("should layouts", async () => {
+    vi.spyOn(wrapper.vm, "sendPayload").mockImplementationOnce(
+      (it: string, a: string, m: any) => {
+        expect(it).toBe(FrontEndInterfaces.layout);
+        expect(a).toBe("lo_02");
+        expect(m).toStrictEqual({
+          Version: "0.0.1",
+        });
+        return Promise.resolve();
+      }
+    );
+
+    await wrapper.vm.layouts("lo_02");
+  });
+
+  it("should setPreset", async () => {
+    const action = PresetsActions.pr01;
+    const preset = {};
+
+    vi.spyOn(wrapper.vm, "sendPayload").mockImplementationOnce(
+      (it: string, a: string, m: any) => {
+        expect(it).toBe(FrontEndInterfaces.presets);
+        expect(a).toBe(action);
+        expect(m).toStrictEqual(preset);
+        return Promise.resolve();
+      }
+    );
+
+    await wrapper.vm.setPreset(action, preset);
+  });
+
+  it("should setPreset pr02", async () => {
+    const action = PresetsActions.pr02;
+    const preset = {};
+
+    vi.spyOn(wrapper.vm, "sendPayload").mockImplementationOnce(
+      (it: string, a: string, m: any) => {
+        expect(it).toBe(FrontEndInterfaces.presets);
+        expect(a).toBe(action);
+        expect(m).toStrictEqual(preset);
+        return Promise.resolve();
+      }
+    );
+
+    await wrapper.vm.setPreset(action, preset);
+  });
+
+  it("should getCurrentGreyscalePreset", async () => {
+    expect(wrapper.vm.getCurrentGreyscalePreset()).toBe(undefined);
+  });
+
+  it("should getViewName 3D Volume", async () => {
+    expect(wrapper.vm.getViewName(0)).toBe("3D Volume");
+  });
+
+  it("should getViewName Sagittal", async () => {
+    expect(wrapper.vm.getViewName(2)).toBe("Sagittal");
+  });
+
+  it("should getCurrentActiveView Sagittal", async () => {
+    expect(
+      wrapper.vm.getCurrentActiveView({
+        Anchor: AnchorPoint.CENTER,
+        ActiveView: true,
+        AspectRatio: 1,
+        MaxSize: {
+          Version: "0.0.1",
+          X: 1,
+          Y: 1,
+        },
+        DefaultView: ScanView.Coronal,
+        Priority: 1,
+        Version: "0.0.1",
+        Offset: {
+          Version: "0.0.1",
+          X: 1,
+          Y: 1,
+        },
+      })
+    ).toBe(3);
+  });
+
+  it("should getCurrentActiveView Sagittal", async () => {
+    const initalState = inflateScanState();
+    initalState.Layout.PositionData = [
+      {
+        Anchor: AnchorPoint.CENTER,
+        ActiveView: true,
+        AspectRatio: 1,
+        MaxSize: {
+          Version: "1.0.0",
+          X: 1,
+          Y: 1,
+        },
+        DefaultView: ScanView.Coronal,
+        Priority: 1,
+        Offset: {
+          Version: "1.0.0",
+          X: 1,
+          Y: 1,
+        },
+        Version: "1.0.0",
+      },
+    ];
+    await wrapper.vm.setScanState(JSON.stringify(initalState));
+
+    expect(
+      wrapper.vm.getCurrentActiveView({
+        Anchor: AnchorPoint.CENTER,
+        ActiveView: true,
+        AspectRatio: 1,
+        MaxSize: {
+          Version: "0.0.1",
+          X: 1,
+          Y: 1,
+        },
+        DefaultView: ScanView.Coronal,
+        Priority: 1,
+        Version: "0.0.1",
+        Offset: {
+          Version: "0.0.1",
+          X: 1,
+          Y: 1,
+        },
+      })
+    ).toBe(0);
+  });
+
+  it("should footerItems", async () => {
+    for (const footerItem of wrapper.vm.footerItems) {
+      const promise = footerItem.click();
+      expect(promise).toBeTruthy();
+      await promise;
+    }
+  });
+});
+
+async function testWatcherForDisplay(
+  wrapper: any,
+  key: string,
+  action: SlidersActions
+) {
+  const scanState = inflateScanState();
+  (scanState.Display as any)[key] = 60;
+
+  setupPayloadSpy(wrapper, FrontEndInterfaces.sliders, action, {
+    Version: "0.0.1",
+    Value: (scanState.Display as any)[key],
+  });
+  wrapper.vm.setScanState(JSON.stringify(scanState));
+
+  await flushPromises();
+}
+
+async function testWatcherForSlice(
+  wrapper: any,
+  key: string,
+  action: SlidersActions
+) {
+  const scanState = inflateScanState();
+  (scanState.Slice as any)[key] = 100;
+
+  setupPayloadSpy(wrapper, FrontEndInterfaces.sliders, action, {
+    Version: "0.0.1",
+    Value: (scanState.Slice as any)[key],
+  });
+  wrapper.vm.setScanState(JSON.stringify(scanState));
+
+  await flushPromises();
+}
+
+async function testWatcherForOrientation(
+  wrapper: any,
+  key: string,
+  action: SlidersActions
+) {
+  const scanState = inflateScanState();
+  (scanState.Orientations as any)[key].Slice = 100;
+
+  setupPayloadSpy(wrapper, FrontEndInterfaces.sliders, action, {
+    Version: "0.0.1",
+    Value: (scanState.Orientations as any)[key].Slice,
+  });
+  wrapper.vm.setScanState(JSON.stringify(scanState));
+
+  await flushPromises();
+}
+
+async function testWatcherForInteractionSettings(
+  wrapper: any,
+  key: string,
+  action: ScanMovementActions
+) {
+  const scanState = inflateScanState();
+  (scanState.InteractionSettings as any)[key] = 100;
+
+  setupPayloadSpy(wrapper, FrontEndInterfaces.scan_movement, action, {
+    Version: "0.0.1",
+    Value: (scanState.InteractionSettings as any)[key],
+  });
+  wrapper.vm.setScanState(JSON.stringify(scanState));
+
+  await flushPromises();
+}
+
+function setupPayloadSpy(
+  wrapper: any,
+  interfaceType: FrontEndInterfaces,
+  actionType: string,
+  message: any
+) {
+  wrapper.vm.sendPayload = (it: FrontEndInterfaces, a: string, m: any) => {
+    console.log(it, a, m);
+    expect(it).toBe(interfaceType);
+    expect(a).toBe(actionType);
+    expect(m).toStrictEqual(message);
+  };
+}

package/src/components/selectors/__tests__/value-selector.spec.ts

@@ -0,0 +1,35 @@
+import { beforeEach, describe, expect, it } from "vitest";
+
+import { mountVuetify } from "~/helper";
+import ValueSelector from "@/components/selectors/ValueSelector.vue";
+import { flushPromises } from "@vue/test-utils";
+
+describe("ValueSelector.vue", () => {
+  let wrapper = mountVuetify(ValueSelector, {
+    value: 1,
+  });
+
+  beforeEach(() => {
+    wrapper = mountVuetify(ValueSelector, {
+      value: [0, 0],
+    });
+  });
+
+  it("should inflate component", () => {
+    expect(wrapper).toBeTruthy();
+  });
+
+  it("should change from props", async () => {
+    await wrapper.setProps({
+      value: 1,
+    });
+    await flushPromises();
+    expect(wrapper.vm.value).toStrictEqual(1);
+  });
+
+  it("should set text", async () => {
+    const slider = wrapper.findAllComponents(".v-text-field");
+
+    await slider[0].setValue(10);
+  });
+});