test: 单元测试覆盖0.4.0

micro-zoe · Oct 17, 2021 · 1f0e2b5 · 1f0e2b5
1 parent 0b48d46
commit 1f0e2b5
Show file tree

Hide file tree

Showing 29 changed files with 166 additions and 60 deletions.
diff --git a/examples/children/react16/src/index.js b/examples/children/react16/src/index.js
@@ -97,3 +97,8 @@ if (window.__MICRO_APP_ENVIRONMENT__) {
 // setInterval(() => {
 // console.log(`子应用${window.__MICRO_APP_NAME__}的setInterval`)
 // }, 1000)
+
+// const dynamicScript1 = document.createElement('script')
+// dynamicScript1.setAttribute('type', 'module')
+// dynamicScript1.textContent = 'console.warn("inline module")'
+// document.head.appendChild(dynamicScript1)
diff --git a/examples/children/vite/src/main.js b/examples/children/vite/src/main.js
@@ -14,6 +14,32 @@ const router = VueRouter.createRouter({
  routes,
 })
 
-const app = createApp(App)
-app.use(router)
-app.mount('#vite-app')
+// const app = createApp(App)
+// app.use(router)
+// app.mount('#vite-app')
+
+
+let app = null
+// 将渲染操作放入 mount 函数
+function mount () {
+ app = createApp(App)
+ app.use(router)
+ app.mount('#vite-app')
+
+ console.log('微应用child-vite渲染了')
+}
+
+// 将卸载操作放入 unmount 函数
+function unmount () {
+ app.unmount()
+ app = null
+ console.log('微应用child-vite卸载了')
+}
+
+// 微前端环境下，注册mount和unmount方法
+if (window.__MICRO_APP_BASE_APPLICATION__) {
+ window['micro-app-vite'] = { mount, unmount }
+} else {
+ // 非微前端环境直接渲染
+ mount()
+}
diff --git a/src/__tests__/common.ts → src/__tests__/common/initial.ts b/src/__tests__/common.ts → src/__tests__/common/initial.ts
@@ -1,7 +1,7 @@
 /* eslint-disable promise/param-names */
 import '@webcomponents/webcomponentsjs/custom-elements-es5-adapter'
-import { setCurrentAppName, defer } from '../libs/utils'
-const liveServer = require('../../scripts/test_server')
+import { setCurrentAppName, defer } from '../../libs/utils'
+const liveServer = require('../../../scripts/test_server')
 global.fetch = require('node-fetch')
 jest.useRealTimers()
 

diff --git a/src/__tests__/common/set_ssr_env.ts b/src/__tests__/common/set_ssr_env.ts
@@ -0,0 +1,3 @@
+Object.defineProperty(global, 'window', {
+ value: undefined,
+})
diff --git a/src/__tests__/create_app.test.ts b/src/__tests__/create_app.test.ts
@@ -1,5 +1,5 @@
 /* eslint-disable promise/param-names */
-import { commonStartEffect, releaseAllEffect, ports } from './common'
+import { commonStartEffect, releaseAllEffect, ports } from './common/initial'
 import { appInstanceMap } from '../create_app'
 import { appStatus } from '../constants'
 import microApp from '..'

diff --git a/src/__tests__/demo/common/index.html b/src/__tests__/demo/common/index.html
@@ -24,6 +24,11 @@
  <script>
  console.warn('common-内联script')
  </script>
+ <!-- 忽略，不做任何处理，但因为模版script不会被浏览器解析，也导致它无法执行 -->
+ <script ignore>console.log('ignore')</script>
+ <script type='application/json'>
+ window.abc = {}
+ </script>
  <title>common</title>
 </head>
 <body>

diff --git a/src/__tests__/demo/common/script2.js b/src/__tests__/demo/common/script2.js
@@ -2,3 +2,10 @@
 const pdom = document.createElement('p')
 pdom.innerText = '22222'
 document.querySelectorAll('body')[0].append('11111', pdom)
+
+// 动态创建的 ignore 类型script保留原有特性，不会被处理
+const dynamicIgnoreScript = document.createElement('script')
+dynamicIgnoreScript.setAttribute('ignore', 'true')
+dynamicIgnoreScript.textContent = 'window.ignoreInjectData = 1'
+document.body.appendChild(dynamicIgnoreScript)
+expect(((0, eval)('window')).ignoreInjectData).toBe(1)
diff --git a/src/__tests__/interact/index.test.ts b/src/__tests__/interact/index.test.ts
@@ -7,7 +7,7 @@ import {
  rebuildDataCenterSnapshot,
 } from '../../interact'
 import { defer } from '../../libs/utils'
-import { rewriteConsole, releaseConsole } from '../common'
+import { rewriteConsole, releaseConsole } from '../common/initial'
 import CreateApp, { appInstanceMap } from '../../create_app'
 
 describe('data center', () => {

diff --git a/src/__tests__/interact/lifecycles_event.test.ts b/src/__tests__/interact/lifecycles_event.test.ts
@@ -1,5 +1,5 @@
 /* eslint-disable promise/param-names */
-import { commonStartEffect, releaseAllEffect, ports } from '../common'
+import { commonStartEffect, releaseAllEffect, ports } from '../common/initial'
 import microApp from '../..'
 
 describe('lifecycles_event', () => {

diff --git a/src/__tests__/libs/additional.test.ts b/src/__tests__/libs/additional.test.ts
@@ -1,8 +1,11 @@
 import { listenUmountOfNestedApp, replaseUnmountOfNestedApp } from '../../libs/additional'
 import CreateApp, { appInstanceMap } from '../../create_app'
+import { elementInstanceMap } from '../../micro_app_element'
 
 describe('test additional', () => {
+ // 卸载循环内嵌的子应用
  test('unmount app loop build-in', () => {
+ // test-app1模拟开启shadowRoot的未卸载孙应用
  const con1 = document.createElement('micro-app')
  // @ts-ignore
  con1.disconnectedCallback = jest.fn
@@ -15,7 +18,9 @@ describe('test additional', () => {
  container: con1.shadowRoot,
  }
  appInstanceMap.set('test-app1', app1 as CreateApp)
+ elementInstanceMap.set(con1, true)
 
+ // test-app2模拟正常未卸载孙应用
  const con2 = document.createElement('micro-app')
  // @ts-ignore
  con2.disconnectedCallback = jest.fn
@@ -27,7 +32,9 @@ describe('test additional', () => {
  container: con2,
  }
  appInstanceMap.set('test-app2', app2 as CreateApp)
+ elementInstanceMap.set(con2, true)
 
+ // test-app3模拟已卸载孙应用(没有container)
  const app3 = {
  name: 'test-app3',
  url: 'http://localhost:3000/',
@@ -38,17 +45,46 @@ describe('test additional', () => {
 
  expect(appInstanceMap.size).toBe(3)
 
+ // 模拟非嵌套循环
  replaseUnmountOfNestedApp()
  listenUmountOfNestedApp()
 
+ // 模拟嵌套循环
  window.__MICRO_APP_ENVIRONMENT__ = true
  replaseUnmountOfNestedApp()
  listenUmountOfNestedApp()
+
+ // 模拟当前应用被卸载
  const event = new CustomEvent('unmount')
  window.dispatchEvent(event)
 
  expect(appInstanceMap.size).toBe(0)
 
  window.__MICRO_APP_ENVIRONMENT__ = false
  })
+
+ // 分支覆盖
+ test('coverage of branch', () => {
+ // test-app4模已卸载孙应用
+ const app1 = {
+ name: 'test-app4',
+ url: 'http://localhost:3000/',
+ scopecss: true,
+ useSandbox: true,
+ }
+ appInstanceMap.set('test-app4', app1 as CreateApp)
+
+ // 模拟嵌套循环
+ window.__MICRO_APP_ENVIRONMENT__ = true
+ window.__MICRO_APP_UMD_MODE__ = true // 设置为umd模式
+ replaseUnmountOfNestedApp()
+ listenUmountOfNestedApp()
+
+ // 模拟当前应用被卸载
+ const event = new CustomEvent('unmount')
+ window.dispatchEvent(event)
+
+ // umd模式不清空appInstanceMap
+ expect(appInstanceMap.size).toBe(1)
+ })
 })
diff --git a/src/__tests__/libs/utils.test.ts b/src/__tests__/libs/utils.test.ts
@@ -1,6 +1,6 @@
 /* eslint-disable promise/param-names */
 import * as Utils from '../../libs/utils'
-import { rewriteConsole, releaseConsole } from '../common'
+import { rewriteConsole, releaseConsole } from '../common/initial'
 
 beforeAll(() => {
  rewriteConsole()
@@ -134,7 +134,7 @@ test('polyfill for requestIdleCallback', async () => {
 
  // polyfill
  const mockFn2 = jest.fn()
- Utils.requestIdleCallback((param) => {
+ Utils.requestIdleCallback((param: any) => {
  mockFn2()
  expect(param.didTimeout).toBeFalsy()
  expect(param.timeRemaining()).toBeLessThan(51)

diff --git a/src/__tests__/main.test.ts b/src/__tests__/main.test.ts
@@ -1,5 +1,5 @@
 /* eslint-disable promise/param-names, no-console */
-import { commonStartEffect, releaseAllEffect, ports } from './common'
+import { commonStartEffect, releaseAllEffect, ports } from './common/initial'
 import microApp, { preFetch, removeDomScope, version, pureCreateElement } from '..'
 import { appInstanceMap } from '../create_app'
 import { getCurrentAppName, defer } from '../libs/utils'

diff --git a/src/__tests__/micro_app_element.test.ts b/src/__tests__/micro_app_element.test.ts
@@ -1,5 +1,5 @@
 /* eslint-disable promise/param-names */
-import { commonStartEffect, releaseAllEffect, ports } from './common'
+import { commonStartEffect, releaseAllEffect, ports } from './common/initial'
 import { appInstanceMap } from '../create_app'
 import microApp from '..'
 import { defer } from '../libs/utils'
@@ -246,4 +246,19 @@ describe('micro_app_element', () => {
  }, false)
  })
  })
+
+ // 先插入micro-app元素，后设置name、url属性
+ test('set name & url after connectedCallback', async () => {
+ const microappElement15 = document.createElement('micro-app')
+ appCon.appendChild(microappElement15)
+
+ microappElement15.setAttribute('name', 'test-app15')
+ microappElement15.setAttribute('url', `http://127.0.0.1:${ports.micro_app_element}/common/`)
+
+ await new Promise((reslove) => {
+ microappElement15.addEventListener('mounted', () => {
+ reslove(true)
+ }, false)
+ })
+ })
 })
diff --git a/src/__tests__/prefetch.test.ts b/src/__tests__/prefetch.test.ts
@@ -1,5 +1,5 @@
 /* eslint-disable promise/param-names */
-import { commonStartEffect, releaseAllEffect, ports } from './common'
+import { commonStartEffect, releaseAllEffect, ports } from './common/initial'
 import microApp from '..'
 import preFetch from '../prefetch'
 import { globalLinks } from '../source/links'

diff --git a/src/__tests__/sandbox/effect.test.ts b/src/__tests__/sandbox/effect.test.ts
@@ -1,5 +1,5 @@
 /* eslint-disable promise/param-names */
-import { commonStartEffect, releaseAllEffect, ports } from '../common'
+import { commonStartEffect, releaseAllEffect, ports } from '../common/initial'
 import { appInstanceMap } from '../../create_app'
 import microApp from '../..'
 // import { defer } from '../../src/libs/utils'

diff --git a/src/__tests__/sandbox/effect2.test.ts b/src/__tests__/sandbox/effect2.test.ts
@@ -1,5 +1,5 @@
 /* eslint-disable promise/param-names */
-import { commonStartEffect, releaseAllEffect, ports } from '../common'
+import { commonStartEffect, releaseAllEffect, ports } from '../common/initial'
 import { appInstanceMap } from '../../create_app'
 import microApp from '../..'
 

diff --git a/src/__tests__/sandbox/index.test.ts b/src/__tests__/sandbox/index.test.ts
@@ -1,5 +1,5 @@
 /* eslint-disable promise/param-names */
-import { commonStartEffect, releaseAllEffect, ports } from '../common'
+import { commonStartEffect, releaseAllEffect, ports } from '../common/initial'
 import { appInstanceMap } from '../../create_app'
 import microApp from '../..'
 import Sandbox from '../../sandbox'

diff --git a/src/__tests__/source/index.test.ts b/src/__tests__/source/index.test.ts
@@ -1,5 +1,5 @@
 /* eslint-disable promise/param-names */
-import { commonStartEffect, releaseAllEffect, ports } from '../common'
+import { commonStartEffect, releaseAllEffect, ports } from '../common/initial'
 import { appInstanceMap } from '../../create_app'
 import microApp from '../..'
 

diff --git a/src/__tests__/source/links.test.ts b/src/__tests__/source/links.test.ts
@@ -1,5 +1,5 @@
 /* eslint-disable promise/param-names */
-import { commonStartEffect, releaseAllEffect, ports, setAppName } from '../common'
+import { commonStartEffect, releaseAllEffect, ports, setAppName } from '../common/initial'
 import { appInstanceMap } from '../../create_app'
 import { globalLinks, formatHTMLStyleAfterUmdInit } from '../../source/links'
 import microApp from '../..'

diff --git a/src/__tests__/source/load_event.test.ts b/src/__tests__/source/load_event.test.ts
@@ -1,5 +1,5 @@
 /* eslint-disable promise/param-names */
-import { commonStartEffect, releaseAllEffect, ports, setAppName } from '../common'
+import { commonStartEffect, releaseAllEffect, ports, setAppName } from '../common/initial'
 import microApp from '../..'
 
 describe('source load_event', () => {

diff --git a/src/__tests__/source/patch.test.ts b/src/__tests__/source/patch.test.ts
@@ -1,5 +1,5 @@
 /* eslint-disable promise/param-names, no-extend-native */
-import { commonStartEffect, releaseAllEffect, ports, setAppName, clearAppName } from '../common'
+import { commonStartEffect, releaseAllEffect, ports, setAppName, clearAppName } from '../common/initial'
 import { appInstanceMap } from '../../create_app'
 import microApp from '../..'
 

diff --git a/src/__tests__/source/scoped_css.test.ts b/src/__tests__/source/scoped_css.test.ts
@@ -1,5 +1,5 @@
 /* eslint-disable promise/param-names, no-extend-native */
-import { commonStartEffect, releaseAllEffect, ports, setAppName } from '../common'
+import { commonStartEffect, releaseAllEffect, ports, setAppName } from '../common/initial'
 import { defer } from '../../libs/utils'
 import microApp from '../..'
 

diff --git a/src/__tests__/source/scripts.test.ts b/src/__tests__/source/scripts.test.ts
@@ -1,5 +1,5 @@
 /* eslint-disable promise/param-names */
-import { commonStartEffect, releaseAllEffect, ports, setAppName } from '../common'
+import { commonStartEffect, releaseAllEffect, ports, setAppName } from '../common/initial'
 import { appInstanceMap } from '../../create_app'
 import { globalScripts } from '../../source/scripts'
 import microApp from '../..'

diff --git a/src/__tests__/source/scripts2.test.ts b/src/__tests__/source/scripts2.test.ts
@@ -1,11 +1,13 @@
 /* eslint-disable promise/param-names */
 import { rawDocumentCreateElement, rawSetAttribute } from './support_module'
-import { commonStartEffect, releaseAllEffect, ports, setAppName } from '../common'
+import { commonStartEffect, releaseAllEffect, ports, setAppName } from '../common/initial'
 import microApp from '../..'
 
 describe('source scripts2', () => {
  let appCon: Element
  beforeAll(() => {
+ // URL.createObjectURL is undefined in jest env
+ global.URL.createObjectURL = jest.fn()
  commonStartEffect(ports.source_scripts2)
  microApp.start({
  plugins: {}
@@ -53,6 +55,7 @@ describe('source scripts2', () => {
  microappElement2.setAttribute('name', 'test-app2')
  microappElement2.setAttribute('url', `http://127.0.0.1:${ports.source_scripts2}/dynamic/`)
  microappElement2.setAttribute('inline', 'true')
+ microappElement2.setAttribute('disablesandbox', 'true')
 
  appCon.appendChild(microappElement2)
  await new Promise((reslove) => {

diff --git a/src/__tests__/ssr_env.test.ts b/src/__tests__/ssr_env.test.ts
@@ -0,0 +1,22 @@
+import './common/set_ssr_env'
+import preFetch from '../prefetch'
+import { initGloalEnv } from '../libs/global_env'
+import microApp from '../micro_app'
+
+describe('test ssr environment', () => {
+ beforeAll(() => {
+ global.console.error = jest.fn()
+ })
+ // 在非浏览器环境使用prefetch
+ test('run prefetch in non browser environment', () => {
+ preFetch([])
+ expect(console.error).toBeCalledWith('[micro-app] preFetch is only supported in browser environment')
+ })
+
+ // 在非浏览器环境执行start
+ test('run start in non browser environment', () => {
+ microApp.start()
+ initGloalEnv()
+ expect(console.error).toBeCalledWith('[micro-app] micro-app is not supported in this environment')
+ })
+})
diff --git a/src/libs/utils.ts b/src/libs/utils.ts
@@ -1,25 +1,19 @@
-/* eslint-disable no-new-func */
+/* eslint-disable no-new-func, indent */
 import type { Func } from '@micro-app/types'
 
 export const version = '__VERSION__'
 
 export const isBrowser = typeof window !== 'undefined'
 
-export const globalThis: Window = (function () {
- let gt
- if (typeof global !== 'undefined') {
- gt = global
- } else if (typeof self !== 'undefined') {
- gt = self
- } else {
- try {
- gt = Function('return this')()
- } catch (e) {
- throw new Error('global object is unavailable in this environment')
- }
- }
- return gt
-})()
+export const globalThis = (typeof global !== 'undefined')
+ ? global
+ : (
+ (typeof window !== 'undefined')
+ ? window
+ : (
+ (typeof self !== 'undefined') ? self : Function('return this')()
+ )
+ )
 
 /**
  * format error log