fix: fixes middleware not being applied inside nested folder where the parent folder has no route (#311)

* test(middleware): add test to reproduce middleware not being applied inside nested folder where the parent folder has no route

* fix: middleware not being applied to nested child route if parent does not have a route

* chore: fix lint issues + formatting

* refactor: make isMiddlewareAppliedToAncestor more readable

* refactor: remove unnecessary relative path removal

Author: meck93

mocks/app-nested-middleware/routes/without-route/_middleware.ts

@@ -0,0 +1,8 @@
+import { createMiddleware } from 'hono/factory'
+
+export default [
+  createMiddleware(async (c, next) => {
+    await next()
+    c.header('grandparent-middleware-applied', 'true', { append: true })
+  }),
+]

mocks/app-nested-middleware/routes/without-route/with-index/index.tsx

@@ -0,0 +1,3 @@
+export default function IndexRoute() {
+  return <h1>IndexRoute</h1>
+}

mocks/app-nested-middleware/routes/without-route/with-named/named.tsx

@@ -0,0 +1,3 @@
+export default function NamedRoute() {
+  return <h1>Named Route</h1>
+}

src/client/runtime.test.ts

@@ -8,7 +8,7 @@ describe('buildCreateChildrenFn', () => {
 
     const div = document.createElement('div')
     div.innerHTML = '<span>test</span><div>test2</div>'
-    const result = await createChildren(div.childNodes)
+    await createChildren(div.childNodes)
     expect(createElement).toHaveBeenNthCalledWith(1, 'SPAN', {
       children: ['test'],
       key: 1,

src/server/server.ts

@@ -63,8 +63,9 @@ export const createApp = <E extends Env>(options: BaseServerOptions<E>): Hono<E>
   const app = options.app ?? new Hono()
   const trailingSlash = options.trailingSlash ?? false
 
-  // Track applied middleware to prevent duplication
-  const appliedMiddleware = new Set<string>()
+  // Track applied middleware per directory to prevent duplication while allowing inheritance
+  // Key: directory path, Value: Set of middleware file paths applied to that directory
+  const appliedMiddlewaresByDirectory = new Map<string, Set<string>>()
 
   // Share context by AsyncLocalStorage
   app.use(async function ShareContext(c, next) {
@@ -165,16 +166,43 @@ export const createApp = <E extends Env>(options: BaseServerOptions<E>): Hono<E>
           new RegExp(escapeDir(directory) + '/_middleware.tsx?').test(x)
         )
 
+      // Helper function to check if middleware has been applied to any ancestor
+      const isMiddlewareAppliedToAncestor = (
+        middlewarePath: string,
+        currentDir: string
+      ): boolean => {
+        const dirParts = currentDir.split('/')
+        const ancestorDirs: string[] = []
+        for (let i = dirParts.length - 1; i > 0; i--) {
+          ancestorDirs.push(dirParts.slice(0, i).join('/'))
+        }
+        return ancestorDirs.some((ancestorDir) =>
+          appliedMiddlewaresByDirectory.get(ancestorDir)?.has(middlewarePath)
+        )
+      }
+
       // Find middleware for current directory first
       let middlewareFile = findMiddleware(dir)
 
-      // Issue 290 fix: Search parent directories if no middleware found
+      // Issue 290/310 fix: Search parent directories if no middleware found
       if (!middlewareFile) {
         const dirParts = dir.split('/')
         for (let i = dirParts.length - 1; i >= 0; i--) {
           const parentDir = dirParts.slice(0, i).join('/')
-          middlewareFile = findMiddleware(parentDir)
-          if (middlewareFile) break
+
+          // Don't go beyond the routes root directory
+          if (!parentDir.includes(root)) {
+            break
+          }
+
+          const parentMiddleware = findMiddleware(parentDir)
+          if (!parentMiddleware) continue
+
+          // Skip if this middleware is already applied to any ancestor
+          if (isMiddlewareAppliedToAncestor(parentMiddleware, dir)) continue
+
+          middlewareFile = parentMiddleware
+          break
         }
       }
 
@@ -185,15 +213,16 @@ export const createApp = <E extends Env>(options: BaseServerOptions<E>): Hono<E>
           .replace('/_middleware.ts', '')
 
         // Only apply if this directory should have this middleware
-        const shouldApply =
-          middlewareDir === dir ||
-          (!appliedMiddleware.has(middlewareFile) && dir.startsWith(middlewareDir + '/'))
+        const shouldApply = middlewareDir === dir || dir.startsWith(middlewareDir + '/')
 
         if (middleware.default && shouldApply) {
-          if (!appliedMiddleware.has(middlewareFile)) {
-            appliedMiddleware.add(middlewareFile)
-          }
           subApp.use(...middleware.default)
+
+          // Track that this middleware has been applied to this directory
+          if (!appliedMiddlewaresByDirectory.has(dir)) {
+            appliedMiddlewaresByDirectory.set(dir, new Set())
+          }
+          appliedMiddlewaresByDirectory.get(dir)?.add(middlewareFile)
         }
       }
 
@@ -261,7 +290,7 @@ export const createApp = <E extends Env>(options: BaseServerOptions<E>): Hono<E>
 
       let rootPath = getRootPath(dir)
       if (trailingSlash) {
-        rootPath = /\/$/.test(rootPath) ? rootPath : rootPath + '/'
+        rootPath = rootPath.endsWith('/') ? rootPath : rootPath + '/'
       }
       app.route(rootPath, subApp)
     }

src/server/utils/file.ts

@@ -8,7 +8,7 @@ export const filePathToPath = (filePath: string) => {
     .replace(/\((.+?)\)/g, '')
     .replace(/\[(.+?)\]/g, ':$1')
     .replace(/\/\/+/g, '/')
-  return /^\//.test(filePath) ? filePath : '/' + filePath
+  return filePath.startsWith('/') ? filePath : '/' + filePath
 }
 
 /*

src/vite/components/honox-island.test.tsx

@@ -9,7 +9,7 @@ describe('HonoXIsland', () => {
       componentExport: 'Test',
       Component: () => <div>Test</div>,
       props: {
-          children: <TestComponent />,
+        children: <TestComponent />,
       },
     })
     // XXX: tested by internal implementation

test-integration/apps.test.ts

@@ -478,6 +478,20 @@ describe('Nested Middleware', () => {
     expect(res.status).toBe(200)
     expect(res.headers.get('X-Admin-Middleware')).toEqual('true')
   })
+
+  it('Should apply grandparent middleware to child index route - /without-route/with-index', async () => {
+    const res = await app.request('/without-route/with-index')
+    expect(res.status).toBe(200)
+    await expect(res.text()).resolves.toBe('<h1>IndexRoute</h1>')
+    expect(res.headers.get('grandparent-middleware-applied')).toEqual('true')
+  })
+
+  it('Should apply grandparent middleware to child named route - /without-route/with-named/named', async () => {
+    const res = await app.request('/without-route/with-named/named')
+    expect(res.status).toBe(200)
+    await expect(res.text()).resolves.toBe('<h1>Named Route</h1>')
+    expect(res.headers.get('grandparent-middleware-applied')).toEqual('true')
+  })
 })
 
 describe('<Script /> component', () => {