Add fallback pages to events & signup

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,
   };
 };
 

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,
   };
 };
 

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

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 });