flow-and-components-documentation
flow-and-components-documentation copied to clipboard
Unable to resolve routes with special characters
I would assume this should succeed
it("should resolve routes with special characters", async () => {
const resolver = new Resolver([
{ path: "/ab", action: () => "a" },
{ path: "/a b", action: () => "b" },
{ path: "/a b (c)", action: () => "c" }
]);
expect((await resolver.resolve("/ab")).result).to.be.equal("a");
expect((await resolver.resolve("/a b")).result).to.be.equal("b");
expect((await resolver.resolve("/a b (c)")).result).to.be.equal("c");
});
but it fails with
Error: [Vaadin.Router] Page not found (/a b (c))
This is expected behavior in Vaadin Router since it uses path-to-regexp
for the route path syntax, and that treats (
, )
, and a few other characters specially. If you need to include a (
literally, it needs to be escaped with a back slash: '\\('
(which itself has to be escaped in JS literal strings).
Here is the relevant group of unit tests: https://github.com/vaadin/vaadin-router/blob/master/test/resolver/matchPath.spec.js#L289
The real issue here is that neither Vaadin Router's docs, nor Flow docs explain the syntax.