diff --git a/test/e2e/app-dir/root-layout/app/(multiple-root)/(root-a)/layout.js b/test/e2e/app-dir/root-layout/app/(multiple-root)/(root-a)/layout.js
new file mode 100644
index 0000000000000..e4536fb650a48
--- /dev/null
+++ b/test/e2e/app-dir/root-layout/app/(multiple-root)/(root-a)/layout.js
@@ -0,0 +1,12 @@
+import React from 'react'
+
+export default function Layout({ children }) {
+ return (
+
+
+
+ {children}
+
+
+ )
+}
diff --git a/test/e2e/app-dir/root-layout/app/(multiple-root)/(root-a)/root-layout-a/page.js b/test/e2e/app-dir/root-layout/app/(multiple-root)/(root-a)/root-layout-a/page.js
new file mode 100644
index 0000000000000..6c5a6eefe3dbf
--- /dev/null
+++ b/test/e2e/app-dir/root-layout/app/(multiple-root)/(root-a)/root-layout-a/page.js
@@ -0,0 +1,10 @@
+import React from 'react'
+import Link from 'next/link'
+
+export default function Page() {
+ return (
+
+ To b
+
+ )
+}
diff --git a/test/e2e/app-dir/root-layout/app/(multiple-root)/(root-b)/layout.js b/test/e2e/app-dir/root-layout/app/(multiple-root)/(root-b)/layout.js
new file mode 100644
index 0000000000000..80b2eb7a5bf17
--- /dev/null
+++ b/test/e2e/app-dir/root-layout/app/(multiple-root)/(root-b)/layout.js
@@ -0,0 +1,12 @@
+import React from 'react'
+
+export default function Layout({ children }) {
+ return (
+
+
+
+ {children}
+
+
+ )
+}
diff --git a/test/e2e/app-dir/root-layout/app/(multiple-root)/(root-b)/root-layout-b/page.js b/test/e2e/app-dir/root-layout/app/(multiple-root)/(root-b)/root-layout-b/page.js
new file mode 100644
index 0000000000000..291ecd84af8b3
--- /dev/null
+++ b/test/e2e/app-dir/root-layout/app/(multiple-root)/(root-b)/root-layout-b/page.js
@@ -0,0 +1,10 @@
+import React from 'react'
+import Link from 'next/link'
+
+export default function Page() {
+ return (
+
+ To a
+
+ )
+}
diff --git a/test/e2e/app-dir/root-layout/root-layout.test.ts b/test/e2e/app-dir/root-layout/root-layout.test.ts
index a18dd53bec3c6..a01754ad30542 100644
--- a/test/e2e/app-dir/root-layout/root-layout.test.ts
+++ b/test/e2e/app-dir/root-layout/root-layout.test.ts
@@ -194,5 +194,17 @@ createNextDescribe(
expect(await browser.eval('window.__TEST_NO_RELOAD')).toBeUndefined()
})
})
+
+ it('should correctly handle navigation between multiple root layouts', async () => {
+ const browser = await next.browser('/root-layout-a')
+
+ await browser.waitForElementByCss('#root-a')
+ expect(await browser.hasElementByCssSelector('#root-b')).toBeFalse()
+ await browser
+ .elementById('link-to-b')
+ .click()
+ .waitForElementByCss('#root-b')
+ expect(await browser.hasElementByCssSelector('#root-a')).toBeFalse()
+ })
}
)