From 2e88ef5b50110da05e451f45f4b8407226cf690d Mon Sep 17 00:00:00 2001
From: untp <54450843+untp@users.noreply.github.com>
Date: Sun, 19 Sep 2021 17:57:13 +0300
Subject: [PATCH] test: SSR externals on Windows #4980 (#4986)

---
 .../ssr-vue/__tests__/ssr-vue.spec.ts         | 25 +++++++++++++++++++
 .../ExampleExternalComponent.vue              |  3 +++
 .../example-external-component/index.js       |  3 +++
 .../example-external-component/package.json   |  6 +++++
 packages/playground/ssr-vue/package.json      |  1 +
 .../playground/ssr-vue/src/pages/External.vue | 13 ++++++++++
 6 files changed, 51 insertions(+)
 create mode 100644 packages/playground/ssr-vue/example-external-component/ExampleExternalComponent.vue
 create mode 100644 packages/playground/ssr-vue/example-external-component/index.js
 create mode 100644 packages/playground/ssr-vue/example-external-component/package.json
 create mode 100644 packages/playground/ssr-vue/src/pages/External.vue

diff --git a/packages/playground/ssr-vue/__tests__/ssr-vue.spec.ts b/packages/playground/ssr-vue/__tests__/ssr-vue.spec.ts
index a86916b1ad7594..6dc327d479713f 100644
--- a/packages/playground/ssr-vue/__tests__/ssr-vue.spec.ts
+++ b/packages/playground/ssr-vue/__tests__/ssr-vue.spec.ts
@@ -32,6 +32,31 @@ test('/about', async () => {
   }
 })
 
+test('/external', async () => {
+  await page.goto(url + '/external')
+  expect(await page.textContent('div')).toMatch('Example external component content')
+  // should not have hydration mismatch
+  browserLogs.forEach((msg) => {
+    expect(msg).not.toMatch('mismatch')
+  })
+
+  // fetch sub route
+  const externalHtml = await (await fetch(url + '/external')).text()
+  expect(externalHtml).toMatch('Example external component content')
+  if (isBuild) {
+    // assert correct preload directive generation for async chunks and CSS
+    expect(externalHtml).not.toMatch(
+      /link rel="modulepreload".*?href="\/assets\/Home\.\w{8}\.js"/
+    )
+    expect(externalHtml).not.toMatch(
+      /link rel="stylesheet".*?href="\/assets\/Home\.\w{8}\.css"/
+    )
+    expect(externalHtml).toMatch(
+      /link rel="modulepreload".*?href="\/assets\/External\.\w{8}\.js"/
+    )
+  }
+})
+
 test('/', async () => {
   await page.goto(url)
   expect(await page.textContent('h1')).toMatch('Home')
diff --git a/packages/playground/ssr-vue/example-external-component/ExampleExternalComponent.vue b/packages/playground/ssr-vue/example-external-component/ExampleExternalComponent.vue
new file mode 100644
index 00000000000000..93a9e89dc25ca9
--- /dev/null
+++ b/packages/playground/ssr-vue/example-external-component/ExampleExternalComponent.vue
@@ -0,0 +1,3 @@
+<template>
+  <div>Example external component content</div>
+</template>
diff --git a/packages/playground/ssr-vue/example-external-component/index.js b/packages/playground/ssr-vue/example-external-component/index.js
new file mode 100644
index 00000000000000..d9c9aefa2f2a23
--- /dev/null
+++ b/packages/playground/ssr-vue/example-external-component/index.js
@@ -0,0 +1,3 @@
+import ExampleExternalComponent from './ExampleExternalComponent.vue'
+
+export default ExampleExternalComponent
diff --git a/packages/playground/ssr-vue/example-external-component/package.json b/packages/playground/ssr-vue/example-external-component/package.json
new file mode 100644
index 00000000000000..474bdda28eb0a4
--- /dev/null
+++ b/packages/playground/ssr-vue/example-external-component/package.json
@@ -0,0 +1,6 @@
+{
+  "name": "example-external-component",
+  "private": true,
+  "version": "0.0.0",
+  "main": "index.js"
+}
diff --git a/packages/playground/ssr-vue/package.json b/packages/playground/ssr-vue/package.json
index 5115e4f0fa439a..2be992518296d4 100644
--- a/packages/playground/ssr-vue/package.json
+++ b/packages/playground/ssr-vue/package.json
@@ -14,6 +14,7 @@
     "debug": "node --inspect-brk server"
   },
   "dependencies": {
+    "example-external-component": "file:example-external-component",
     "vue": "^3.2.6",
     "vue-router": "^4.0.3"
   },
diff --git a/packages/playground/ssr-vue/src/pages/External.vue b/packages/playground/ssr-vue/src/pages/External.vue
new file mode 100644
index 00000000000000..fd78b866bb3d95
--- /dev/null
+++ b/packages/playground/ssr-vue/src/pages/External.vue
@@ -0,0 +1,13 @@
+<template>
+  <ExampleExternalComponent />
+</template>
+
+<script>
+import ExampleExternalComponent from 'example-external-component'
+
+export default {
+  components: {
+    ExampleExternalComponent
+  }
+}
+</script>