From 34d89774b13cb3a9ff5de6c6b01fb0d07bf68868 Mon Sep 17 00:00:00 2001
From: Aarni Halinen <aarni.halinen@gmail.com>
Date: Mon, 8 Mar 2021 21:11:49 +0200
Subject: [PATCH] Add fallback pages to events & signup

---
 src/pages/events/[id].tsx            | 6 ++++--
 src/pages/signup/[id].tsx            | 9 ++++++++-
 tests/testcafe/signupToEvent.test.ts | 8 +++++++-
 tests/testcafe/utils.ts              | 1 -
 4 files changed, 19 insertions(+), 5 deletions(-)

diff --git a/src/pages/events/[id].tsx b/src/pages/events/[id].tsx
index 7a9ba39..df50dc9 100644
--- a/src/pages/events/[id].tsx
+++ b/src/pages/events/[id].tsx
@@ -16,9 +16,11 @@ interface InitialProps {
 const EventPage: NextPage<InitialProps> = ({ initialEvent }) => {
   const router = useRouter();
   const { id } = router.query;
+
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   const { data, error } = useFetchEvents({ initialData: initialEvent, id: id as string });
-  if (!data) return <LoadingView />;
+
+  if (!data || router.isFallback) return <LoadingView />;
 
   return (
     <>
@@ -43,7 +45,7 @@ export const getStaticPaths: GetStaticPaths = async () => {
   ));
   return {
     paths,
-    fallback: false,
+    fallback: true,
   };
 };
 
diff --git a/src/pages/signup/[id].tsx b/src/pages/signup/[id].tsx
index 7972e19..7aa07b6 100644
--- a/src/pages/signup/[id].tsx
+++ b/src/pages/signup/[id].tsx
@@ -1,10 +1,12 @@
 import React, { useState } from "react";
 import { NextPage, GetStaticProps, GetStaticPaths } from "next";
 import Head from "next/head";
+import { useRouter } from "next/router";
 import { getForm, SignupForm, getForms } from "@models/SignupForm";
 import { createSignup, Signup } from "@models/Signup";
 import SignUpPageView from "@views/SignUpPage/SignUpPageView";
 import PageWrapper from "@views/common/PageWrapper";
+import LoadingView from "@views/common/LoadingView";
 import noop from "@utils/noop";
 
 type InitialProps = {
@@ -12,8 +14,13 @@ type InitialProps = {
 };
 
 const SignUpPage: NextPage<InitialProps> = ({ form }) => {
+  const router = useRouter();
   const [statusMessage, setStatus] = useState(null);
 
+  if (router.isFallback) {
+    return <LoadingView />;
+  }
+
   const onSubmit = async (data) => {
     const payload: Signup = {
       signupForm_id: form.id,
@@ -58,7 +65,7 @@ export const getStaticPaths: GetStaticPaths = async () => {
   ));
   return {
     paths,
-    fallback: false,
+    fallback: true,
   };
 };
 
diff --git a/tests/testcafe/signupToEvent.test.ts b/tests/testcafe/signupToEvent.test.ts
index 3ed1947..6b46274 100644
--- a/tests/testcafe/signupToEvent.test.ts
+++ b/tests/testcafe/signupToEvent.test.ts
@@ -17,7 +17,13 @@ fixture`Event signup`.page(getSiteRoot())
     await deleteForm(ctx.formId, token);
   });
 
-test.skip("User signups to event from front page", async (t) => {
+test("User signups to event from front page", async (t) => {
+  // Force refresh, so that ISR updates front page events and creates the pages created in before()
+  await t.wait(15000);
+  await t.navigateTo("/");
+  await t.wait(5000);
+  await t.navigateTo("/");
+
   const CardSelector = Selector("[data-e2e=\"event-card\"]").withText("title_fi").nth(0);
 
   await t
diff --git a/tests/testcafe/utils.ts b/tests/testcafe/utils.ts
index a64411f..140341b 100644
--- a/tests/testcafe/utils.ts
+++ b/tests/testcafe/utils.ts
@@ -156,4 +156,3 @@ export const generateTestEvent = async (formIds = [], jwt: string) => (
 );
 
 export const sleep = async (ms: number) => new Promise((resolve) => setTimeout(resolve, ms));
-export const reloadPage = (t?: TestController) => ClientFunction(() => window.location.reload(), { boundTestRun: t });