From 8691daf31a7d6235193b7b78660357721c9dc089 Mon Sep 17 00:00:00 2001
From: Bogdan Luca <luca.bogdan@gmail.com>
Date: Mon, 13 Jan 2020 15:20:53 +0200
Subject: [PATCH] fix: use a single websocket connection for HMR (#5069)

* fix(hmr-websocket): add failing test

* fix(hmr-websocket): set injectClient to false, as we inject our own client

* fix(hmr-websocket): change test project name
---
 packages/@vue/cli-service/__tests__/serve.spec.js  | 14 ++++++++++++++
 packages/@vue/cli-service/lib/commands/serve.js    |  1 +
 packages/@vue/cli-test-utils/launchPuppeteer.js    |  9 ++++++++-
 packages/@vue/cli-test-utils/serveWithPuppeteer.js |  5 +++--
 4 files changed, 26 insertions(+), 3 deletions(-)

diff --git a/packages/@vue/cli-service/__tests__/serve.spec.js b/packages/@vue/cli-service/__tests__/serve.spec.js
index 717d03897c..083f6fd69e 100644
--- a/packages/@vue/cli-service/__tests__/serve.spec.js
+++ b/packages/@vue/cli-service/__tests__/serve.spec.js
@@ -180,3 +180,17 @@ test('dart sass', async () => {
   // should build successfully
   await project.run('vue-cli-service build')
 })
+
+test('use a single websocket connection for HMR', async () => {
+  const project = await create('e2e-serve-hmr', defaultPreset)
+
+  await serve(
+    () => project.run('vue-cli-service serve'),
+    async ({ helpers, requestUrls }) => {
+      const msg = `Welcome to Your Vue.js App`
+      expect(await helpers.getText('h1')).toMatch(msg)
+
+      expect(requestUrls.filter(url => url.includes('sockjs-node')).length).toBe(1)
+    }
+  )
+})
diff --git a/packages/@vue/cli-service/lib/commands/serve.js b/packages/@vue/cli-service/lib/commands/serve.js
index 2b7dbfb801..f08df1ac8b 100644
--- a/packages/@vue/cli-service/lib/commands/serve.js
+++ b/packages/@vue/cli-service/lib/commands/serve.js
@@ -172,6 +172,7 @@ module.exports = (api, options) => {
       contentBase: api.resolve('public'),
       watchContentBase: !isProduction,
       hot: !isProduction,
+      injectClient: false,
       compress: isProduction,
       publicPath: options.publicPath,
       overlay: isProduction // TODO disable this
diff --git a/packages/@vue/cli-test-utils/launchPuppeteer.js b/packages/@vue/cli-test-utils/launchPuppeteer.js
index 014e29ca7f..9d11bbb800 100644
--- a/packages/@vue/cli-test-utils/launchPuppeteer.js
+++ b/packages/@vue/cli-test-utils/launchPuppeteer.js
@@ -9,9 +9,16 @@ module.exports = async function launchPuppeteer (url) {
   const page = await browser.newPage()
 
   const logs = []
+  const requestUrls = []
   page.on('console', msg => logs.push(msg.text()))
 
+  await page.setRequestInterception(true)
+  page.on('request', interceptedRequest => {
+    requestUrls.push(interceptedRequest.url())
+    interceptedRequest.continue()
+  })
+
   await page.goto(url)
 
-  return { browser, page, logs }
+  return { browser, page, logs, requestUrls }
 }
diff --git a/packages/@vue/cli-test-utils/serveWithPuppeteer.js b/packages/@vue/cli-test-utils/serveWithPuppeteer.js
index 2477d038c0..2763036dff 100644
--- a/packages/@vue/cli-test-utils/serveWithPuppeteer.js
+++ b/packages/@vue/cli-test-utils/serveWithPuppeteer.js
@@ -44,7 +44,7 @@ module.exports = async function serveWithPuppeteer (serve, test, noPuppeteer) {
             await test({ url })
           } else {
             // start browser
-            const { page, browser } = await launchPuppeteer(url)
+            const { page, browser, requestUrls } = await launchPuppeteer(url)
             activeBrowser = browser
 
             const helpers = createHelpers(page)
@@ -54,7 +54,8 @@ module.exports = async function serveWithPuppeteer (serve, test, noPuppeteer) {
               page,
               url,
               nextUpdate,
-              helpers
+              helpers,
+              requestUrls
             })
 
             await browser.close()