feat: move SSR tests to type module

playground/ssr-deps/__tests__/serve.ts

@@ -10,7 +10,7 @@ export const port = ports['ssr-deps']
 export async function serve() {
   await kill(port)
 
-  const { createServer } = require(path.resolve(rootDir, 'server.js'))
+  const { createServer } = await import(path.resolve(rootDir, 'server.js'))
   const { app, vite } = await createServer(rootDir, hmrPorts['ssr-deps'])
 
   return new Promise((resolve, reject) => {

playground/ssr-deps/package.json

@@ -2,6 +2,7 @@
   "name": "test-ssr-deps",
   "private": true,
   "version": "0.0.0",
+  "type": "module",
   "scripts": {
     "dev": "node server",
     "serve": "cross-env NODE_ENV=production node server",

playground/ssr-deps/server.js

@@ -1,19 +1,22 @@
 // @ts-check
-const fs = require('fs')
-const path = require('path')
-const express = require('express')
+import fs from 'fs'
+import path from 'path'
+import { fileURLToPath } from 'url'
+import express from 'express'
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url))
 
 const isTest = process.env.NODE_ENV === 'test' || !!process.env.VITE_TEST_BUILD
 
-async function createServer(root = process.cwd(), hmrPort) {
+export async function createServer(root = process.cwd(), hmrPort) {
   const resolve = (p) => path.resolve(__dirname, p)
 
   const app = express()
 
   /**
    * @type {import('vite').ViteDevServer}
    */
-  const vite = await require('vite').createServer({
+  const vite = await (await import('vite')).createServer({
     root,
     logLevel: isTest ? 'error' : 'info',
     server: {
@@ -63,6 +66,3 @@ if (!isTest) {
     })
   )
 }
-
-// for test use
-exports.createServer = createServer

playground/ssr-html/__tests__/serve.ts

@@ -10,7 +10,7 @@ export const port = ports['ssr-html']
 export async function serve() {
   await kill(port)
 
-  const { createServer } = require(path.resolve(rootDir, 'server.js'))
+  const { createServer } = await import(path.resolve(rootDir, 'server.js'))
   const { app, vite } = await createServer(rootDir, hmrPorts['ssr-html'])
 
   return new Promise((resolve, reject) => {

playground/ssr-html/package.json

@@ -2,6 +2,7 @@
   "name": "test-ssr-html",
   "private": true,
   "version": "0.0.0",
+  "type": "module",
   "scripts": {
     "dev": "node server",
     "serve": "cross-env NODE_ENV=production node server",

playground/ssr-html/server.js

@@ -1,8 +1,9 @@
-// @ts-check
-const fs = require('fs')
-const path = require('path')
-const express = require('express')
+import fs from 'fs'
+import path from 'path'
+import { fileURLToPath } from 'url'
+import express from 'express'
 
+const __dirname = path.dirname(fileURLToPath(import.meta.url))
 const isTest = process.env.NODE_ENV === 'test' || !!process.env.VITE_TEST_BUILD
 
 const DYNAMIC_SCRIPTS = `
@@ -22,16 +23,15 @@ const DYNAMIC_STYLES = `
   </style>
 `
 
-async function createServer(root = process.cwd(), hmrPort) {
+export async function createServer(root = process.cwd(), hmrPort) {
   const resolve = (p) => path.resolve(__dirname, p)
 
   const app = express()
 
   /**
    * @type {import('vite').ViteDevServer}
    */
-  let vite
-  vite = await require('vite').createServer({
+  const vite = await (await import('vite')).createServer({
     root,
     logLevel: isTest ? 'error' : 'info',
     server: {
@@ -93,6 +93,3 @@ if (!isTest) {
     })
   )
 }
-
-// for test use
-exports.createServer = createServer

playground/ssr-pug/__tests__/serve.ts

@@ -10,7 +10,7 @@ export const port = ports['ssr-pug']
 export async function serve() {
   await kill(port)
 
-  const { createServer } = require(path.resolve(rootDir, 'server.js'))
+  const { createServer } = await import(path.resolve(rootDir, 'server.js'))
   const { app, vite } = await createServer(rootDir, hmrPorts['ssr-pug'])
 
   return new Promise((resolve, reject) => {

playground/ssr-pug/package.json

@@ -2,6 +2,7 @@
   "name": "test-ssr-pug",
   "private": true,
   "version": "0.0.0",
+  "type": "module",
   "scripts": {
     "dev": "node server",
     "serve": "cross-env NODE_ENV=production node server",

playground/ssr-pug/server.js

@@ -1,7 +1,10 @@
 // @ts-check
-const path = require('path')
-const pug = require('pug')
-const express = require('express')
+import path from 'path'
+import { fileURLToPath } from 'url'
+import pug from 'pug'
+import express from 'express'
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url))
 
 const isTest = process.env.NODE_ENV === 'test' || !!process.env.VITE_TEST_BUILD
 
@@ -14,16 +17,15 @@ const DYNAMIC_SCRIPTS = `
   <script type="module" src="/src/app.js"></script>
 `
 
-async function createServer(root = process.cwd(), hmrPort) {
+export async function createServer(root = process.cwd(), hmrPort) {
   const resolve = (p) => path.resolve(__dirname, p)
 
   const app = express()
 
   /**
    * @type {import('vite').ViteDevServer}
    */
-  let vite
-  vite = await require('vite').createServer({
+  const vite = await (await import('vite')).createServer({
     root,
     logLevel: isTest ? 'error' : 'info',
     server: {
@@ -71,6 +73,3 @@ if (!isTest) {
     })
   )
 }
-
-// for test use
-exports.createServer = createServer

playground/ssr-react/__tests__/serve.ts

@@ -29,14 +29,19 @@ export async function serve() {
       build: {
         target: 'esnext',
         ssr: 'src/entry-server.jsx',
-        outDir: 'dist/server'
+        outDir: 'dist/server',
+        rollupOptions: {
+          output: {
+            entryFileNames: 'entry-server.cjs'
+          }
+        }
       }
     })
   }
 
   await kill(port)
 
-  const { createServer } = require(path.resolve(rootDir, 'server.js'))
+  const { createServer } = await import(path.resolve(rootDir, 'server.js'))
   const { app, vite } = await createServer(
     rootDir,
     isBuild,

playground/ssr-react/package.json

@@ -2,6 +2,7 @@
   "name": "test-ssr-react",
   "private": true,
   "version": "0.0.0",
+  "type": "module",
   "scripts": {
     "dev": "node server",
     "build": "npm run build:client && npm run build:server",

playground/ssr-react/prerender.js

@@ -1,13 +1,15 @@
 // Pre-render the app into static HTML.
 // run `yarn generate` and then `dist/static` can be served as a static site.
 
-const fs = require('fs')
-const path = require('path')
+import fs from 'fs'
+import path from 'path'
+import { fileURLToPath } from 'url'
 
+const __dirname = path.dirname(fileURLToPath(import.meta.url))
 const toAbsolute = (p) => path.resolve(__dirname, p)
 
 const template = fs.readFileSync(toAbsolute('dist/static/index.html'), 'utf-8')
-const { render } = require('./dist/server/entry-server.js')
+const { render } = await import('./dist/server/entry-server.js')
 
 // determine routes to pre-render from src/pages
 const routesToPrerender = fs

playground/ssr-react/server.js

@@ -1,13 +1,15 @@
-// @ts-check
-const fs = require('fs')
-const path = require('path')
-const express = require('express')
+import fs from 'fs'
+import path from 'path'
+import { fileURLToPath } from 'url'
+import express from 'express'
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url))
 
 const isTest = process.env.NODE_ENV === 'test' || !!process.env.VITE_TEST_BUILD
 
 process.env.MY_CUSTOM_SECRET = 'API_KEY_qwertyuiop'
 
-async function createServer(
+export async function createServer(
   root = process.cwd(),
   isProd = process.env.NODE_ENV === 'production',
   hmrPort
@@ -25,7 +27,7 @@ async function createServer(
    */
   let vite
   if (!isProd) {
-    vite = await require('vite').createServer({
+    vite = await (await import('vite')).createServer({
       root,
       logLevel: isTest ? 'error' : 'info',
       server: {
@@ -44,9 +46,9 @@ async function createServer(
     // use vite's connect instance as middleware
     app.use(vite.middlewares)
   } else {
-    app.use(require('compression')())
+    app.use((await import('compression')).default())
     app.use(
-      require('serve-static')(resolve('dist/client'), {
+      (await import('serve-static')).default(resolve('dist/client'), {
         index: false
       })
     )
@@ -65,7 +67,7 @@ async function createServer(
       } else {
         template = indexProd
         // @ts-ignore
-        render = require('./dist/server/entry-server.js').render
+        render = (await import('./dist/server/entry-server.cjs')).render
       }
 
       const context = {}
@@ -96,6 +98,3 @@ if (!isTest) {
     })
   )
 }
-
-// for test use
-exports.createServer = createServer

playground/ssr-react/vite.config.js

@@ -1,11 +1,12 @@
-const react = require('@vitejs/plugin-react')
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react'
 
-/**
- * @type {import('vite').UserConfig}
- */
-module.exports = {
+export default defineConfig({
   plugins: [react()],
   build: {
     minify: false
+  },
+  ssr: {
+    target: 'node-cjs'
   }
-}
+})

playground/ssr-vue/__tests__/serve.ts

@@ -36,7 +36,7 @@ export async function serve() {
 
   await kill(port)
 
-  const { createServer } = require(path.resolve(rootDir, 'server.js'))
+  const { createServer } = await import(path.resolve(rootDir, 'server.js'))
   const { app, vite } = await createServer(
     rootDir,
     isBuild,

playground/ssr-vue/__tests__/ssr-vue.spec.ts

@@ -183,10 +183,10 @@ test.runIf(isBuild)('dynamic css file should be preloaded', async () => {
   const homeHtml = await (await fetch(url)).text()
   const re = /link rel="modulepreload".*?href="\/assets\/(Home\.\w{8}\.js)"/
   const filename = re.exec(homeHtml)[1]
-  const manifest = require(resolve(
+  const manifest = (await import(resolve(
     process.cwd(),
     './playground-temp/ssr-vue/dist/client/ssr-manifest.json'
-  ))
+  ))).default
   const depFile = manifest[filename]
   for (const file of depFile) {
     expect(homeHtml).toMatch(file)

playground/ssr-vue/package.json

@@ -2,6 +2,7 @@
   "name": "test-ssr-vue",
   "private": true,
   "version": "0.0.0",
+  "type": "module",
   "scripts": {
     "dev": "node server",
     "build": "npm run build:client && npm run build:server",

playground/ssr-vue/prerender.js

@@ -1,14 +1,14 @@
 // Pre-render the app into static HTML.
 // run `npm run generate` and then `dist/static` can be served as a static site.
 
-const fs = require('fs')
-const path = require('path')
+import fs from 'fs'
+import path from 'path'
 
 const toAbsolute = (p) => path.resolve(__dirname, p)
 
-const manifest = require('./dist/static/ssr-manifest.json')
+const manifest = (await import('./dist/static/ssr-manifest.json')).default
 const template = fs.readFileSync(toAbsolute('dist/static/index.html'), 'utf-8')
-const { render } = require('./dist/server/entry-server.js')
+const { render } = await import('./dist/server/entry-server.js')
 
 // determine routes to pre-render from src/pages
 const routesToPrerender = fs