add test

vercel · May 10, 2022 · 7ad8085 · 7ad8085
1 parent f07b58b
commit 7ad8085
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 0 deletions.
diff --git 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
@@ -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
@@ -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 }')