chore: add dom-external

Author: ianzone

packages/taro-platform-harmony-cpp/src/runtime/runtime-cpp/index.ts

@@ -22,28 +22,28 @@ export function initStyleSheetConfig (layout: { width: number, height: number} =
     designRatio: logicWidth / (designWidth * deviceRatio),
     // vp -> px比例，逻辑像素和物理像素的比值
     densityPixels: display.densityPixels,
-    // 屏幕宽度:单位vp
+    // 屏幕宽度：单位 vp
     deviceWidth: display.width / display.densityPixels,
-    // 屏幕高度:单位vp
+    // 屏幕高度：单位 vp
     deviceHeight: display.height / display.densityPixels,
-    // 窗口宽度:单位vp
+    // 窗口宽度：单位 vp
     viewportWidth: layout.width || (display.width / display.densityPixels),
-    // 窗口高度:单位vp
+    // 窗口高度：单位 vp
     viewportHeight: (layout.height || (display.height / display.densityPixels)) - navHeight,
-    // 安全区域:单位vp
+    // 安全区域：单位 vp
     safeArea: systemContext.safeArea,
-    // 显示设备的显示字体的缩放因子。该参数为浮点数，通常与densityPixels相同
+    // 显示设备的显示字体的缩放因子。该参数为浮点数，通常与 densityPixels 相同
     scaledDensity: display.scaledDensity,
     // 表示屏幕当前显示的方向
     orientation: display.orientation,
-    // 显示设备屏幕的物理像素密度，表示每英寸上的像素点数。该参数为浮点数，单位为px，支持的范围为[80.0，640.0]。一般取值160.0、480.0等，实际能取到的值取决于不同设备设置里提供的可选值
+    // 显示设备屏幕的物理像素密度，表示每英寸上的像素点数。该参数为浮点数，单位为 px，支持的范围为 [80.0，640.0]。一般取值 160.0、480.0 等，实际能取到的值取决于不同设备设置里提供的可选值
     densityDPI: display.densityDPI
   }
 }
 
 export { systemContext, systemPromise, TaroWindowUtil }
 
-// Current必须放在前面初始化
+// Current 必须放在前面初始化
 export * from './current'
 export { hooks } from '@tarojs/shared'
 // bom
@@ -76,4 +76,4 @@ export {
   ReactPageComponent, ReactPageInstance, ReactAppInstance,
   PageLifeCycle, PageInstance,
   AppInstance,
-} from '@tarojs/runtime/dist/runtime.esm'
+} from '@tarojs/runtime'

packages/taro-runtime/jest.config.js

@@ -1,6 +1,9 @@
-const path = require('path')
+import path from 'node:path'
+import { fileURLToPath } from 'node:url'
 
