one/dist/cjs/useMatches.test.cjs

One is a new React Framework that makes Vite serve both native and web.

var import_vitest = require("vitest"),
  import_useMatches = require("./useMatches.cjs");
(0, import_vitest.describe)("useMatches", () => {
  (0, import_vitest.describe)("setClientMatches", () => {
    (0, import_vitest.it)("should update client matches without errors", () => {
      const matches = [{
        routeId: "/_layout",
        pathname: "/",
        params: {},
        loaderData: {
          title: "Root"
        }
      }, {
        routeId: "/page",
        pathname: "/page",
        params: {},
        loaderData: {
          content: "Page content"
        }
      }];
      (0, import_vitest.expect)(() => (0, import_useMatches.setClientMatches)(matches)).not.toThrow();
    }), (0, import_vitest.it)("should accept empty matches array", () => {
      (0, import_vitest.expect)(() => (0, import_useMatches.setClientMatches)([])).not.toThrow();
    });
  }), (0, import_vitest.describe)("type safety", () => {
    (0, import_vitest.it)("should have correct RouteMatch type", () => {
      const match = {
        routeId: "test",
        pathname: "/test",
        params: {
          id: "123"
        },
        loaderData: {
          foo: "bar"
        }
      };
      (0, import_vitest.expect)(match.routeId).toBe("test"), (0, import_vitest.expect)(match.pathname).toBe("/test"), (0, import_vitest.expect)(match.params.id).toBe("123"), (0, import_vitest.expect)(match.loaderData).toEqual({
        foo: "bar"
      });
    }), (0, import_vitest.it)("should allow string[] params", () => {
      (0, import_vitest.expect)({
        routeId: "test",
        pathname: "/test",
        params: {
          slugs: ["a", "b", "c"]
        },
        loaderData: null
      }.params.slugs).toEqual(["a", "b", "c"]);
    }), (0, import_vitest.it)("should allow undefined loaderData", () => {
      (0, import_vitest.expect)({
        routeId: "test",
        pathname: "/test",
        params: {},
        loaderData: void 0
      }.loaderData).toBeUndefined();
    });
  });
});
(0, import_vitest.describe)("RouteMatch ordering", () => {
  (0, import_vitest.it)("matches should be ordered parent to child (root layout first)", () => {
    const matches = [{
      routeId: "/_layout",
      pathname: "/",
      params: {},
      loaderData: {
        level: "root"
      }
    }, {
      routeId: "/docs/_layout",
      pathname: "/docs",
      params: {},
      loaderData: {
        level: "docs"
      }
    }, {
      routeId: "/docs/intro",
      pathname: "/docs/intro",
      params: {},
      loaderData: {
        level: "page"
      }
    }];
    (0, import_vitest.expect)(matches[0].routeId).toBe("/_layout"), (0, import_vitest.expect)(matches[0].loaderData.level).toBe("root"), (0, import_vitest.expect)(matches[1].routeId).toBe("/docs/_layout"), (0, import_vitest.expect)(matches[1].loaderData.level).toBe("docs"), (0, import_vitest.expect)(matches[2].routeId).toBe("/docs/intro"), (0, import_vitest.expect)(matches[2].loaderData.level).toBe("page");
  }), (0, import_vitest.it)("last match should be the current page", () => {
    const matches = [{
        routeId: "/_layout",
        pathname: "/",
        params: {},
        loaderData: {}
      }, {
        routeId: "/page",
        pathname: "/page",
        params: {
          id: "123"
        },
        loaderData: {
          title: "Page"
        }
      }],
      pageMatch = matches[matches.length - 1];
    (0, import_vitest.expect)(pageMatch.routeId).toBe("/page"), (0, import_vitest.expect)(pageMatch.loaderData.title).toBe("Page");
  });
});
(0, import_vitest.describe)("setClientMatches reactivity", () => {
  (0, import_vitest.it)("should notify listeners when matches change", () => {
    let notifyCount = 0;
    const listener = () => {
        notifyCount++;
      },
      matches1 = [{
        routeId: "/page1",
        pathname: "/page1",
        params: {},
        loaderData: {}
      }],
      matches2 = [{
        routeId: "/page2",
        pathname: "/page2",
        params: {},
        loaderData: {}
      }];
    (0, import_useMatches.setClientMatches)(matches1), (0, import_useMatches.setClientMatches)(matches2), (0, import_vitest.expect)(notifyCount).toBe(0);
  }), (0, import_vitest.it)("should handle multiple sequential updates", () => {
    const matches1 = [{
        routeId: "/a",
        pathname: "/a",
        params: {},
        loaderData: {
          n: 1
        }
      }],
      matches2 = [{
        routeId: "/b",
        pathname: "/b",
        params: {},
        loaderData: {
          n: 2
        }
      }],
      matches3 = [{
        routeId: "/c",
        pathname: "/c",
        params: {},
        loaderData: {
          n: 3
        }
      }];
    (0, import_vitest.expect)(() => {
      (0, import_useMatches.setClientMatches)(matches1), (0, import_useMatches.setClientMatches)(matches2), (0, import_useMatches.setClientMatches)(matches3);
    }).not.toThrow();
  });
});
(0, import_vitest.describe)("RouteMatch with dynamic params", () => {
  (0, import_vitest.it)("should handle single dynamic param", () => {
    (0, import_vitest.expect)({
      routeId: "/users/[id]",
      pathname: "/users/123",
      params: {
        id: "123"
      },
      loaderData: {
        user: {
          name: "John"
        }
      }
    }.params.id).toBe("123");
  }), (0, import_vitest.it)("should handle multiple dynamic params", () => {
    const match = {
      routeId: "/users/[userId]/posts/[postId]",
      pathname: "/users/123/posts/456",
      params: {
        userId: "123",
        postId: "456"
      },
      loaderData: {
        post: {
          title: "Hello"
        }
      }
    };
    (0, import_vitest.expect)(match.params.userId).toBe("123"), (0, import_vitest.expect)(match.params.postId).toBe("456");
  }), (0, import_vitest.it)("should handle catch-all params", () => {
    (0, import_vitest.expect)({
      routeId: "/docs/[...slug]",
      pathname: "/docs/getting-started/intro",
      params: {
        slug: ["getting-started", "intro"]
      },
      loaderData: {
        doc: {
          content: "Hello"
        }
      }
    }.params.slug).toEqual(["getting-started", "intro"]);
  });
});
(0, import_vitest.describe)("RouteMatch loaderData scenarios", () => {
  (0, import_vitest.it)("should handle complex nested loaderData", () => {
    const data = {
      routeId: "/dashboard",
      pathname: "/dashboard",
      params: {},
      loaderData: {
        user: {
          id: 1,
          profile: {
            name: "John",
            settings: {
              theme: "dark",
              notifications: !0
            }
          }
        },
        posts: [{
          id: 1,
          title: "Post 1"
        }, {
          id: 2,
          title: "Post 2"
        }]
      }
    }.loaderData;
    (0, import_vitest.expect)(data.user.profile.settings.theme).toBe("dark"), (0, import_vitest.expect)(data.posts).toHaveLength(2);
  }), (0, import_vitest.it)("should handle null loaderData", () => {
    (0, import_vitest.expect)({
      routeId: "/empty",
      pathname: "/empty",
      params: {},
      loaderData: null
    }.loaderData).toBeNull();
  }), (0, import_vitest.it)("should handle array loaderData", () => {
    (0, import_vitest.expect)({
      routeId: "/list",
      pathname: "/list",
      params: {},
      loaderData: [1, 2, 3, 4, 5]
    }.loaderData).toEqual([1, 2, 3, 4, 5]);
  }), (0, import_vitest.it)("should handle primitive loaderData", () => {
    (0, import_vitest.expect)({
      routeId: "/count",
      pathname: "/count",
      params: {},
      loaderData: 42
    }.loaderData).toBe(42);
  });
});
(0, import_vitest.describe)("finding matches", () => {
  const createMatches = () => [{
    routeId: "/_layout",
    pathname: "/",
    params: {},
    loaderData: {
      root: !0
    }
  }, {
    routeId: "/docs/_layout",
    pathname: "/docs",
    params: {},
    loaderData: {
      navItems: ["intro", "guide"]
    }
  }, {
    routeId: "/docs/[slug]",
    pathname: "/docs/intro",
    params: {
      slug: "intro"
    },
    loaderData: {
      title: "Introduction",
      headings: ["h1", "h2"]
    }
  }];
  (0, import_vitest.it)("should find match by exact routeId", () => {
    const found = createMatches().find(m => m.routeId === "/docs/_layout");
    (0, import_vitest.expect)(found).toBeDefined(), (0, import_vitest.expect)(found.loaderData.navItems).toEqual(["intro", "guide"]);
  }), (0, import_vitest.it)("should find match by routeId pattern", () => {
    const found = createMatches().find(m => m.routeId.includes("_layout"));
    (0, import_vitest.expect)(found).toBeDefined(), (0, import_vitest.expect)(found.routeId).toBe("/_layout");
  }), (0, import_vitest.it)("should get page match (last in array)", () => {
    const matches = createMatches(),
      pageMatch = matches[matches.length - 1];
    (0, import_vitest.expect)(pageMatch.routeId).toBe("/docs/[slug]"), (0, import_vitest.expect)(pageMatch.loaderData.title).toBe("Introduction");
  }), (0, import_vitest.it)("should get layout match for a page", () => {
    const layoutMatch = createMatches().find(m => m.routeId.includes("/docs/") && m.routeId.includes("_layout"));
    (0, import_vitest.expect)(layoutMatch).toBeDefined(), (0, import_vitest.expect)(layoutMatch.loaderData.navItems).toBeDefined();
  });
});