From 1a3bed10ca3bb7611021184c7eb5fcbb9a9dd171 Mon Sep 17 00:00:00 2001
From: Tim Neutkens <tim@timneutkens.nl>
Date: Fri, 28 Jan 2022 14:02:14 +0100
Subject: [PATCH] Add failing test for #33703 and #23824

Add tests for the cases described in #33703 and #23824 as well as a few more.
---
 .../dynamic-route-interpolation/index.test.ts | 65 +++++++++++++++++++
 1 file changed, 65 insertions(+)
 create mode 100644 test/e2e/dynamic-route-interpolation/index.test.ts

diff --git a/test/e2e/dynamic-route-interpolation/index.test.ts b/test/e2e/dynamic-route-interpolation/index.test.ts
new file mode 100644
index 0000000000000..a42c15dfc485e
--- /dev/null
+++ b/test/e2e/dynamic-route-interpolation/index.test.ts
@@ -0,0 +1,65 @@
+import { createNext } from 'e2e-utils'
+import { NextInstance } from 'test/lib/next-modes/base'
+import { renderViaHTTP } from 'next-test-utils'
+import cheerio from 'cheerio'
+
+describe('Dynamic Route Interpolation', () => {
+  let next: NextInstance
+
+  beforeAll(async () => {
+    next = await createNext({
+      files: {
+        'pages/blog/[slug].js': `
+          export function getServerSideProps({ params }) {
+            return { props: { slug: params.slug } }
+          }
+
+          export default function Page(props) { 
+            return <p id="slug">{props.slug}</p>
+          }
+
+        `,
+
+        'pages/api/dynamic/[slug].js': `
+          export default function Page(req, res) { 
+            const { slug } = req.query
+            res.end('slug: ' + slug)
+          }
+
+        `,
+      },
+      dependencies: {},
+    })
+  })
+  afterAll(() => next.destroy())
+
+  it('should work', async () => {
+    const html = await renderViaHTTP(next.url, '/blog/a')
+    const $ = cheerio.load(html)
+    expect($('#slug').text()).toBe('a')
+  })
+
+  it('should work with parameter itself', async () => {
+    const html = await renderViaHTTP(next.url, '/blog/[slug]')
+    const $ = cheerio.load(html)
+    expect($('#slug').text()).toBe('[slug]')
+  })
+
+  it('should work with brackets', async () => {
+    const html = await renderViaHTTP(next.url, '/blog/[abc]')
+    const $ = cheerio.load(html)
+    expect($('#slug').text()).toBe('[abc]')
+  })
+
+  it('should work with parameter itself in API routes', async () => {
+    const html = await renderViaHTTP(next.url, '/api/dynamic/[slug]')
+    const $ = cheerio.load(html)
+    expect($('#slug').text()).toBe('[slug]')
+  })
+
+  it('should work with brackets in API routes', async () => {
+    const html = await renderViaHTTP(next.url, '/api/dynamic/[abc]')
+    const $ = cheerio.load(html)
+    expect($('#slug').text()).toBe('[abc]')
+  })
+})