Repository: Rezact/Rezact
Pull request #95 (2024-01-16 18:13:36)

Fix title bug when defining routes "out of order"


Patch:
diff --git a/package.json b/package.json
index 5622632..8b777f3 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@rezact/rezact",
-  "version": "1.0.15-beta.43",
+  "version": "1.0.15-beta.44",
   "type": "module",
   "description": "Intuitive Reactivity, Simplified State. Embrace a modern UI framework that encourages direct data mutations, offers module-level reactivity, and simplifies component design. With Rezact, you get the power of reactivity without the boilerplate. Dive into a seamless development experience tailored for today's web.",
   "main": "index.cjs",
diff --git a/src/components/appRouter.ts b/src/components/appRouter.ts
index bf7f930..df3afaf 100644
--- a/src/components/appRouter.ts
+++ b/src/components/appRouter.ts
@@ -33,14 +33,20 @@ router.addRoute(
   "/nested",
   () => import("src/examples/NestedRezact/NestedChildren")
 );
-router.addRoute(
-  "/hello-world",
-  () => import("src/examples/HelloWorldRezact/HelloWorld")
-);
 
 router.addRoute(
   "/hello-world/multiple",
-  () => import("src/examples/HelloWorldMultipleRezact/HelloWorldMultiple")
+  () => import("src/examples/HelloWorldMultipleRezact/HelloWorldMultiple"),
+  {
+    title: "Hello World Multiple",
+  }
+);
+router.addRoute(
+  "/hello-world",
+  () => import("src/examples/HelloWorldRezact/HelloWorld"),
+  {
+    title: "Hello World",
+  }
 );
 
 router.addRoute(
@@ -133,6 +139,7 @@ const routes = [
   },
   {
     path: "/hello-world/multiple/again",
+    title: "Hello World Multiple Again",
     component: () =>
       import("src/examples/SimpleStringListState/SimpleStringList"),
   },
diff --git a/src/lib/rezact/router.ts b/src/lib/rezact/router.ts
index 09b977d..c98fabe 100644
--- a/src/lib/rezact/router.ts
+++ b/src/lib/rezact/router.ts
@@ -219,10 +219,15 @@ export class TrieRouter {
     config.forEach((route) => {
       const currentPath = `${parentPath}${route.path}`;
       if (route.component)
-        this.addRoute(currentPath, route.component, nestedRoot, {
-          title: route.title,
-          meta: route.meta,
-        });
+        this.addRoute(
+          currentPath,
+          route.component,
+          {
+            title: route.title,
+            meta: route.meta,
+          },
+          nestedRoot
+        );
 
       if (route.children && route.children.length > 0) {
         this.addRoutesFromConfig(route.children, currentPath, false);
@@ -230,7 +235,7 @@ export class TrieRouter {
     });
   }
 
-  addRoute(path, callback, nestedRoot = true, opts: any = {}) {
+  addRoute(path, callback, opts: any = {}, nestedRoot = true) {
     const parts = path.split("/").filter(Boolean);
     let firstPartRootSet = false;
     let currentNode = this.root;
@@ -274,6 +279,8 @@ export class TrieRouter {
 
     currentNode.handlers.GET = callback;
     currentNode.nestedRoot = currentNode.nestedRoot || nestedRoot;
+    currentNode.title = opts.title;
+    currentNode.meta = opts.meta;
   }
 
   getNextRoute(path, paramID = null, paramVal = null): routeIF {


Test patch:
diff --git a/src/router.test.js b/src/router.test.js
index bb4f80e..0a70018 100644
--- a/src/router.test.js
+++ b/src/router.test.js
@@ -922,6 +922,46 @@ describe("Router Tests Suite", () => {
     );
     expect(beforeEachGuardTest.count).toBe(6);
   });
+
+  it("1. Title bug when defining routes 'out of order'", async () => {
+    const links = await screen.findAllByRole("link", {
+      name: /Hello World/i,
+    });
+
+    expect(links[0].href).toBe("http://localhost:3000/hello-world");
+    await user.click(links[0]);
+    // await delay(100);
+    expect(location.href).toBe("http://localhost:3000/hello-world");
+    expect(document.title).toBe("Hello World");
+  });
+
+  it("2. Title bug when defining routes 'out of order'", async () => {
+    const links = await screen.findAllByRole("link", {
+      name: /Nested Router Bug Hello World Test 1/i,
+    });
+
+    expect(links[0].href).toBe("http://localhost:3000/hello-world/multiple");
+    await user.click(links[0]);
+    // await delay(100);
+    expect(location.href).toBe("http://localhost:3000/hello-world/multiple");
+    expect(document.title).toBe("Hello World Multiple");
+  });
+
+  it("3. Title bug when defining routes 'out of order'", async () => {
+    const links = await screen.findAllByRole("link", {
+      name: /Nested Router Bug Hello World Test 2/i,
+    });
+
+    expect(links[0].href).toBe(
+      "http://localhost:3000/hello-world/multiple/again"
+    );
+    await user.click(links[0]);
+    // await delay(100);
+    expect(location.href).toBe(
+      "http://localhost:3000/hello-world/multiple/again"
+    );
+    expect(document.title).toBe("Hello World Multiple Again");
+  });
 });
 
 function delay(n) {