-module.exports = {
+const __dirname = path.dirname(fileURLToPath(import.meta.url))
+
+export default {
   globals: {
     ENABLE_INNER_HTML: true,
     ENABLE_ADJACENT_HTML: true,

packages/taro-runtime/package.json

@@ -12,6 +12,9 @@
   "files": [
     "dist"
   ],
+  "sideEffects": [
+    "./dist/dom-external/index.js"
+  ],
   "scripts": {
     "prod": "tsdown",
     "dev": "tsdown -w",

packages/taro-runtime/src/__tests__/class.spec.js

@@ -1,9 +1,10 @@
+import { document as Document, navigator, window } from '../../dist/index'
+
 describe('Class', () => {
-  const runtime = require('../../dist/index')
-  const document = runtime.document
-  global.document = runtime.document
-  global.window = runtime.window
-  global.navigator = runtime.navigator
+  const document = Document
+  global.document = Document
+  global.window = window
+  global.navigator = navigator
 
   describe('attribute', () => {
     it('setAttribute: class', () => {

packages/taro-runtime/src/__tests__/dom.spec.js

@@ -1,13 +1,14 @@
+import ReactDOM from '@tarojs/react'
+import React from 'react'
+
+import { document as Document, navigator, window } from '../../dist/index'
+
 describe('DOM', () => {
   process.env.FRAMEWORK = 'nerv'
-  const runtime = require('../../dist/index')
-  const document = runtime.document
-  global.document = runtime.document
-  global.window = runtime.window
-  global.navigator = runtime.navigator
-  // eslint-disable-next-line no-use-before-define
-  const React = require('react')
-  const ReactDOM = require('@tarojs/react')
+  const document = Document
+  global.document = Document
+  global.window = window
+  global.navigator = navigator
 
   afterAll(() => {
     process.env.FRAMEWORK = ''

packages/taro-runtime/src/__tests__/event.spec.js

@@ -1,6 +1,7 @@
+import { createEvent, document as Document } from '../../dist/index'
+
 describe('event', () => {
-  const runtime = require('../../dist/index')
-  const document = runtime.document
+  const document = Document
 
   afterAll(() => {
     process.env.FRAMEWORK = ''
@@ -10,7 +11,7 @@ describe('event', () => {
     const div = document.createElement('div')
     const spy = jest.fn()
     div.addEventListener('tap', spy)
-    const event = runtime.createEvent({ type: 'tap' }, div)
+    const event = createEvent({ type: 'tap' }, div)
     // mini program event system will do this for us
     div.dispatchEvent(event)
   })
@@ -19,7 +20,7 @@ describe('event', () => {
     const div = document.createElement('div')
     const spy = jest.fn()
     div.addEventListener('tap', spy, { once: true })
-    const event = runtime.createEvent({ type: 'tap' }, div)
+    const event = createEvent({ type: 'tap' }, div)
     div.dispatchEvent(event)
     div.dispatchEvent(event)
     expect(spy).toBeCalledTimes(1)
@@ -29,7 +30,7 @@ describe('event', () => {
     const div = document.createElement('div')
     const spy = jest.fn()
     div.addEventListener('tap', spy)
-    const event = runtime.createEvent({ type: 'tap' }, div)
+    const event = createEvent({ type: 'tap' }, div)
     div.dispatchEvent(event)
     div.dispatchEvent(event)
     expect(spy).toBeCalledTimes(2)
@@ -41,7 +42,7 @@ describe('event', () => {
     const spy2 = jest.fn()
     div.addEventListener('tap', spy)
     div.addEventListener('tap', spy2)
-    const event = runtime.createEvent({ type: 'tap' }, div)
+    const event = createEvent({ type: 'tap' }, div)
     div.dispatchEvent(event)
     expect(spy).toBeCalledTimes(1)
     expect(spy2).toBeCalledTimes(1)
@@ -53,7 +54,7 @@ describe('event', () => {
     const spy2 = jest.fn()
     div.addEventListener('tap', spy)
     div.addEventListener('tap', spy2)
-    const event = runtime.createEvent({ type: 'tap' }, div)
+    const event = createEvent({ type: 'tap' }, div)
     div.dispatchEvent(event)
     expect(spy).toBeCalledTimes(1)
     expect(spy2).toBeCalledTimes(1)
@@ -69,7 +70,7 @@ describe('event', () => {
     const spy2 = jest.fn()
     div.addEventListener('Tap', spy)
     div.addEventListener('TAP', spy2)
-    const event = runtime.createEvent({ type: 'tap' }, div)
+    const event = createEvent({ type: 'tap' }, div)
     div.dispatchEvent(event)
     expect(spy).toBeCalledTimes(1)
     expect(spy2).toBeCalledTimes(1)
@@ -97,7 +98,7 @@ describe('event', () => {
       divSpy()
       e.stopPropagation()
     })
-    const event = runtime.createEvent({ type: 'tap' }, div)
+    const event = createEvent({ type: 'tap' }, div)
     div.dispatchEvent(event)
     container.dispatchEvent(event) // buble event
     expect(divSpy).toBeCalledTimes(1)
@@ -113,7 +114,7 @@ describe('event', () => {
     const divSpy = jest.fn()
     container.addEventListener(eventName, containerSpy)
     div.addEventListener(eventName, divSpy)
-    const event = runtime.createEvent({ type: eventName }, div)
+    const event = createEvent({ type: eventName }, div)
     div.dispatchEvent(event)
     container.dispatchEvent(event) // buble event
     expect(divSpy).toBeCalledTimes(1)
@@ -131,7 +132,7 @@ describe('event', () => {
       divSpy()
       e.preventDefault()
     })
-    const event = runtime.createEvent({ type: 'tap' }, div)
+    const event = createEvent({ type: 'tap' }, div)
     div.dispatchEvent(event)
     expect(divSpy).toBeCalledTimes(1)
     expect(event.defaultPrevented).toBe(true)
@@ -146,7 +147,7 @@ describe('event', () => {
       spy()
       e.stopImmediatePropagation()
     })
-    const event = runtime.createEvent({ type: 'tap' }, div)
+    const event = createEvent({ type: 'tap' }, div)
     div.dispatchEvent(event)
     expect(spy).toBeCalledTimes(1)
     expect(spy2).toBeCalledTimes(0)
@@ -161,7 +162,7 @@ describe('event', () => {
       spy()
       e.stopImmediatePropagation()
     })
-    const event = runtime.createEvent({ type: 'Tap' }, div)
+    const event = createEvent({ type: 'Tap' }, div)
     div.dispatchEvent(event)
     expect(spy).toBeCalledTimes(1)
     expect(spy2).toBeCalledTimes(0)
@@ -173,7 +174,7 @@ describe('event', () => {
     container.appendChild(div)
     const containerSpy = jest.fn()
     const divSpy = jest.fn()
-    const event = runtime.createEvent({ type: 'tap' }, div)
+    const event = createEvent({ type: 'tap' }, div)
     div.dispatchEvent(event)
     container.dispatchEvent(event) // buble event
     expect(divSpy).toBeCalledTimes(0)

packages/taro-runtime/src/__tests__/eventSource.spec.js

@@ -1,8 +1,9 @@
+import { document as Document, eventSource as EventSource } from '../../dist/index'
+
 describe('eventSource', () => {
   process.env.FRAMEWORK = 'react'
-  const runtime = require('../../dist/index')
-  const eventSource = runtime.eventSource
-  global.document = runtime.document
+  const eventSource = EventSource
+  global.document = Document
 
   beforeEach(() => {
     eventSource.clear()

packages/taro-runtime/src/__tests__/exports.spec.js

@@ -1,32 +1,32 @@
-describe('style', () => {
-  const runtime = require('../../dist/index')
+import { createComponentConfig, createEvent, createPageConfig, document, navigator, TaroElement, TaroEvent, TaroNode, TaroText, window as Window } from '../../dist/index'
 
+describe('style', () => {
   afterAll(() => {
     process.env.FRAMEWORK = ''
   })
 
   it('bom', () => {
-    const window = runtime.window
+    const window = Window
     expect(window).not.toBeUndefined()
     expect(window.navigator).not.toBeUndefined()
     expect(window.document).not.toBeUndefined()
-    expect(runtime.document).toBe(window.document)
-    expect(runtime.navigator).toBe(window.navigator)
+    expect(document).toBe(window.document)
+    expect(navigator).toBe(window.navigator)
   })
 
   it('dom', () => {
-    expect(runtime.TaroElement).not.toBeUndefined()
-    expect(runtime.TaroNode).not.toBeUndefined()
-    expect(runtime.TaroText).not.toBeUndefined()
+    expect(TaroElement).not.toBeUndefined()
+    expect(TaroNode).not.toBeUndefined()
+    expect(TaroText).not.toBeUndefined()
   })
 
   it('event', () => {
-    expect(runtime.createEvent).not.toBeUndefined()
-    expect(runtime.TaroEvent).not.toBeUndefined()
+    expect(createEvent).not.toBeUndefined()
+    expect(TaroEvent).not.toBeUndefined()
   })
 
   it('dsl', () => {
-    expect(runtime.createComponentConfig).not.toBeUndefined()
-    expect(runtime.createPageConfig).not.toBeUndefined()
+    expect(createComponentConfig).not.toBeUndefined()
+    expect(createPageConfig).not.toBeUndefined()
   })
 })

packages/taro-runtime/tsdown.config.ts

@@ -1,6 +1,6 @@
 import { defineConfig } from 'tsdown'
 
 export default defineConfig({
-  entry: ['./src/index.ts'],
+  entry: ['./src/index.ts', './src/dom-external/index.ts'],
   sourcemap: true,
-})
+})