Add tests for EffectsOverlay-test.tsx

test/components/views/elements/EffectsOverlay-test.tsx

@@ -0,0 +1,49 @@
+/*
+ * Copyright 2024 New Vector Ltd.
+ *
+ * SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
+ * Please see LICENSE files in the repository root for full details.
+ *
+ */
+
+import React from "react";
+import { render, waitFor } from "@testing-library/react";
+
+import dis from "../../../../src/dispatcher/dispatcher";
+import EffectsOverlay from "../../../../src/components/views/elements/EffectsOverlay.tsx";
+
+describe("<EffectsOverlay/>", () => {
+    let isStarted: boolean;
+    beforeEach(() => {
+        isStarted = false;
+        jest.mock("../../../../src/effects/confetti/index.ts", () => {
+            return class Confetti {
+                start = () => {
+                    isStarted = true;
+                };
+                stop = jest.fn();
+            };
+        });
+    });
+
+    afterEach(() => jest.useRealTimers());
+
+    it("should render", () => {
+        const { asFragment } = render(<EffectsOverlay roomWidth={100} />);
+        expect(asFragment()).toMatchSnapshot();
+    });
+
+    it("should start the confetti effect", async () => {
+        render(<EffectsOverlay roomWidth={100} />);
+        dis.dispatch({ action: "effects.confetti" });
+        await waitFor(() => expect(isStarted).toBe(true));
+    });
+
+    it("should not start the confetti effect when the event is outdated", async () => {
+        jest.useFakeTimers().setSystemTime(new Date("2024-01-01"));
+
+        render(<EffectsOverlay roomWidth={100} />);
+        dis.dispatch({ action: "effects.confetti", event: { getTs: () => 0 } });
+        await waitFor(() => expect(isStarted).toBe(false));
+    });
+});

test/components/views/elements/__snapshots__/EffectsOverlay-test.tsx.snap

@@ -0,0 +1,12 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<EffectsOverlay/> should render 1`] = `
+<DocumentFragment>
+  <canvas
+    aria-hidden="true"
+    height="768"
+    style="display: block; z-index: 999999; pointer-events: none; position: fixed; top: 0px; right: 0px;"
+    width="100"
+  />
+</DocumentFragment>
+`;