Server-side 404 error on route with period in url

Describe the bug

I’m getting 404 error from dev server on this URL:

http://localhost:3000/fuel-savings/test.two

This URL works fine:

http://localhost:3000/fuel-savings/test

Every URL that that I tested that has a period in it causes the 404.

I cloned react-slingshot and ran it almost exactly as is. I had to change react-dom from 16.8.x to 16.9.0 for the install to succeed (corp npm cache doesn’t have 16.8.x), but otherwise zero changes.

There is no output in the node console when I try to load this route.

I originally ran into this problem in my app and then made a clean clone of react-slingshot to test with that and see the same error.

To Reproduce* Steps to reproduce the behavior:

1. Go to http://localhost:3000/fuel-savings/test
2. Notice it renders fine, the fule-savings page (the /test is ignored)
3. Navigate to http://localhost:3000/fuel-savings/test.two
4. See 404 error

Expected behavior

Page should render same as url without period in it.

Screenshots

Desktop (please complete the following information):

• OS: iOS
• Browser Chrome
• Version Version 76.0.3809.100 (Official Build) (64-bit)

Thanks!!

[samuelneff]

@kwelch Thank you! It wasn’t quite that simple because once disableDotRule is set, then the bundle.js call gets redirected to root too, so no JS is served. Found fix on another thread:

https://github.com/bripkens/connect-history-api-fallback/issues/40

Which is to also include an accept header filter.

{
  disableDotRule: true,
  htmlAcceptHeaders: ['text/html', 'application/xhtml+xml']
}

Is there any reason this should not be done in react-slingshot by default? I would be happy to submit a PR.

[nickytonline]

Thanks for your contribution @samuelneff! 👏