Support for regex in `EffectFactory.matchPath` about marble

[JozefFlakus]

@zeucxb fixed with v1.1.1 patch 💪

[zeucxb]

Sorry, I have tried in the version that was running in the project here.

But checking the urlParams.factory.ts it should have worked. So I created a new project with the current stable version and it works.

👎 Sorry 👎

[krzysztof-miemiec]

@zeucxb I think you can try with a named param there, i.e.: matchPath: /:type(api|rest)/:file, then you should get {type: "api", file: "test.json"} as a result for /api/test.json.

The naming is probably a bug on our side, as path-to-regexp docs state that:

It is possible to write an unnamed parameter that only consists of a matching group. It works the same as a named parameter, except it will be numerically indexed.

[zeucxb]

Yeah @krzysztof-miemiec it works. Awesome!!!

[krzysztof-miemiec]

Internally Marble uses https://github.com/pillarjs/path-to-regexp which supports passing regexp to parameters. However everything has to be written as string. Have you tried .matchPath('/(api|rest)/(.*)')?

[krzysztof-miemiec]

If you're thinking about something more fancy, like writing actual regular expressions, it's not supported yet, but it's definitely doable. We'd have to think about regex pattern merging for nested routing. It's simple to get regex patterns and concatenate them, but I bet that sooner or later we'll get something like: /my/parent/path/ and /^\/(to-be|not-to-be)\/.+$/ and for any given route it will be simply evaluated as false, because of ^ in the middle. Then we'd have to remove one of the duplicated \/ inside and so on... So, for now I came up with:

• get both parent and child path parts and simply concatenate them as string
• remove all ^ and $ from that stringified regex (also using regex, what a perversion 😜 )
• .replace(([\\/]{2,})/g, '/')
• somehow extract all capturing groups and assign them to parameters; What should we do with groups that were defined in regex? There is a specification for named capturing groups that we could use, but AFAIK they haven't landed in JS. We can simply mark all groups from regex as non-capturing, but this has to be done earlier, before concatenation.
• append ^ and $ once again
• probably check for possibility of hacks on such routing mechanism

Since Marble is one of the milion solutions available, the above is probably redundant and someone might have implemented such merger.

[JozefFlakus]

So far this kind of advanced routing is not documented and wasn't tested before. We should cover these features with test cases first. Thanks @zeucxb for pointing this out.

[JozefFlakus]

It is a bug. @zeucxb please create a separate issue so we can track it properly :)

[JozefFlakus]

@zeucxb have you tested it with stringified Regex? 👇
#67 (comment)

[zeucxb]

But we have a problem if try to use regex and special params.

ex.

matchPath: /(api|rest)/:file

request: /rest/test.json

params: { file: "rest" }

[zeucxb]

And without the special param (only with regex) we cannot get url params.

[JozefFlakus]

re: #67 (comment)
Can you post also the example regex / path that was used within matchPath?

[zeucxb]

@JozefFlakus this?

With :file

matchPath: /(api|rest)/:file

request: /rest/test.json

params: { file: "rest" }

Without :file

matchPath: /(api|rest)/(.*)

request: /rest/test.json

params: { }

[JozefFlakus]

Thanks. Custom regex is problematic because params are mapped over declared names in order they occured, eg. /(api|rest)/:file has a one named parameter, which in result will be mapped to the first capturing grup. Maybe we should mach it in more precise way @krzysztof-miemiec? 🤔

[zeucxb]

I was about to say that we should have routes' documentation. 😄

[zeucxb]

I was going to open another issue but I don't know if it's an expected behavior.

I've this code in my application:

const web$ = combineRoutes("/admin", [
  EffectFactory
    .matchPath('/:dir')
    .matchType('GET')
    .use((req$) => ...), 
  EffectFactory
    .matchPath('*')
    .matchType('GET')
    .use((req$) => ... ),
]);

In this case a request to /admin gets 404 but /admin/ works fine.

If I change the code to:

const web$ = combineRoutes("/admin", [
  EffectFactory
    .matchPath('/:dir')
    .matchType('GET')
    .use((req$) => ...), 
  EffectFactory
    .matchPath('/')
    .matchType('GET')
    .use((req$) => ... ),
]);

Both /admin and /admin/ works.