Skip to content

Commit

Permalink
added and fixed some tests of Story Element
Browse files Browse the repository at this point in the history
  • Loading branch information
Lizardguard committed Feb 7, 2024
1 parent 0ca086d commit 8079ec8
Show file tree
Hide file tree
Showing 2 changed files with 37 additions and 17 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -71,6 +71,7 @@ export default function StoryElement({ className }: AdLerUIComponent<{}>) {
let complexStory = false;
// We only use the first element of the array. If we have 2 stories, we decide based on the picked story. ~FK
let type = viewModel.type.Value[0];

// 1
if (
type === StoryElementType.Intro ||
Expand Down Expand Up @@ -162,7 +163,7 @@ export default function StoryElement({ className }: AdLerUIComponent<{}>) {
<>
{!viewModel.showOnlyIntro.Value &&
!viewModel.showOnlyOutro.Value && (
<div className="row-span-4 flex flex-col lg:flex-row w-full h-full justify-center items-center gap-4 pb-16 lg:pb-8">
<div className="flex flex-col items-center justify-center w-full h-full row-span-4 gap-4 pb-16 lg:flex-row lg:pb-8">
<StyledButton
shape="freefloatcenter"
onClick={controller.onIntroButtonClicked}
Expand All @@ -182,7 +183,7 @@ export default function StoryElement({ className }: AdLerUIComponent<{}>) {

{(viewModel.showOnlyIntro.Value ||
viewModel.showOnlyOutro.Value) && (
<div className="row-span-4 grid items-center justify-center w-full h-full grid-rows-4">
<div className="grid items-center justify-center w-full h-full grid-rows-4 row-span-4">
{createBasicLayoutWithBackButton(
contentTexts,
pageId,
Expand Down Expand Up @@ -210,7 +211,7 @@ export default function StoryElement({ className }: AdLerUIComponent<{}>) {
{contentTexts[pageId].toString()}
</div>
<div className="flex w-[90vw] lg:max-w-5xl xl:max-w-6xl justify-end">
<div className="grid w-16 lg:w-32 grid-cols-2 justify-items-end">
<div className="grid w-16 grid-cols-2 lg:w-32 justify-items-end">
<div>
{" "}
{pageId > 0 && (
Expand Down Expand Up @@ -256,7 +257,7 @@ export default function StoryElement({ className }: AdLerUIComponent<{}>) {
>
{backbuttonText}
</StyledButton>
<div className="grid w-16 lg:w-32 grid-cols-2 justify-items-end">
<div className="grid w-16 grid-cols-2 lg:w-32 justify-items-end">
<div>
{" "}
{pageId > 0 && (
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,6 @@ import StoryElementController from "../../../../../Core/Presentation/React/Learn
import StoryElementViewModel from "../../../../../Core/Presentation/React/LearningSpaceDisplay/StoryElement/StoryElementViewModel";
import useBuilderMock from "../../ReactRelated/CustomHooks/useBuilder/useBuilderMock";
import { StoryElementType } from "../../../../../Core/Domain/Types/StoryElementType";
import { use } from "i18next";

let viewModel = new StoryElementViewModel();
viewModel.isOpen.Value = true;
Expand All @@ -20,6 +19,7 @@ describe("StoryElement", () => {
viewModel.pageId.Value = 0;
viewModel.outroUnlocked.Value = false;
viewModel.outroJustNowUnlocked.Value = false;
viewModel.numberOfStories.Value = 0;
});

test("doesn't render without controller", () => {
Expand All @@ -42,43 +42,62 @@ describe("StoryElement", () => {
const componentUnderTest = render(<StoryElement />);
expect(componentUnderTest.container.childElementCount).toBe(0);
});
test.skip("should close when x Button is clicked", () => {
test("should close when x Button is clicked", () => {
viewModel.isOpen.Value = true;
viewModel.type.Value = StoryElementType.Intro;
viewModel.type.Value = [StoryElementType.Intro];

useBuilderMock([viewModel, fakeController]);

const componentUnderTest = render(<StoryElement />);
const xButton = componentUnderTest.getByRole("button", { name: "X" });
fireEvent.click(xButton);
expect(componentUnderTest.container.firstChild).toBeNull();
expect(fakeController.closePanel).toHaveBeenCalled();
});

test.skip("should render its content (Case 1: Intro)", () => {
viewModel.type.Value = StoryElementType.Intro;
test("should render its content (Case 1: Intro)", () => {
viewModel.type.Value = [StoryElementType.Intro];
useBuilderMock([viewModel, fakeController]);

const componentUnderTest = render(<StoryElement />);
expect(componentUnderTest.container.childElementCount).toBe(1);
});
test.skip("should render its content (Case 1: Locked IntroOutro)", () => {
viewModel.type.Value = StoryElementType.IntroOutro;
test("should render its content (Case 1: Split IntroOutro, Intro selected)", () => {
viewModel.type.Value = [StoryElementType.Intro, StoryElementType.Outro];
viewModel.numberOfStories.Value = 2;
viewModel.pickedStory.Value = StoryElementType.Intro;
useBuilderMock([viewModel, fakeController]);

const componentUnderTest = render(<StoryElement />);
expect(componentUnderTest.container.childElementCount).toBe(1);
});
test("should render its content (Case 1: Locked IntroOutro)", () => {
viewModel.type.Value = [StoryElementType.IntroOutro];
viewModel.outroUnlocked.Value = false;
useBuilderMock([viewModel, fakeController]);

const componentUnderTest = render(<StoryElement />);
expect(componentUnderTest.container.childElementCount).toBe(1);
});
test.skip("should render its content (Case 2: Outro)", () => {
viewModel.type.Value = StoryElementType.Outro;
test("should render its content (Case 2: Unlocked Outro)", () => {
viewModel.type.Value = [StoryElementType.Outro];
viewModel.outroUnlocked.Value = true;
useBuilderMock([viewModel, fakeController]);

const componentUnderTest = render(<StoryElement />);
expect(componentUnderTest.container.childElementCount).toBe(1);
});
test.skip("should render its content (Case 2: Just Unlocked Outro)", () => {
viewModel.type.Value = StoryElementType.IntroOutro;
test("should render its content (Case 2: Split IntroOutro, unlocked Outro selected)", () => {
viewModel.type.Value = [StoryElementType.Intro, StoryElementType.Outro];
viewModel.numberOfStories.Value = 2;
viewModel.pickedStory.Value = StoryElementType.Outro;
viewModel.outroUnlocked.Value = true;
useBuilderMock([viewModel, fakeController]);

const componentUnderTest = render(<StoryElement />);
expect(componentUnderTest.container.childElementCount).toBe(1);
});
test("should render its content (Case 2: Just Unlocked Outro)", () => {
viewModel.type.Value = [StoryElementType.IntroOutro];
viewModel.outroUnlocked.Value = true;
viewModel.outroJustNowUnlocked.Value = true;
useBuilderMock([viewModel, fakeController]);
Expand Down Expand Up @@ -125,7 +144,7 @@ describe("StoryElement", () => {
expect(componentUnderTest.container.childElementCount).toBe(1);
});
test("should not render if no case is matched (type = null)", () => {
viewModel.type.Value = StoryElementType.None;
viewModel.type.Value = [StoryElementType.None];
useBuilderMock([viewModel, fakeController]);
const { container } = render(<StoryElement />);
expect(container.firstChild).toBeNull();
Expand Down

0 comments on commit 8079ec8

Please sign in to comment.