first commit

test/e2e/middleware-responses/app/middleware.js

@@ -0,0 +1,73 @@
+import { NextResponse } from 'next/server'
+
+// we use this trick to fool static analysis at build time, so we can build a
+// middleware that will return a body at run time, and check it is disallowed.
+class MyResponse extends Response {}
+
+export async function middleware(request, ev) {
+  const { readable, writable } = new TransformStream()
+  const url = request.nextUrl
+  const writer = writable.getWriter()
+  const encoder = new TextEncoder()
+  const next = NextResponse.next()
+
+  // this is needed for tests to get the BUILD_ID
+  if (url.pathname.startsWith('/_next/static/__BUILD_ID')) {
+    return NextResponse.next()
+  }
+
+  // Header based on query param
+  if (url.searchParams.get('nested-header') === 'true') {
+    next.headers.set('x-nested-header', 'valid')
+  }
+
+  // Ensure deep can append to this value
+  if (url.searchParams.get('append-me') === 'true') {
+    next.headers.append('x-append-me', 'top')
+  }
+
+  // Ensure deep can append to this value
+  if (url.searchParams.get('cookie-me') === 'true') {
+    next.headers.append('set-cookie', 'bar=chocochip')
+  }
+
+  // Sends a header
+  if (url.pathname === '/header') {
+    next.headers.set('x-first-header', 'valid')
+    return next
+  }
+
+  if (url.pathname === '/two-cookies') {
+    const headers = new Headers()
+    headers.append('set-cookie', 'foo=chocochip')
+    headers.append('set-cookie', 'bar=chocochip')
+    return new Response(null, { headers })
+  }
+
+  // Streams a basic response
+  if (url.pathname === '/stream-a-response') {
+    ev.waitUntil(
+      (async () => {
+        writer.write(encoder.encode('this is a streamed '))
+        writer.write(encoder.encode('response '))
+        writer.close()
+      })()
+    )
+
+    return new MyResponse(readable)
+  }
+
+  if (url.pathname === '/bad-status') {
+    return new Response(null, {
+      headers: { 'WWW-Authenticate': 'Basic realm="Secure Area"' },
+      status: 401,
+    })
+  }
+
+  // Sends response
+  if (url.pathname === '/send-response') {
+    return new MyResponse(JSON.stringify({ message: 'hi!' }))
+  }
+
+  return next
+}

test/e2e/middleware-responses/app/next.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  i18n: {
+    locales: ['en', 'fr', 'nl'],
+    defaultLocale: 'en',
+  },
+}

test/e2e/middleware-responses/app/pages/index.js

@@ -0,0 +1,48 @@
+import Link from 'next/link'
+
+export default function Home({ message }) {
+  return (
+    <div>
+      <p className="title">Hello {message}</p>
+      <Link href="/stream-a-response">Stream a response</Link>
+      <div />
+      <Link href="/stream-long">Stream a long response</Link>
+      <Link href="/stream-end-stream">Test streaming after response ends</Link>
+      <div />
+      <Link href="/stream-header-end">
+        Attempt to add a header after stream ends
+      </Link>
+      <div />
+      <Link href="/redirect-stream">
+        Redirect to Google and attempt to stream after
+      </Link>
+      <div />
+      <Link href="/header">Respond with a header</Link>
+      <div />
+      <Link href="/header?nested-header=true">
+        Respond with 2 headers (nested middleware effect)
+      </Link>
+      <div />
+      <Link href="/body-end-header">Respond with body, end, set a header</Link>
+      <div />
+      <Link href="/body-end-body">
+        Respond with body, end, send another body
+      </Link>
+      <div />
+      <Link href="/send-response">Respond with body</Link>
+      <div />
+      <Link href="/redirect-body">Redirect and then send a body</Link>
+      <div />
+      <Link href="/react">Send React component as a body</Link>
+      <div />
+      <Link href="/react-stream">Stream React component</Link>
+      <div />
+      <Link href="/bad-status">404</Link>
+      <div />
+    </div>
+  )
+}
+
+export const getServerSideProps = ({ query }) => ({
+  props: { message: query.message || 'World' },
+})

test/e2e/middleware-responses/test/index.test.ts

@@ -0,0 +1,87 @@
+/* eslint-env jest */
+
+import { join } from 'path'
+import { fetchViaHTTP } from 'next-test-utils'
+import { NextInstance } from 'e2e-utils'
+import { createNext, FileRef } from 'e2e-utils'
+
+describe('Middleware Responses', () => {
+  let next: NextInstance
+
+  afterAll(() => next.destroy())
+  beforeAll(async () => {
+    next = await createNext({
+      files: {
+        pages: new FileRef(join(__dirname, '../app/pages')),
+        'middleware.js': new FileRef(join(__dirname, '../app/middleware.js')),
+        'next.config.js': new FileRef(join(__dirname, '../app/next.config.js')),
+      },
+    })
+  })
+  function testsWithLocale(locale = '') {
+    const label = locale ? `${locale} ` : ``
+
+    it(`${label}responds with multiple cookies`, async () => {
+      const res = await fetchViaHTTP(next.url, `${locale}/two-cookies`)
+      expect(res.headers.raw()['set-cookie']).toEqual([
+        'foo=chocochip',
+        'bar=chocochip',
+      ])
+    })
+
+    it(`${label}should not fail when returning a stream`, async () => {
+      const res = await fetchViaHTTP(next.url, `${locale}/stream-a-response`)
+      expect(res.status).toBe(200)
+
+      if (!(global as any).isNextDeploy) {
+        expect(next.cliOutput).not.toContain(
+          `A middleware can not alter response's body. Learn more: https://nextjs.org/docs/messages/returning-response-body-in-middleware`
+        )
+      }
+    })
+
+    it(`${label}should not fail when returning a text body`, async () => {
+      const res = await fetchViaHTTP(next.url, `${locale}/send-response`)
+      expect(res.status).toBe(200)
+
+      if (!(global as any).isNextDeploy) {
+        expect(next.cliOutput).not.toContain(
+          `A middleware can not alter response's body. Learn more: https://nextjs.org/docs/messages/returning-response-body-in-middleware`
+        )
+      }
+    })
+
+    it(`${label}should respond with a 401 status code`, async () => {
+      const res = await fetchViaHTTP(next.url, `${locale}/bad-status`)
+      const html = await res.text()
+      expect(res.status).toBe(401)
+      expect(html).toBe('')
+    })
+
+    it(`${label}should respond with one header`, async () => {
+      const res = await fetchViaHTTP(next.url, `${locale}/header`)
+      expect(res.headers.get('x-first-header')).toBe('valid')
+    })
+
+    it(`${label}should respond with two headers`, async () => {
+      const res = await fetchViaHTTP(
+        next.url,
+        `${locale}/header?nested-header=true`
+      )
+      expect(res.headers.get('x-first-header')).toBe('valid')
+      expect(res.headers.get('x-nested-header')).toBe('valid')
+    })
+
+    it(`${label}should respond appending headers headers`, async () => {
+      const res = await fetchViaHTTP(
+        next.url,
+        `${locale}/?nested-header=true&append-me=true&cookie-me=true`
+      )
+      expect(res.headers.get('x-nested-header')).toBe('valid')
+      expect(res.headers.get('x-append-me')).toBe('top')
+      expect(res.headers.raw()['set-cookie']).toEqual(['bar=chocochip'])
+    })
+  }
+  testsWithLocale()
+  testsWithLocale('/fr')
+})