HomePage tests

client/src/components/screens/HomePage/HomePage.jsx

@@ -6,7 +6,7 @@ import DelayedButton from "../../util/DelayedButton";
 import GameCreationForm from "../../util/GameCreationForm";
 import styles from "./HomePage.module.css";
 
-const Rejoin = forwardRef((_, ref) => (
+export const Rejoin = forwardRef((_, ref) => (
   <div className={styles.rejoinSection} ref={ref}>
     <span className={styles.rejoinLabel}>
       Looks like you were in a game before that you didn&apos;t finish!

client/src/tests/HomePage.test.js

@@ -0,0 +1,42 @@
+import React from "react";
+import { mount, shallow } from "enzyme";
+import HomePage, { Rejoin } from "../components/screens/HomePage/HomePage";
+
+jest.mock("../domain/gameStore");
+jest.mock("../domain/localStorageMethods");
+
+import { dispatch } from "../domain/gameStore";
+
+describe("HomePage", () => {
+  it("renders", () => {
+    const rendered = shallow(<HomePage />);
+    expect(rendered).toMatchSnapshot();
+  });
+
+  it("goes to lobby after game created", () => {
+    const rendered = shallow(<HomePage />);
+    rendered.find("GameCreationForm").first().prop("afterCreate")(
+      "test-game-id"
+    );
+    expect(dispatch.goToLobby).toHaveBeenCalledWith("test-game-id");
+  });
+
+  describe("Rejoin", () => {
+    it("renders", () => {
+      const rendered = shallow(<Rejoin />);
+      expect(rendered).toMatchSnapshot();
+    });
+
+    it("handles click", () => {
+      const rendered = mount(<Rejoin />);
+      rendered.find("button").first().simulate("click");
+      expect(rendered).toMatchSnapshot();
+    });
+
+    it("rejoins when button ends", () => {
+      const rendered = shallow(<Rejoin />);
+      rendered.find("DelayedButton").first().prop("onEnd")();
+      expect(dispatch.rejoinGame).toHaveBeenCalled();
+    });
+  });
+});

client/src/tests/__snapshots__/HomePage.test.js.snap

@@ -0,0 +1,75 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`HomePage Rejoin handles click 1`] = `
+<ForwardRef>
+  <div
+    className="rejoinSection"
+  >
+    <span
+      className="rejoinLabel"
+    >
+      Looks like you were in a game before that you didn't finish!
+    </span>
+    <DelayedButton
+      countDownFormatter={[Function]}
+      onEnd={[Function]}
+    >
+      <CountdownButton
+        formatter={[Function]}
+        onCancelled={[Function]}
+        onEnd={[Function]}
+        seconds={3}
+      >
+        <button
+          onClick={[Function]}
+          type="button"
+        >
+          Rejoining in 3s...
+        </button>
+      </CountdownButton>
+    </DelayedButton>
+  </div>
+</ForwardRef>
+`;
+
+exports[`HomePage Rejoin renders 1`] = `
+<div
+  className="rejoinSection"
+>
+  <span
+    className="rejoinLabel"
+  >
+    Looks like you were in a game before that you didn't finish!
+  </span>
+  <DelayedButton
+    countDownFormatter={[Function]}
+    onEnd={[Function]}
+  >
+    Rejoin Game?
+  </DelayedButton>
+</div>
+`;
+
+exports[`HomePage renders 1`] = `
+<div
+  className="page"
+>
+  <CSSTransition
+    classNames="fade"
+    in={false}
+    mountOnEnter={true}
+    nodeRef={
+      Object {
+        "current": null,
+      }
+    }
+    timeout={500}
+    unmountOnExit={true}
+  >
+    <ForwardRef />
+  </CSSTransition>
+  <GameCreationForm
+    afterCreate={[Function]}
+  />
+</div>
+`;