Upgrade latest Remix and enable all future flags

benvinegar · Dec 19, 2024 · f079c52 · f079c52
1 parent d1485b1
commit f079c52
Show file tree

Hide file tree

Showing 22 changed files with 315 additions and 237 deletions.
diff --git a/app/__tests__/root.test.tsx b/app/__tests__/root.test.tsx
@@ -1,5 +1,4 @@
 // @vitest-environment jsdom
-import { json } from "@remix-run/node";
 import { beforeAll, afterEach, describe, expect, test, vitest } from "vitest";
 import "vitest-dom/extend-expect";
 import { render, waitFor, screen, cleanup } from "@testing-library/react";
@@ -17,11 +16,11 @@ describe("Root", () => {
 
     test("renders without crashing", async () => {
         function loader() {
-            return json({
+            return {
                 version: "ABC123",
                 origin: "http://example.com",
                 url: "http://example.com/path",
-            });
+            };
         }
 
         const RemixStub = createRemixStub([
@@ -75,11 +74,11 @@ describe("Layout", () => {
 
     test("renders with provided route data", async () => {
         function loader() {
-            return json({
+            return {
                 version: "v1.2.3",
                 origin: "test.counterscale.dev",
                 url: "https://test.counterscale.dev/",
-            });
+            };
         }
 
         const RemixStub = createRemixStub([

diff --git a/app/root.tsx b/app/root.tsx
@@ -1,10 +1,6 @@
 /// <reference types="vite/client" />
 import styles from "./globals.css?url";
-import {
-    json,
-    LoaderFunctionArgs,
-    type LinksFunction,
-} from "@remix-run/cloudflare";
+import { LoaderFunctionArgs, type LinksFunction } from "@remix-run/cloudflare";
 
 import {
     Links,
@@ -19,11 +15,11 @@ export const links: LinksFunction = () => [{ rel: "stylesheet", href: styles }];
 
 export const loader = ({ context, request }: LoaderFunctionArgs) => {
     const url = new URL(request.url);
-    return json({
+    return {
         version: context.cloudflare?.env?.CF_PAGES_COMMIT_SHA,
         origin: url.origin,
         url: request.url,
-    });
+    };
 };
 
 export const Layout = ({ children = [] }: { children: React.ReactNode }) => {

diff --git a/app/routes.ts b/app/routes.ts
@@ -0,0 +1,3 @@
+import { flatRoutes } from "@remix-run/fs-routes";
+
+export default flatRoutes();
diff --git a/app/routes/__tests__/dashboard.test.tsx b/app/routes/__tests__/dashboard.test.tsx
@@ -1,5 +1,5 @@
 // @vitest-environment jsdom
-import { json, LoaderFunctionArgs } from "@remix-run/node";
+import { LoaderFunctionArgs } from "@remix-run/node";
 import {
     vi,
     test,
@@ -97,19 +97,24 @@ describe("Dashboard route", () => {
                 }),
             );
 
-            const response = await loader({
-                ...getDefaultContext(),
-                // @ts-expect-error we don't need to provide all the properties of the request object
-                request: {
-                    url: "http://localhost:3000/dashboard", // no site query param
-                },
-            });
+            try {
+                await loader({
+                    ...getDefaultContext(),
+                    // @ts-expect-error we don't need to provide all the properties of the request object
+                    request: {
+                        url: "http://localhost:3000/dashboard", // no site query param
+                    },
+                });
+            } catch (error) {
+                expect(error).toBeInstanceOf(Response);
+                const response = error as Response;
 
-            // expect redirect
-            expect(response.status).toBe(302);
-            expect(response.headers.get("Location")).toBe(
-                "http://localhost:3000/dashboard?site=test-siteid",
-            );
+                // expect redirect
+                expect(response.status).toBe(302);
+                expect(response.headers.get("Location")).toBe(
+                    "http://localhost:3000/dashboard?site=test-siteid",
+                );
+            }
         });
 
         test("redirects to ?site= if no siteId is provided via query string / no site data", async () => {
@@ -120,19 +125,24 @@ describe("Dashboard route", () => {
                 }),
             );
 
-            const response = await loader({
-                ...getDefaultContext(),
-                // @ts-expect-error we don't need to provide all the properties of the request object
-                request: {
-                    url: "http://localhost:3000/dashboard", // no site query param
-                },
-            });
+            try {
+                await loader({
+                    ...getDefaultContext(),
+                    // @ts-expect-error we don't need to provide all the properties of the request object
+                    request: {
+                        url: "http://localhost:3000/dashboard", // no site query param
+                    },
+                });
+            } catch (error) {
+                expect(error).toBeInstanceOf(Response);
+                const response = error as Response;
 
-            // expect redirect
-            expect(response.status).toBe(302);
-            expect(response.headers.get("Location")).toBe(
-                "http://localhost:3000/dashboard?site=",
-            );
+                // expect redirect
+                expect(response.status).toBe(302);
+                expect(response.headers.get("Location")).toBe(
+                    "http://localhost:3000/dashboard?site=",
+                );
+            }
         });
 
         test("assembles data returned from CF API", async () => {
@@ -153,7 +163,7 @@ describe("Dashboard route", () => {
                 },
             });
 
-            const json = await response.json();
+            const json = await response;
 
             expect(json).toEqual({
                 filters: {},
@@ -179,7 +189,7 @@ describe("Dashboard route", () => {
                 },
             });
 
-            const json = await response.json();
+            const json = await response;
 
             expect(json).toEqual({
                 filters: {},
@@ -193,11 +203,11 @@ describe("Dashboard route", () => {
 
     test("renders when no data", async () => {
         function loader() {
-            return json({
+            return {
                 siteId: "@unknown",
                 sites: [],
                 intervalType: "day",
-            });
+            };
         }
 
         const RemixStub = createRemixStub([
@@ -209,46 +219,46 @@ describe("Dashboard route", () => {
                     {
                         path: "/resources/timeseries",
                         loader: () => {
-                            return json({ chartData: [] });
+                            return { chartData: [] };
                         },
                     },
                     {
                         path: "/resources/stats",
                         loader: () => {
-                            return json({
+                            return {
                                 views: 0,
                                 visitors: 0,
-                            });
+                            };
                         },
                     },
                     {
                         path: "/resources/paths",
                         loader: () => {
-                            return json({ countsByProperty: [] });
+                            return { countsByProperty: [] };
                         },
                     },
                     {
                         path: "/resources/referrer",
                         loader: () => {
-                            return json({ countsByProperty: [] });
+                            return { countsByProperty: [] };
                         },
                     },
                     {
                         path: "/resources/browser",
                         loader: () => {
-                            return json({ countsByProperty: [] });
+                            return { countsByProperty: [] };
                         },
                     },
                     {
                         path: "/resources/country",
                         loader: () => {
-                            return json({ countsByProperty: [] });
+                            return { countsByProperty: [] };
                         },
                     },
                     {
                         path: "/resources/device",
                         loader: () => {
-                            return json({ countsByProperty: [] });
+                            return { countsByProperty: [] };
                         },
                     },
                 ],
@@ -288,7 +298,7 @@ describe("Dashboard route", () => {
 
     test("renders with valid data", async () => {
         function loader() {
-            return json({ ...defaultMockedLoaderJson });
+            return { ...defaultMockedLoaderJson };
         }
 
         const RemixStub = createRemixStub([
@@ -300,76 +310,76 @@ describe("Dashboard route", () => {
                     {
                         path: "/resources/stats",
                         loader: () => {
-                            return json({
+                            return {
                                 views: 2133,
                                 visitors: 33,
-                            });
+                            };
                         },
                     },
                     {
                         path: "/resources/timeseries",
                         loader: () => {
-                            return json({});
+                            return {};
                         },
                     },
                     {
                         path: "/resources/paths",
                         loader: () => {
-                            return json({
+                            return {
                                 countsByProperty: [
                                     ["/", 100],
                                     ["/about", 80],
                                     ["/contact", 60],
                                 ],
-                            });
+                            };
                         },
                     },
                     {
                         path: "/resources/referrer",
                         loader: () => {
-                            return json({
+                            return {
                                 countsByProperty: [
                                     ["google.com", 100],
                                     ["facebook.com", 80],
                                     ["twitter.com", 60],
                                 ],
-                            });
+                            };
                         },
                     },
                     {
                         path: "/resources/browser",
                         loader: () => {
-                            return json({
+                            return {
                                 countsByProperty: [
                                     ["Chrome", 100],
                                     ["Safari", 80],
                                     ["Firefox", 60],
                                 ],
-                            });
+                            };
                         },
                     },
                     {
                         path: "/resources/country",
                         loader: () => {
-                            return json({
+                            return {
                                 countsByProperty: [
                                     ["United States", 100],
                                     ["Canada", 80],
                                     ["United Kingdom", 60],
                                 ],
-                            });
+                            };
                         },
                     },
                     {
                         path: "/resources/device",
                         loader: () => {
-                            return json({
+                            return {
                                 countsByProperty: [
                                     ["Desktop", 100],
                                     ["Mobile", 80],
                                     ["Tablet", 60],
                                 ],
-                            });
+                            };
                         },
                     },
                 ],

diff --git a/app/routes/__tests__/resources.browser.test.tsx b/app/routes/__tests__/resources.browser.test.tsx
@@ -43,10 +43,7 @@ describe("Resources/Browser route", () => {
                 },
             });
 
-            // expect redirect
-            expect(response.status).toBe(200);
-
-            const json = await response.json();
+            const json = await response;
             expect(json).toEqual({
                 countsByProperty: [
                     ["Chrome", 5],

diff --git a/app/routes/__tests__/resources.country.test.tsx b/app/routes/__tests__/resources.country.test.tsx
@@ -43,10 +43,7 @@ describe("Resources/Country route", () => {
                 },
             });
 
-            // expect redirect
-            expect(response.status).toBe(200);
-
-            const json = await response.json();
+            const json = await response;
             expect(json).toEqual({
                 countsByProperty: [
                     [["CA", "Canada"], 5],

diff --git a/app/routes/__tests__/resources.device.test.tsx b/app/routes/__tests__/resources.device.test.tsx
@@ -43,10 +43,7 @@ describe("Resources/Device route", () => {
                 },
             });
 
-            // expect redirect
-            expect(response.status).toBe(200);
-
-            const json = await response.json();
+            const json = await response;
             expect(json).toEqual({
                 countsByProperty: [
                     ["Android", 5],

diff --git a/app/routes/__tests__/resources.paths.test.tsx b/app/routes/__tests__/resources.paths.test.tsx
@@ -61,10 +61,9 @@ describe("Resources/Paths route", () => {
             });
 
             // expect redirect
-            expect(response.status).toBe(200);
             expect(fetch).toHaveBeenCalledTimes(2);
 
-            const json = await response.json();
+            const json = await response;
 
             expect(json).toEqual({
                 countsByProperty: [

diff --git a/app/routes/__tests__/resources.referrer.test.tsx b/app/routes/__tests__/resources.referrer.test.tsx
@@ -62,10 +62,9 @@ describe("Resources/Referrer route", () => {
             });
 
             // expect redirect
-            expect(response.status).toBe(200);
             expect(fetch).toHaveBeenCalledTimes(2);
 
-            const json = await response.json();
+            const json = await response;
             expect(json).toEqual({
                 countsByProperty: [
                     ["/", 1, 6],
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		import { flatRoutes } from "@remix-run/fs-routes";

		export default flatRoutes();
Check warning on line 3 in app/routes.ts View check run for this annotation Codecov / codecov/patch app/routes.ts#L3 `Added line #L3 was not covered by tests`