RouterConfiguration case sensitivity question


#1

Testing a demo app I found this effect:

The default url obviously works fine:

https://{localhost}/App/about-us/our-company

Aurelia routes using a different case also work, such as:

https://{localhost}/App/About-Us/Our-Company

However, this fails:

https://{localhost}/app/about-us/our-company

A change to the case that hits the RouterConfiguration options.root fails in Aurelia but works fine in MVC. Is this as expected?


#2

Aurelia router has an option to not ignore cases. Did you try that? https://aurelia.io/docs/routing/configuration#case-sensitive-routes


#3

No I did not! Many thanks!

Does this apply to the:

config.options.root = ‘/App’;

?

It is only this root that is failing. The others are fine.


#4

Just looked at this. It states that

By default Aurelia’s routes are not case sensitive.

But the issue is with the RouterConfiguration options.root acting in a case sensitive way.

  configureRouter(config: RouterConfiguration, router: Router): void {
config.title = 'Aurelia';
config.options.pushState = true;
config.options.root = '/App';
config.map([
  { route: ['', '/home'], name: 'home', moduleId: PLATFORM.moduleName('./pages/home'), nav: true, title: 'Home'},
  { route: '/about-us', name: 'about-us', moduleId: PLATFORM.moduleName('./pages/about-us'), nav: true, title: 'About Us'},
  { route: '/about-us/our-company', name: 'our-company', moduleId: PLATFORM.moduleName('./pages/about-us/our-company'), nav: true, title: 'Our Company'},
  { route: '/about-us/link-below-our-company', name: 'link-below-our-company', moduleId: PLATFORM.moduleName('./pages/about-us/link-below-our-company'), nav: true, title: 'Link Below Our Company'},
  { route: '/about-us/people', name: 'people', moduleId: PLATFORM.moduleName('./pages/about-us/people'), nav: true, title: 'People'},
  { route: '/services', name: 'services', moduleId: PLATFORM.moduleName('./pages/services'), nav: true, title: 'Services'},
  { route: '/contact-us', name: 'contact-us', moduleId: PLATFORM.moduleName('./pages/contact-us'), nav: true, title: 'Contact Us'},
  { route: '/link-that-is-hidden', name: 'link-that-is-hidden', moduleId: PLATFORM.moduleName('./pages/link-that-is-hidden'), nav: true, title: 'Link that is not hidden'},
]);
this.router = router;

}


#5

That’s interesting. But I’m not sure what should be done for this.


#6

Yes, I have not found anything to get around this as yet. It seems to be either an unfortunate limitation, a lack of understanding or I am missing something.


#7

@davismj any idea how to workaround this issue? Or is it a new feature request?


#8

That’s a new feature. The root is specifying a part that lies outside the hands of the router.

I’m not sure it would be too difficult. Let’s take a look.


#9

Thanks for the clarification.
I did not intend to cause more work!


#10

I think its good you uncovered this use case. Having the router feature heavy is certainly a good thing :wink: