From 7ad8085851f023125aca99c09c134b6170389a2d Mon Sep 17 00:00:00 2001
From: Jiachi Liu <inbox@huozhi.im>
Date: Tue, 10 May 2022 14:29:22 +0200
Subject: [PATCH] add test

---
 test/integration/app-document/pages/_document.js | 2 ++
 test/integration/app-document/pages/index.js     | 2 ++
 test/integration/app-document/test/rendering.js  | 8 ++++++++
 3 files changed, 12 insertions(+)

diff --git a/test/integration/app-document/pages/_document.js b/test/integration/app-document/pages/_document.js
index e78e002ffcea5..c6a9c36e41430 100644
--- a/test/integration/app-document/pages/_document.js
+++ b/test/integration/app-document/pages/_document.js
@@ -42,6 +42,7 @@ export default class MyDocument extends Document {
 
     return {
       ...result,
+      cssInJsCount: (result.html.match(/css-in-js-class/g) || []).length,
       customProperty: 'Hello Document',
       withCSP: ctx.query.withCSP,
     }
@@ -74,6 +75,7 @@ export default class MyDocument extends Document {
           <p id="document-hmr">Hello Document HMR</p>
           <Main />
           <NextScript nonce="test-nonce" />
+          <div id="css-in-cjs-count">{this.props.cssInJsCount}</div>
         </body>
       </Html>
     )
diff --git a/test/integration/app-document/pages/index.js b/test/integration/app-document/pages/index.js
index c4ab35053abe7..f21ecbe1dd7a4 100644
--- a/test/integration/app-document/pages/index.js
+++ b/test/integration/app-document/pages/index.js
@@ -2,8 +2,10 @@ import Link from 'next/link'
 export default () => (
   <div>
     <div className="page-index">index</div>
+    <span className="css-in-js-class" />
     <Link href="/about">
       <a id="about-link">about</a>
     </Link>
+    <span className="css-in-js-class" />
   </div>
 )
diff --git a/test/integration/app-document/test/rendering.js b/test/integration/app-document/test/rendering.js
index 541594eef04df..71514580fef79 100644
--- a/test/integration/app-document/test/rendering.js
+++ b/test/integration/app-document/test/rendering.js
@@ -22,6 +22,14 @@ export default function ({ app }, suiteName, render, fetch) {
         expect($('body').hasClass('custom_class')).toBe(true)
       })
 
+      it('Document.getInitialProps returns html prop representing app shell', async () => {
+        // Extract css-in-js-class from the rendered HTML, which is returned by Document.getInitialProps
+        const $index = await get$('/')
+        const $about = await get$('/about')
+        expect($index('#css-in-cjs-count').text()).toBe('2')
+        expect($about('#css-in-cjs-count').text()).toBe('0')
+      })
+
       test('It injects custom head tags', async () => {
         const $ = await get$('/')
         expect($('head').text()).toMatch('body { margin: 0 }')