test: fix server hmr port conflict (#8197)

vitejs · May 17, 2022 · 8d478df · 8d478df
1 parent 0858450
commit 8d478df
Show file tree

Hide file tree

Showing 13 changed files with 60 additions and 28 deletions.
diff --git a/playground/optimize-missing-deps/__test__/serve.ts b/playground/optimize-missing-deps/__test__/serve.ts
@@ -2,13 +2,16 @@
 // the default e2e test serve behavior
 
 import path from 'path'
-import { isBuild, ports, rootDir } from '~utils'
+import { hmrPorts, ports, rootDir } from '~utils'
 
 export const port = ports['optimize-missing-deps']
 
 export async function serve() {
   const { createServer } = require(path.resolve(rootDir, 'server.js'))
-  const { app, vite } = await createServer(rootDir, isBuild)
+  const { app, vite } = await createServer(
+    rootDir,
+    hmrPorts['optimize-missing-deps']
+  )
 
   return new Promise((resolve, reject) => {
     try {

diff --git a/playground/optimize-missing-deps/server.js b/playground/optimize-missing-deps/server.js
@@ -5,7 +5,7 @@ const express = require('express')
 
 const isTest = process.env.NODE_ENV === 'test' || !!process.env.VITE_TEST_BUILD
 
-async function createServer(root = process.cwd()) {
+async function createServer(root = process.cwd(), hmrPort) {
   const resolve = (p) => path.resolve(__dirname, p)
 
   const app = express()
@@ -16,7 +16,12 @@ async function createServer(root = process.cwd()) {
   const vite = await require('vite').createServer({
     root,
     logLevel: isTest ? 'error' : 'info',
-    server: { middlewareMode: 'ssr' }
+    server: {
+      middlewareMode: 'ssr',
+      hmr: {
+        port: hmrPort
+      }
+    }
   })
   app.use(vite.middlewares)
 

diff --git a/playground/ssr-deps/__tests__/serve.ts b/playground/ssr-deps/__tests__/serve.ts
@@ -3,15 +3,15 @@
 
 import path from 'path'
 import kill from 'kill-port'
-import { isBuild, ports, rootDir } from '~utils'
+import { hmrPorts, ports, rootDir } from '~utils'
 
 export const port = ports['ssr-deps']
 
 export async function serve() {
   await kill(port)
 
   const { createServer } = require(path.resolve(rootDir, 'server.js'))
-  const { app, vite } = await createServer(rootDir, isBuild)
+  const { app, vite } = await createServer(rootDir, hmrPorts['ssr-deps'])
 
   return new Promise((resolve, reject) => {
     try {

diff --git a/playground/ssr-deps/server.js b/playground/ssr-deps/server.js
@@ -5,10 +5,7 @@ const express = require('express')
 
 const isTest = process.env.NODE_ENV === 'test' || !!process.env.VITE_TEST_BUILD
 
-async function createServer(
-  root = process.cwd(),
-  isProd = process.env.NODE_ENV === 'production'
-) {
+async function createServer(root = process.cwd(), hmrPort) {
   const resolve = (p) => path.resolve(__dirname, p)
 
   const app = express()
@@ -26,6 +23,9 @@ async function createServer(
         // misses change events, so enforce polling for consistency
         usePolling: true,
         interval: 100
+      },
+      hmr: {
+        port: hmrPort
       }
     }
   })

diff --git a/playground/ssr-html/__tests__/serve.ts b/playground/ssr-html/__tests__/serve.ts
@@ -3,15 +3,15 @@
 
 import path from 'path'
 import kill from 'kill-port'
-import { isBuild, ports, rootDir } from '~utils'
+import { hmrPorts, ports, rootDir } from '~utils'
 
 export const port = ports['ssr-html']
 
 export async function serve() {
   await kill(port)
 
   const { createServer } = require(path.resolve(rootDir, 'server.js'))
-  const { app, vite } = await createServer(rootDir, isBuild)
+  const { app, vite } = await createServer(rootDir, hmrPorts['ssr-html'])
 
   return new Promise((resolve, reject) => {
     try {

diff --git a/playground/ssr-html/server.js b/playground/ssr-html/server.js
@@ -22,10 +22,7 @@ const DYNAMIC_STYLES = `
   </style>
 `
 
-async function createServer(
-  root = process.cwd(),
-  isProd = process.env.NODE_ENV === 'production'
-) {
+async function createServer(root = process.cwd(), hmrPort) {
   const resolve = (p) => path.resolve(__dirname, p)
 
   const app = express()
@@ -44,6 +41,9 @@ async function createServer(
         // misses change events, so enforce polling for consistency
         usePolling: true,
         interval: 100
+      },
+      hmr: {
+        port: hmrPort
       }
     }
   })

diff --git a/playground/ssr-pug/__tests__/serve.ts b/playground/ssr-pug/__tests__/serve.ts
@@ -3,15 +3,15 @@
 
 import path from 'path'
 import kill from 'kill-port'
-import { isBuild, ports, rootDir } from '~utils'
+import { hmrPorts, ports, rootDir } from '~utils'
 
 export const port = ports['ssr-pug']
 
 export async function serve() {
   await kill(port)
 
   const { createServer } = require(path.resolve(rootDir, 'server.js'))
-  const { app, vite } = await createServer(rootDir, isBuild)
+  const { app, vite } = await createServer(rootDir, hmrPorts['ssr-pug'])
 
   return new Promise((resolve, reject) => {
     try {

diff --git a/playground/ssr-pug/server.js b/playground/ssr-pug/server.js
@@ -14,10 +14,7 @@ const DYNAMIC_SCRIPTS = `
   <script type="module" src="/src/app.js"></script>
 `
 
-async function createServer(
-  root = process.cwd(),
-  isProd = process.env.NODE_ENV === 'production'
-) {
+async function createServer(root = process.cwd(), hmrPort) {
   const resolve = (p) => path.resolve(__dirname, p)
 
   const app = express()
@@ -36,6 +33,9 @@ async function createServer(
         // misses change events, so enforce polling for consistency
         usePolling: true,
         interval: 100
+      },
+      hmr: {
+        port: hmrPort
       }
     }
   })

diff --git a/playground/ssr-react/__tests__/serve.ts b/playground/ssr-react/__tests__/serve.ts
@@ -3,7 +3,7 @@
 
 import path from 'path'
 import kill from 'kill-port'
-import { isBuild, ports, rootDir } from '~utils'
+import { hmrPorts, isBuild, ports, rootDir } from '~utils'
 
 export const port = ports['ssr-react']
 
@@ -37,7 +37,11 @@ export async function serve() {
   await kill(port)
 
   const { createServer } = require(path.resolve(rootDir, 'server.js'))
-  const { app, vite } = await createServer(rootDir, isBuild)
+  const { app, vite } = await createServer(
+    rootDir,
+    isBuild,
+    hmrPorts['ssr-react']
+  )
 
   return new Promise((resolve, reject) => {
     try {

diff --git a/playground/ssr-react/server.js b/playground/ssr-react/server.js
@@ -9,7 +9,8 @@ process.env.MY_CUSTOM_SECRET = 'API_KEY_qwertyuiop'
 
 async function createServer(
   root = process.cwd(),
-  isProd = process.env.NODE_ENV === 'production'
+  isProd = process.env.NODE_ENV === 'production',
+  hmrPort
 ) {
   const resolve = (p) => path.resolve(__dirname, p)
 
@@ -34,6 +35,9 @@ async function createServer(
           // misses change events, so enforce polling for consistency
           usePolling: true,
           interval: 100
+        },
+        hmr: {
+          port: hmrPort
         }
       }
     })

diff --git a/playground/ssr-vue/__tests__/serve.ts b/playground/ssr-vue/__tests__/serve.ts
@@ -3,7 +3,7 @@
 
 import path from 'path'
 import kill from 'kill-port'
-import { isBuild, ports, rootDir } from '~utils'
+import { hmrPorts, isBuild, ports, rootDir } from '~utils'
 
 export const port = ports['ssr-vue']
 
@@ -37,7 +37,11 @@ export async function serve() {
   await kill(port)
 
   const { createServer } = require(path.resolve(rootDir, 'server.js'))
-  const { app, vite } = await createServer(rootDir, isBuild)
+  const { app, vite } = await createServer(
+    rootDir,
+    isBuild,
+    hmrPorts['ssr-vue']
+  )
 
   return new Promise((resolve, reject) => {
     try {

diff --git a/playground/ssr-vue/server.js b/playground/ssr-vue/server.js
@@ -7,7 +7,8 @@ const isTest = process.env.NODE_ENV === 'test' || !!process.env.VITE_TEST_BUILD
 
 async function createServer(
   root = process.cwd(),
-  isProd = process.env.NODE_ENV === 'production'
+  isProd = process.env.NODE_ENV === 'production',
+  hmrPort
 ) {
   const resolve = (p) => path.resolve(__dirname, p)
 
@@ -37,6 +38,9 @@ async function createServer(
           // misses change events, so enforce polling for consistency
           usePolling: true,
           interval: 100
+        },
+        hmr: {
+          port: hmrPort
         }
       }
     })

diff --git a/playground/test-utils.ts b/playground/test-utils.ts
@@ -34,6 +34,14 @@ export const ports = {
   'css/postcss-caching': 5005,
   'css/postcss-plugins-different-dir': 5006
 }
+export const hmrPorts = {
+  'optimize-missing-deps': 24680,
+  'ssr-deps': 24681,
+  'ssr-html': 24682,
+  'ssr-pug': 24683,
+  'ssr-react': 24684,
+  'ssr-vue': 24685
+}
 
 const hexToNameMap: Record<string, string> = {}
 Object.keys(colors).forEach((color) => {