[🐞] Catch-all route causes all 404 static resources to get 301 to Slashed route #7852
Description
Which component is affected?
Qwik City (routing)
Describe the bug
I have a catch-all route for dynamic pages defined in a CMS. We take the URL, check if it exists in Builder and then render if so. If not we give a 404. When qwik (maybe from cache and a new build) makes a request for previously existing JS files that no longer exist, they get redirected to a slash and it gets handled by the app instead of a simple static resource 404.
- http://localhost:5173/should-404.js -> http://localhost:5173/should-404.js/
- http://localhost:5173/should-404.json -> http://localhost:5173/should-404.json/
Reproduction
Steps to reproduce
- npm create qwik@latest
- Move index.tsx to [...path]/index.tsx
- Go to some JS/JSON file that doesn't exist anymore, you'll get a 301 instead of 404
System Info
System:
OS: macOS 15.6
CPU: (14) arm64 Apple M4 Max
Memory: 951.91 MB / 36.00 GB
Shell: 5.9 - /bin/zsh
Binaries:
Node: 22.18.0 - ~/.volta/tools/image/node/22.18.0/bin/node
npm: 11.3.0 - ~/.volta/tools/image/npm/11.3.0/bin/npm
pnpm: 10.7.1 - ~/.volta/bin/pnpm
Browsers:
Chrome: 139.0.7258.139
Safari: 18.6
npmPackages:
@builder.io/qwik: ^1.16.0 => 1.16.0
@builder.io/qwik-city: ^1.16.0 => 1.16.0
typescript: 5.4.5 => 5.4.5
undici: * => 7.15.0
vite: 7.1.0 => 7.1.0Additional Information
I could workaround it by detecting static files that end with a slash and give a simplified 404 after it hits my index.tsx but I feeeeeel like it's a bug.
We could have this workaround inside our entry file:
server.on('request', (req, res) => {
staticFile(req, res, () => {
router(req, res, () => {
// Return a cheaper 404 for static files that end with a slash (after being 301 by qwik-city)
if (req.method === 'GET' && /\.(js|json|css|jpg|jpeg|png|webp|avif|gif|svg)\/$/.test(req.url ?? '')) {
res.writeHead(404, { 'Content-Type': 'text/html; charset=utf-8' });
res.end('Not Found');
return;
}
notFound(req, res, () => {});
});
});
});