@tarojs/plugin-platform-harmony-ets 4.0.0-beta.12 → 4.0.0-beta.121

package/dist/runtime-ets/dom/document.ts

@@ -1,11 +1,10 @@
-import { eventSource } from '@tarojs/runtime/dist/runtime.esm'
 import { isUndefined } from '@tarojs/shared'
 
 import { Current } from '../current'
 import { findChildNodeWithDFS, getPageScrollerOrNode } from '../utils'
 import { TaroComment } from './comment'
-import { createCSSStyleDeclaration } from './cssStyleDeclaration'
 import { TaroElement } from './element/element'
+import { eventSource } from './event-source'
 import { NodeType, TaroNode, TaroTextNode } from './node'
 
 import type { Window } from '../bom/window'
@@ -36,6 +35,7 @@ class TaroDocument extends TaroNode {
       case 'div': tagName = 'view'; break
       case 'p': tagName = 'text'; break
       case 'span': tagName = 'text'; break
+      case 'a': tagName = 'text'; break
     }
     // @ts-ignore
     if (Current?.createHarmonyElement) {
@@ -45,8 +45,6 @@ class TaroDocument extends TaroNode {
       node = new TaroElement(tagName)
     }
     node._doc = this
-    // Hack: 此 Proxy 不能放在 Element 类内定义，否则响应式更新会失效
-    node._style = createCSSStyleDeclaration(node)
     return node
   }
 
@@ -63,7 +61,6 @@ class TaroDocument extends TaroNode {
     return new TaroComment(data)
   }
 
-
   public getElementById<T extends TaroElement> (id: string | undefined | null): T | null {
     const el = eventSource.get(id)
     return isUndefined(el) ? null : el as unknown as T
@@ -72,20 +69,20 @@ class TaroDocument extends TaroNode {
   public querySelector (selectors: string): TaroElement | null {
     const taro = (Current as any).taro
     const page = taro.getCurrentInstance().page
-    const element = getPageScrollerOrNode(page.node, page)
-  
-    if (element == null) return null
-    
+    const element = getPageScrollerOrNode(page?.node, page)
+
+    if (!element) return null
+
     return findChildNodeWithDFS(element, selectors)
   }
 
   public querySelectorAll (selectors: string): TaroElement[] {
     const taro = (Current as any).taro
     const page = taro.getCurrentInstance().page
-    const element = getPageScrollerOrNode(page.node, page)
-  
+    const element = getPageScrollerOrNode(page?.node, page)
+
     if (element == null) return []
-    
+
     return findChildNodeWithDFS(element, selectors, true) || []
   }
   // @Todo

package/dist/runtime-ets/dom/element/canvas.ts

@@ -0,0 +1,137 @@
+import { eventSource } from '../event-source'
+import { TaroNode } from '../node'
+import { TaroElement } from './element'
+
+import type { CanvasProps, CanvasTouchEvent } from '@tarojs/components/types'
+import type { TaroAny } from '../../interface'
+
+export class CanvasRenderingContext2DWXAdapter extends CanvasRenderingContext2D {
+  // constructor(settings?: RenderingContextSetting) {
+  //   super(settings)
+  // }
+
+  createCircularGradient() {
+    // Not supported now
+  }
+
+  draw(cb?: (...args: any[]) => any) {
+    typeof cb === 'function' && cb()
+    // Not supported now
+  }
+
+  setFillStyle(fillStyle: typeof this.fillStyle) {
+    this.fillStyle = fillStyle
+  }
+
+  setFontSize(fontSize: number) {
+    const font = this.font.split(' ')
+    font[2] = `${fontSize}`
+    this.font = font.join(' ')
+  }
+
+  setGlobalAlpha(globalAlpha: typeof this.globalAlpha) {
+    this.globalAlpha = globalAlpha
+  }
+
+  setLineCap(lineCap: typeof this.lineCap) {
+    this.lineCap = lineCap
+  }
+
+  setLineJoin(lineJoin: typeof this.lineJoin) {
+    this.lineJoin = lineJoin
+  }
+
+  setLineWidth(lineWidth: typeof this.lineWidth) {
+    this.lineWidth = lineWidth
+  }
+
+  setMiterLimit(miterLimit: typeof this.miterLimit) {
+    this.miterLimit = miterLimit
+  }
+
+  setShadow(offsetX: number, offsetY: number, blur: number, color: string) {
+    this.shadowOffsetX = offsetX
+    this.shadowOffsetY = offsetY
+    this.shadowBlur = blur
+    this.shadowColor = color
+  }
+
+  setStrokeStyle(strokeStyle: typeof this.strokeStyle) {
+    this.strokeStyle = strokeStyle
+  }
+
+  setTextAlign(textAlign: typeof this.textAlign) {
+    this.textAlign = textAlign
+  }
+
+  setTextBaseline(textBaseline: typeof this.textBaseline) {
+    this.textBaseline = textBaseline
+  }
+}
+function getContextKey(obj) {
+  let currentObj = obj
+  let res = []
+  while (currentObj) {
+    if (currentObj instanceof CanvasRenderingContext2D) {
+      res = [...res, ...Object.getOwnPropertyNames(currentObj)]
+    }
+    currentObj = Object.getPrototypeOf(currentObj)
+  }
+  return res
+}
+
+@Observed
+export class TaroCanvasElement extends TaroElement<CanvasProps, CanvasTouchEvent> {
+  _drawList: {
+    key: string
+    value: TaroAny
+  }[] = []
+
+  settings: RenderingContextSettings
+  _context: CanvasRenderingContext2D
+  _contextProxy: CanvasRenderingContext2D
+
+  constructor() {
+    super('Canvas')
+    this.settings = new RenderingContextSettings(true)
+    const context = new CanvasRenderingContext2DWXAdapter(this.settings) as CanvasRenderingContext2D
+    this._context = context
+
+    const proxyObj = getContextKey(context).reduce((obj, key) => {
+      if (typeof context[key] === 'function') {
+        obj[key] = new Proxy(context[key], {
+          apply: (target, thisArg, argumentsList) => {
+            this._drawList.push({
+              key,
+              value: argumentsList,
+            })
+          },
+        })
+      } else {
+        obj[key] = context[key]
+      }
+      return obj
+    }, {})
+
+    this._contextProxy = new Proxy(proxyObj, {
+      set: (_, property, value) => {
+        this._drawList.push({
+          key: property,
+          value,
+        })
+        return true
+      },
+    })
+  }
+
+  get context() {
+    return this._contextProxy
+  }
+
+  public setAttribute(name: string, value: TaroAny): void {
+    if (name === 'canvasId') {
+      eventSource.set(`canvasId-${value}`, this as TaroNode)
+    }
+    super.setAttribute(name, value)
+  }
+}