diff --git a/test/basic.test.ts b/test/basic.test.ts
index 11c57935ce..fd32018a93 100644
--- a/test/basic.test.ts
+++ b/test/basic.test.ts
@@ -1,6 +1,6 @@
 import { fileURLToPath } from 'url'
 import { describe, expect, it } from 'vitest'
-import { setup, $fetch, startServer } from '@nuxt/test-utils'
+import { setup, fetch, $fetch, startServer } from '@nuxt/test-utils'
 
 await setup({
   rootDir: fileURLToPath(new URL('./fixtures/basic', import.meta.url)),
@@ -157,27 +157,66 @@ describe('reactivity transform', () => {
 })
 
 describe('extends support', () => {
-  describe('pages', () => {
-    it('extends foo/pages/index.vue', async () => {
+  describe('layouts & pages', () => {
+    it('extends foo/layouts/default & foo/pages/index', async () => {
       const html = await $fetch('/foo')
-      expect(html).toContain('Hello from extended page of foo!')
+      expect(html).toContain('Extended layout from foo')
+      expect(html).toContain('Extended page from foo')
     })
 
-    it('extends bar/pages/override.vue over foo/pages/override.vue', async () => {
+    it('extends [bar/layouts/override & bar/pages/override] over [foo/layouts/override & foo/pages/override]', async () => {
       const html = await $fetch('/override')
+      expect(html).toContain('Extended layout from bar')
       expect(html).toContain('Extended page from bar')
     })
   })
 
+  describe('components', () => {
+    it('extends foo/components/ExtendsFoo', async () => {
+      const html = await $fetch('/foo')
+      expect(html).toContain('Extended component from foo')
+    })
+
+    it('extends bar/components/ExtendsOverride over foo/components/ExtendsOverride', async () => {
+      const html = await $fetch('/override')
+      expect(html).toContain('Extended component from bar')
+    })
+  })
+
   describe('middlewares', () => {
     it('extends foo/middleware/foo', async () => {
-      const html = await $fetch('/with-middleware')
-      expect(html).toContain('Injected by extended middleware')
+      const html = await $fetch('/foo')
+      expect(html).toContain('Middleware | foo: Injected by extended middleware from foo')
     })
 
-    it('extends bar/middleware/override.vue over foo/middleware/override.vue', async () => {
-      const html = await $fetch('/with-middleware-override')
-      expect(html).toContain('Injected by extended middleware from bar')
+    it('extends bar/middleware/override over foo/middleware/override', async () => {
+      const html = await $fetch('/override')
+      expect(html).toContain('Middleware | override: Injected by extended middleware from bar')
+    })
+  })
+
+  describe('composables', () => {
+    it('extends foo/composables/foo', async () => {
+      const html = await $fetch('/foo')
+      expect(html).toContain('Composable | useExtendsFoo: foo')
+    })
+  })
+
+  describe('plugins', () => {
+    it('extends foo/plugins/foo', async () => {
+      const html = await $fetch('/foo')
+      expect(html).toContain('Plugin | foo: String generated from foo plugin!')
+    })
+  })
+
+  describe('server', () => {
+    it('extends foo/server/api/foo', async () => {
+      expect(await $fetch('/api/foo')).toBe('foo')
+    })
+
+    it('extends foo/server/middleware/foo', async () => {
+      const { headers } = await fetch('/')
+      expect(headers.get('injected-header')).toEqual('foo')
     })
   })
 })
diff --git a/test/fixtures/basic/extends/bar/components/ExtendsOverride.vue b/test/fixtures/basic/extends/bar/components/ExtendsOverride.vue
new file mode 100644
index 0000000000..070c0c5d43
--- /dev/null
+++ b/test/fixtures/basic/extends/bar/components/ExtendsOverride.vue
@@ -0,0 +1,3 @@
+<template>
+  <div>Extended component from bar</div>
+</template>
diff --git a/test/fixtures/basic/extends/bar/layouts/override.vue b/test/fixtures/basic/extends/bar/layouts/override.vue
new file mode 100644
index 0000000000..7397c7ad63
--- /dev/null
+++ b/test/fixtures/basic/extends/bar/layouts/override.vue
@@ -0,0 +1,6 @@
+<template>
+  <div>
+    <div>Extended layout from bar</div>
+    <NuxtPage />
+  </div>
+</template>
diff --git a/test/fixtures/basic/extends/bar/pages/override.vue b/test/fixtures/basic/extends/bar/pages/override.vue
index 563da71769..d104ece7bf 100644
--- a/test/fixtures/basic/extends/bar/pages/override.vue
+++ b/test/fixtures/basic/extends/bar/pages/override.vue
@@ -1,3 +1,14 @@
+<script setup>
+definePageMeta({
+  layout: 'override',
+  middleware: 'override'
+})
+</script>
+
 <template>
-  <div>Extended page from bar</div>
+  <div>
+    <div>Extended page from bar</div>
+    <div>Middleware | override: {{ $route.meta.override }}</div>
+    <ExtendsOverride />
+  </div>
 </template>
diff --git a/test/fixtures/basic/extends/foo/components/ExtendsFoo.vue b/test/fixtures/basic/extends/foo/components/ExtendsFoo.vue
new file mode 100644
index 0000000000..1cda5442d5
--- /dev/null
+++ b/test/fixtures/basic/extends/foo/components/ExtendsFoo.vue
@@ -0,0 +1,3 @@
+<template>
+  <div>Extended component from foo</div>
+</template>
diff --git a/test/fixtures/basic/extends/foo/components/ExtendsOverride.vue b/test/fixtures/basic/extends/foo/components/ExtendsOverride.vue
new file mode 100644
index 0000000000..5e94aa248f
--- /dev/null
+++ b/test/fixtures/basic/extends/foo/components/ExtendsOverride.vue
@@ -0,0 +1,3 @@
+<template>
+  <div>This component should be overriden by bar</div>
+</template>
diff --git a/test/fixtures/basic/extends/foo/composables/foo.ts b/test/fixtures/basic/extends/foo/composables/foo.ts
new file mode 100644
index 0000000000..9caa9254fc
--- /dev/null
+++ b/test/fixtures/basic/extends/foo/composables/foo.ts
@@ -0,0 +1 @@
+export const useExtendsFoo = () => 'foo'
diff --git a/test/fixtures/basic/extends/foo/layouts/default.vue b/test/fixtures/basic/extends/foo/layouts/default.vue
new file mode 100644
index 0000000000..1627862189
--- /dev/null
+++ b/test/fixtures/basic/extends/foo/layouts/default.vue
@@ -0,0 +1,6 @@
+<template>
+  <div>
+    <div>Extended layout from foo</div>
+    <NuxtPage />
+  </div>
+</template>
diff --git a/test/fixtures/basic/extends/foo/layouts/override.vue b/test/fixtures/basic/extends/foo/layouts/override.vue
new file mode 100644
index 0000000000..b10cfadd9a
--- /dev/null
+++ b/test/fixtures/basic/extends/foo/layouts/override.vue
@@ -0,0 +1,3 @@
+<template>
+  <div>This layout should be overriden by bar</div>
+</template>
diff --git a/test/fixtures/basic/extends/foo/middleware/foo.ts b/test/fixtures/basic/extends/foo/middleware/foo.ts
index 3be035596f..53963c7703 100644
--- a/test/fixtures/basic/extends/foo/middleware/foo.ts
+++ b/test/fixtures/basic/extends/foo/middleware/foo.ts
@@ -1,3 +1,3 @@
 export default defineNuxtRouteMiddleware((to) => {
-  to.meta.foo = 'Injected by extended middleware'
+  to.meta.foo = 'Injected by extended middleware from foo'
 })
diff --git a/test/fixtures/basic/extends/foo/middleware/override.ts b/test/fixtures/basic/extends/foo/middleware/override.ts
index cd50286df4..fbbfd73091 100644
--- a/test/fixtures/basic/extends/foo/middleware/override.ts
+++ b/test/fixtures/basic/extends/foo/middleware/override.ts
@@ -1,3 +1,3 @@
 export default defineNuxtRouteMiddleware((to) => {
-  to.meta.override = 'Injected by extended middleware from foo'
+  to.meta.override = 'This middleware should be overriden by bar'
 })
diff --git a/test/fixtures/basic/extends/foo/pages/foo.vue b/test/fixtures/basic/extends/foo/pages/foo.vue
index 7004d87963..39541b4831 100644
--- a/test/fixtures/basic/extends/foo/pages/foo.vue
+++ b/test/fixtures/basic/extends/foo/pages/foo.vue
@@ -1,3 +1,17 @@
+<script setup>
+definePageMeta({
+  middleware: 'foo'
+})
+
+const foo = useExtendsFoo()
+</script>
+
 <template>
-  <div>Hello from extended page of foo!</div>
+  <div>
+    <div>Extended page from foo</div>
+    <div>Middleware | foo: {{ $route.meta.foo }}</div>
+    <div>Composable | useExtendsFoo: {{ foo }}</div>
+    <div>Plugin | foo: {{ $foo() }}</div>
+    <ExtendsFoo />
+  </div>
 </template>
diff --git a/test/fixtures/basic/extends/foo/pages/override.vue b/test/fixtures/basic/extends/foo/pages/override.vue
index e47e98b465..81a97ed0f2 100644
--- a/test/fixtures/basic/extends/foo/pages/override.vue
+++ b/test/fixtures/basic/extends/foo/pages/override.vue
@@ -1,3 +1,3 @@
 <template>
-  <div>Extended page from foo</div>
+  <div>This page should be overriden by bar</div>
 </template>
diff --git a/test/fixtures/basic/extends/foo/pages/with-middleware-override.vue b/test/fixtures/basic/extends/foo/pages/with-middleware-override.vue
deleted file mode 100644
index 4bce0a0d1c..0000000000
--- a/test/fixtures/basic/extends/foo/pages/with-middleware-override.vue
+++ /dev/null
@@ -1,9 +0,0 @@
-<script setup>
-definePageMeta({
-  middleware: 'override'
-})
-</script>
-
-<template>
-  <div>{{ $route.meta.override }}</div>
-</template>
diff --git a/test/fixtures/basic/extends/foo/pages/with-middleware.vue b/test/fixtures/basic/extends/foo/pages/with-middleware.vue
deleted file mode 100644
index d4ebb55161..0000000000
--- a/test/fixtures/basic/extends/foo/pages/with-middleware.vue
+++ /dev/null
@@ -1,9 +0,0 @@
-<script setup>
-definePageMeta({
-  middleware: 'foo'
-})
-</script>
-
-<template>
-  <div>{{ $route.meta.foo }}</div>
-</template>
diff --git a/test/fixtures/basic/extends/foo/plugins/foo.ts b/test/fixtures/basic/extends/foo/plugins/foo.ts
new file mode 100644
index 0000000000..23534da003
--- /dev/null
+++ b/test/fixtures/basic/extends/foo/plugins/foo.ts
@@ -0,0 +1,7 @@
+export default defineNuxtPlugin(() => {
+  return {
+    provide: {
+      foo: () => 'String generated from foo plugin!'
+    }
+  }
+})
diff --git a/test/fixtures/basic/extends/foo/server/api/foo.ts b/test/fixtures/basic/extends/foo/server/api/foo.ts
new file mode 100644
index 0000000000..f759e16500
--- /dev/null
+++ b/test/fixtures/basic/extends/foo/server/api/foo.ts
@@ -0,0 +1 @@
+export default () => 'foo'
diff --git a/test/fixtures/basic/extends/foo/server/middleware/foo.ts b/test/fixtures/basic/extends/foo/server/middleware/foo.ts
new file mode 100644
index 0000000000..a952e0f1fb
--- /dev/null
+++ b/test/fixtures/basic/extends/foo/server/middleware/foo.ts
@@ -0,0 +1,6 @@
+import type { ServerResponse } from 'http'
+
+export default (_, res: ServerResponse, next) => {
+  res.setHeader('injected-header', 'foo')
+  next()
+}