diff --git a/test/e2e/app-dir/app/app/css/css-page/unused-nested/inner/page.js b/test/e2e/app-dir/app/app/css/css-page/unused-nested/inner/page.js
new file mode 100644
index 0000000000000..6878a343aa179
--- /dev/null
+++ b/test/e2e/app-dir/app/app/css/css-page/unused-nested/inner/page.js
@@ -0,0 +1,3 @@
+export default function Inner() {
+  return <p>Inner Page</p>
+}
diff --git a/test/e2e/app-dir/app/app/css/css-page/unused-nested/layout.js b/test/e2e/app-dir/app/app/css/css-page/unused-nested/layout.js
new file mode 100644
index 0000000000000..38e985058500c
--- /dev/null
+++ b/test/e2e/app-dir/app/app/css/css-page/unused-nested/layout.js
@@ -0,0 +1,10 @@
+import { layout } from './styles'
+
+export default function ServerLayout({ children }) {
+  return (
+    <>
+      <p className={layout.mod}>Layout</p>
+      {children}
+    </>
+  )
+}
diff --git a/test/e2e/app-dir/app/app/css/css-page/unused-nested/only-used-in-first-page.module.css b/test/e2e/app-dir/app/app/css/css-page/unused-nested/only-used-in-first-page.module.css
new file mode 100644
index 0000000000000..c71dcc347dbe0
--- /dev/null
+++ b/test/e2e/app-dir/app/app/css/css-page/unused-nested/only-used-in-first-page.module.css
@@ -0,0 +1,3 @@
+.this_should_not_be_included_in_inner_path {
+  color: wheat;
+}
diff --git a/test/e2e/app-dir/app/app/css/css-page/unused-nested/only-used-in-layout.module.css b/test/e2e/app-dir/app/app/css/css-page/unused-nested/only-used-in-layout.module.css
new file mode 100644
index 0000000000000..43b5b99d39ebc
--- /dev/null
+++ b/test/e2e/app-dir/app/app/css/css-page/unused-nested/only-used-in-layout.module.css
@@ -0,0 +1,3 @@
+.mod {
+  color: tomato;
+}
diff --git a/test/e2e/app-dir/app/app/css/css-page/unused-nested/page.js b/test/e2e/app-dir/app/app/css/css-page/unused-nested/page.js
new file mode 100644
index 0000000000000..531ae6e120a5f
--- /dev/null
+++ b/test/e2e/app-dir/app/app/css/css-page/unused-nested/page.js
@@ -0,0 +1,5 @@
+import { page } from './styles'
+
+export default function Page() {
+  return <p className={page.this_should_not_be_included_in_inner_path}>Page</p>
+}
diff --git a/test/e2e/app-dir/app/app/css/css-page/unused-nested/styles.js b/test/e2e/app-dir/app/app/css/css-page/unused-nested/styles.js
new file mode 100644
index 0000000000000..f649cef70ea2e
--- /dev/null
+++ b/test/e2e/app-dir/app/app/css/css-page/unused-nested/styles.js
@@ -0,0 +1,4 @@
+import layout from './only-used-in-layout.module.css'
+import page from './only-used-in-first-page.module.css'
+
+export { layout, page }
diff --git a/test/e2e/app-dir/index.test.ts b/test/e2e/app-dir/index.test.ts
index 38270f263db1f..18c1c6b8282fe 100644
--- a/test/e2e/app-dir/index.test.ts
+++ b/test/e2e/app-dir/index.test.ts
@@ -1261,13 +1261,26 @@ describe('app dir', () => {
 
         if (!isDev) {
           it('should not include unused css modules in the page in prod', async () => {
-            const browser = await webdriver(next.url, '/css/css-page')
+            const browser = await webdriver(next.url, '/css/css-page/unused')
             expect(
               await browser.eval(
                 `[...document.styleSheets].some(({ rules }) => [...rules].some(rule => rule.selectorText.includes('this_should_not_be_included')))`
               )
             ).toBe(false)
           })
+
+          // TODO-APP: Should not include unused css modules in pages
+          it.skip('should not include unused css modules in nested pages in prod', async () => {
+            const browser = await webdriver(
+              next.url,
+              '/css/css-page/unused-nested/inner'
+            )
+            expect(
+              await browser.eval(
+                `[...document.styleSheets].some(({ rules }) => [...rules].some(rule => rule.selectorText.includes('this_should_not_be_included_in_inner_path')))`
+              )
+            ).toBe(false)
+          })
         }
       })