Skip to content

Commit

Permalink
adapted unit tests & added new tests
Browse files Browse the repository at this point in the history
  • Loading branch information
GordonNicholasCap committed Jun 28, 2024
1 parent ce5a21f commit 4ebb2c5
Showing 1 changed file with 198 additions and 10 deletions.
208 changes: 198 additions & 10 deletions src/components/administration/ExternalToolSection.unit.ts
Original file line number Diff line number Diff line change
Expand Up @@ -23,11 +23,13 @@ import {
import { useSchoolExternalToolUsage } from "@data-external-tool";
import { createMock, DeepMocked } from "@golevelup/ts-jest";
import { mdiAlert, mdiCheckCircle } from "@mdi/js";
import { mount } from "@vue/test-utils";
import { mount, VueWrapper } from "@vue/test-utils";
import { nextTick, ref } from "vue";
import vueDompurifyHTMLPlugin from "vue-dompurify-html";
import { Router, useRouter } from "vue-router";
import ExternalToolSection from "./ExternalToolSection.vue";
import { SchoolExternalToolMetadata } from "@/store/external-tool";
import { ConfigResponse } from "@/serverApi/v3";

jest.mock("@data-external-tool");

Expand All @@ -43,7 +45,10 @@ describe("ExternalToolSection", () => {

const createDatasheetButtonIndex = 1;

const getWrapper = (getters: Partial<SchoolExternalToolsModule> = {}) => {
const getWrapper = (
getters: Partial<SchoolExternalToolsModule> = {},
envs: Partial<ConfigResponse> = {}
) => {
el = document.createElement("div");
el.setAttribute("data-app", "true");
document.body.appendChild(el);
Expand All @@ -64,9 +69,7 @@ describe("ExternalToolSection", () => {
});

const envConfigModule = createModuleMocks(EnvConfigModule, {
getEnv: envsFactory.build({
FEATURE_MEDIA_SHELF_ENABLED: true,
}),
getEnv: envsFactory.build(envs),
});

const router = createMock<Router>();
Expand Down Expand Up @@ -421,7 +424,7 @@ describe("ExternalToolSection", () => {
describe("when metadata is given", () => {
const setup = () => {
const schoolExternalToolMetadata =
schoolExternalToolMetadataFactory.build({ mediaBoard: 1 });
schoolExternalToolMetadataFactory.build();

useSchoolExternalToolUsageMock.metadata = ref(
schoolExternalToolMetadata
Expand Down Expand Up @@ -454,19 +457,30 @@ describe("ExternalToolSection", () => {
expect(dialog.isVisible()).toBeTruthy();
});

it("should display tool usage count", async () => {
it("should display tool usage count for courses and board elements", async () => {
const { wrapper, schoolExternalToolMetadata } = setup();

const tableRows = wrapper.find("tbody").findAll("tr");
const deleteButton = tableRows[0].get('[data-testid="deleteAction"]');

await deleteButton.trigger("click");

const dialogContent = wrapper.findComponent({ name: "renderHTML" });
const expectedDialogContents = [
"components.administration.externalToolsSection.dialog.content.header",
"components.administration.externalToolsSection.dialog.content.courses",
"components.administration.externalToolsSection.dialog.content.boardElements",
"components.administration.externalToolsSection.dialog.content.warning",
];
const dialogContents = wrapper.findAllComponents({
name: "renderHTML",
});

expect(dialogContent.props("html")).toEqual(
"components.administration.externalToolsSection.dialog.content.header"
expect(dialogContents.length).toBeGreaterThanOrEqual(
expectedDialogContents.length
);
for (const content of dialogContents) {
expect(expectedDialogContents).toContain(content.props().html);
}

expect(wrapper.vm.getItemName).toEqual("name");
expect(wrapper.vm.metadata).toEqual(schoolExternalToolMetadata);
Expand All @@ -484,6 +498,180 @@ describe("ExternalToolSection", () => {
});
});

const setupMediaBoardMetadataAndEnv = (
toolUsageMetadata: SchoolExternalToolMetadata,
enableMediaShelf: boolean
) => {
const schoolExternalToolMetadata =
schoolExternalToolMetadataFactory.build(toolUsageMetadata);

useSchoolExternalToolUsageMock.metadata = ref(schoolExternalToolMetadata);

const envs: Partial<ConfigResponse> = {
FEATURE_MEDIA_SHELF_ENABLED: enableMediaShelf,
};
const { wrapper } = getWrapper(
{
getSchoolExternalTools: [
schoolExternalToolFactory.build(),
schoolExternalToolFactory.build(),
],
},
envs
);

return {
wrapper,
schoolExternalToolMetadata,
};
};

const expectMediaBoardDialogIsShown = (deleteDialogWrapper: VueWrapper) => {
const dialogContents = deleteDialogWrapper.findAllComponents({
name: "renderHTML",
});

const mediaBoardDialogContentIndex = dialogContents.findIndex(
(content) =>
content.attributes()["data-testid"] ===
"delete-dialog-content-media-shelves"
);
expect(mediaBoardDialogContentIndex).toBeGreaterThan(0);

const mediaBoardDialogContent =
dialogContents[mediaBoardDialogContentIndex];
const dialogContentBeforeMediaBoard =
dialogContents[mediaBoardDialogContentIndex - 1];

expect(mediaBoardDialogContent.text()).toEqual(
"components.administration.externalToolsSection.dialog.content.mediaShelves"
);

expect(dialogContentBeforeMediaBoard.classes()).toContain("mb-0");
};

const expectMediaBoardDialogIsHidden = (
deleteDialogWrapper: VueWrapper
) => {
const dialogContents = deleteDialogWrapper.findAllComponents({
name: "renderHTML",
});

const mediaBoardDialogContentIndex = dialogContents.findIndex(
(content) =>
content.attributes()["data-testid"] ===
"delete-dialog-content-media-shelves"
);
expect(mediaBoardDialogContentIndex).toEqual(-1);

const dialogContentBeforeWarning =
dialogContents[dialogContents.length - 2];

expect(dialogContentBeforeWarning.classes()).not.toContain("mb-0");
};

describe("when metadata with media board > 0 is given", () => {
const setup = (enabledMediaShelf: boolean) => {
const metadataWithNonZeroMediaBoard: SchoolExternalToolMetadata = {
course: 3,
boardElement: 2,
mediaBoard: 1,
};
const { wrapper, schoolExternalToolMetadata } =
setupMediaBoardMetadataAndEnv(
metadataWithNonZeroMediaBoard,
enabledMediaShelf
);
return {
wrapper,
schoolExternalToolMetadata,
};
};

describe("when FEATURE_MEDIA_SHELF_ENABLED is true", () => {
it("should show tool usage count for media board", async () => {
const { wrapper, schoolExternalToolMetadata } = setup(true);

const tableRows = wrapper.find("tbody").findAll("tr");
const deleteButton = tableRows[0].get('[data-testid="deleteAction"]');

await deleteButton.trigger("click");

expectMediaBoardDialogIsShown(wrapper);

expect(wrapper.vm.getItemName).toEqual("name");
expect(wrapper.vm.metadata).toEqual(schoolExternalToolMetadata);
});
});

describe("when FEATURE_MEDIA_SHELF_ENABLED is false", () => {
it("should show tool usage count for media board", async () => {
const { wrapper, schoolExternalToolMetadata } = setup(false);

const tableRows = wrapper.find("tbody").findAll("tr");
const deleteButton = tableRows[0].get('[data-testid="deleteAction"]');

await deleteButton.trigger("click");

expectMediaBoardDialogIsShown(wrapper);

expect(wrapper.vm.getItemName).toEqual("name");
expect(wrapper.vm.metadata).toEqual(schoolExternalToolMetadata);
});
});
});

describe("when metadata with 0 media board is given", () => {
const setup = (enabledMediaShelf: boolean) => {
const metadataWithNonZeroMediaBoard: SchoolExternalToolMetadata = {
course: 3,
boardElement: 2,
mediaBoard: 0,
};
const { wrapper, schoolExternalToolMetadata } =
setupMediaBoardMetadataAndEnv(
metadataWithNonZeroMediaBoard,
enabledMediaShelf
);
return {
wrapper,
schoolExternalToolMetadata,
};
};

describe("when FEATURE_MEDIA_SHELF_ENABLED is true", () => {
it("should show tool usage count for media board", async () => {
const { wrapper, schoolExternalToolMetadata } = setup(true);

const tableRows = wrapper.find("tbody").findAll("tr");
const deleteButton = tableRows[0].get('[data-testid="deleteAction"]');

await deleteButton.trigger("click");

expectMediaBoardDialogIsShown(wrapper);

expect(wrapper.vm.getItemName).toEqual("name");
expect(wrapper.vm.metadata).toEqual(schoolExternalToolMetadata);
});
});

describe("when FEATURE_MEDIA_SHELF_ENABLED is false", () => {
it("should not show tool usage count for media board", async () => {
const { wrapper, schoolExternalToolMetadata } = setup(false);

const tableRows = wrapper.find("tbody").findAll("tr");
const deleteButton = tableRows[0].get('[data-testid="deleteAction"]');

await deleteButton.trigger("click");

expectMediaBoardDialogIsHidden(wrapper);

expect(wrapper.vm.getItemName).toEqual("name");
expect(wrapper.vm.metadata).toEqual(schoolExternalToolMetadata);
});
});
});

describe("when metadata is undefined", () => {
const setup = () => {
useSchoolExternalToolUsageMock.metadata = ref(undefined);
Expand Down

0 comments on commit 4ebb2c5

Please sign in to comment.