@mpxjs/core 2.9.0-beta.1 → 2.9.0-beta.3

package/@types/index.d.ts

@@ -31,18 +31,22 @@ type ArrayType<T extends any[]> = T extends Array<infer R> ? R : never;
 // Mpx types
 type Data = object | (() => object)
 
-type PropType = StringConstructor | NumberConstructor | BooleanConstructor | ObjectConstructor | ArrayConstructor | null
+type PropConstructor<T = any> = {
+  new (...args: any[]): T & {};
+} | {
+  (): T;
+}
 
-interface PropOpt {
-  type: PropType
-  optionalTypes?: Array<PropType>
-  value?: any
+export type PropType<T> = PropConstructor<T>
 
-  observer? (value: any, old: any, changedPath: string): void
+type FullPropType<T> = {
+  type: PropType<T>;
+  value?: T;
+  optionalTypes?: PropType<T>[];
 }
 
 interface Properties {
-  [key: string]: WechatMiniprogram.Component.AllProperty
+  [key: string]: WechatMiniprogram.Component.AllProperty | PropType<any> | FullPropType<any>
 }
 
 interface Methods {
@@ -78,8 +82,12 @@ type PropValueType<Def> = Def extends {
   }
   ? T
   : Def extends (...args: any[]) => infer T
-    ? T
-    : any;
+  ? T
+  : Def extends FullPropType<infer T>
+  ? T
+  : Def extends PropType<infer T>
+  ? T
+  : any;
 
 type GetPropsType<T> = {
   readonly [K in keyof T]: PropValueType<T[K]>
@@ -242,6 +250,11 @@ interface AnyConstructor {
   prototype: any
 }
 
+interface WebviewConfig {
+  hostWhitelists?: Array<string>
+  apiImplementations?: object
+}
+
 interface MpxConfig {
   useStrictDiff: boolean
   ignoreWarning: boolean | string | RegExp | ((msg: string, location: string, e: Error) => boolean)
@@ -251,7 +264,8 @@ interface MpxConfig {
   proxyEventHandler: (e: Event) => any | null
   setDataHandler: (data: object, target: ComponentIns<{}, {}, {}, {}, []>) => any | null
   forceFlushSync: boolean,
-  webRouteConfig: object
+  webRouteConfig: object,
+  webviewConfig?: WebviewConfig
 }
 
 type SupportedMode = 'wx' | 'ali' | 'qq' | 'swan' | 'tt' | 'web' | 'qa'

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/core",
-  "version": "2.9.0-beta.1",
+  "version": "2.9.0-beta.3",
   "description": "mpx runtime core",
   "keywords": [
     "miniprogram",
@@ -19,7 +19,7 @@
   ],
   "main": "src/index.js",
   "dependencies": {
-    "@mpxjs/utils": "^2.9.0-beta.1",
+    "@mpxjs/utils": "^2.9.0-beta.3",
     "lodash": "^4.1.1",
     "miniprogram-api-typings": "^3.10.0"
   },
@@ -47,5 +47,5 @@
     "url": "https://github.com/didi/mpx/issues"
   },
   "sideEffects": false,
-  "gitHead": "5e4b44c9b8132e9192cfd119f63196ecc6c4486c"
+  "gitHead": "521f0cec1231962f9c071c8b70499772a0a81fda"
 }

package/src/core/injectMixins.js

@@ -19,7 +19,7 @@ export function injectMixins (mixins, options = {}) {
     }
   }
 
-  let types = options.types || ['app', 'page', 'component']
+  let types = options.types || ['page', 'component']
   const stage = options.stage || -1
 
   if (typeof types === 'string') {

package/src/core/proxy.js

@@ -26,7 +26,8 @@ import {
   getFirstKey,
   callWithErrorHandling,
   warn,
-  error
+  error,
+  getEnvObj
 } from '@mpxjs/utils'
 import {
   BEFORECREATE,
@@ -46,6 +47,8 @@ import {
 
 let uid = 0
 
+const envObj = getEnvObj()
+
 class RenderTask {
   resolved = false
 
@@ -236,14 +239,14 @@ export default class MpxProxy {
       const setupResult = callWithErrorHandling(setup, this, 'setup function', [
         this.props,
         {
-          triggerEvent: this.target.triggerEvent.bind(this.target),
+          triggerEvent: this.target.triggerEvent ? this.target.triggerEvent.bind(this.target) : noop,
           refs: this.target.$refs,
           asyncRefs: this.target.$asyncRefs,
           forceUpdate: this.forceUpdate.bind(this),
           selectComponent: this.target.selectComponent.bind(this.target),
           selectAllComponents: this.target.selectAllComponents.bind(this.target),
-          createSelectorQuery: this.target.createSelectorQuery.bind(this.target),
-          createIntersectionObserver: this.target.createIntersectionObserver.bind(this.target)
+          createSelectorQuery: this.target.createSelectorQuery ? this.target.createSelectorQuery.bind(this.target) : envObj.createSelectorQuery.bind(envObj),
+          createIntersectionObserver: this.target.createIntersectionObserver ? this.target.createIntersectionObserver.bind(this.target) : envObj.createIntersectionObserver.bind(envObj)
         }
       ])
       if (!isObject(setupResult)) {
@@ -605,7 +608,9 @@ export default class MpxProxy {
 
 export let currentInstance = null
 
-export const getCurrentInstance = () => currentInstance?.target
+export const getCurrentInstance = () => {
+  return currentInstance && { proxy: currentInstance?.target }
+}
 
 export const setCurrentInstance = (instance) => {
   currentInstance = instance

package/src/index.js

@@ -137,7 +137,13 @@ Mpx.config = {
   proxyEventHandler: null,
   setDataHandler: null,
   forceFlushSync: false,
-  webRouteConfig: {}
+  webRouteConfig: {},
+  /*
+    支持两个属性
+    hostWhitelists Array 类型 支持h5域名白名单安全校验
+    apiImplementations webview JSSDK接口 例如getlocation
+   */
+  webviewConfig: {}
 }
 
 global.__mpx = Mpx

package/src/platform/builtInMixins/pageRouteMixin.js

@@ -4,6 +4,19 @@ export default function pageRouteMixin (mixinType) {
     return {
       beforeCreate () {
         this.route = this.$options.__mpxPageRoute || ''
+      },
+      methods: {
+        getOpenerEventChannel () {
+          const router = global.__mpxRouter
+          const eventChannel = router && router.eventChannelMap[this.route]
+          return eventChannel || {}
+        }
+      }
+    }
+  }
+  return {
+    methods: {
+      getOpenerEventChannel () {
       }
     }
   }

package/src/platform/builtInMixins/proxyEventMixin.js

@@ -89,29 +89,34 @@ export default function proxyEventMixin () {
   }
   if (__mpx_mode__ === 'ali') {
     Object.assign(methods, {
-      triggerEvent (eventName, eventDetail) {
+      triggerEvent (eventName, eventDetail, e) {
         const handlerName = eventName.replace(/^./, matched => matched.toUpperCase()).replace(/-([a-z])/g, (match, p1) => p1.toUpperCase())
         const handler = this.props && (this.props['on' + handlerName] || this.props['catch' + handlerName])
         if (handler && typeof handler === 'function') {
-          const dataset = collectDataset(this.props)
-          const id = this.props.id || ''
-          const timeStamp = +new Date()
-          const eventObj = {
-            type: eventName,
-            timeStamp,
-            target: {
-              id,
-              dataset,
-              targetDataset: dataset
-            },
-            currentTarget: {
-              id,
-              dataset
-            },
-            detail: eventDetail
+          let eventObj = {}
+          if (e) {
+            e.detail = Object.assign(e.detail, eventDetail)
+            eventObj = e
+          } else {
+            const dataset = collectDataset(this.props)
+            const id = this.props.id || ''
+            const timeStamp = +new Date()
+            eventObj = {
+              type: eventName,
+              timeStamp,
+              target: { id, dataset, targetDataset: dataset },
+              currentTarget: { id, dataset },
+              detail: eventDetail
+            }
           }
           handler.call(this, eventObj)
         }
+      },
+      __proxyEvent (e) {
+        const eventName = e.type
+        // 保持和微信一致
+        e.target = e.currentTarget
+        this.triggerEvent(eventName, {}, e)
       }
     })
   }

package/src/platform/builtInMixins/proxyEventMixin.web.js

@@ -19,10 +19,11 @@ export default function proxyEventMixin () {
         const value = filterMethod ? (innerFilter[filterMethod] ? innerFilter[filterMethod](originValue) : typeof this[filterMethod] === 'function' && this[filterMethod]) : originValue
         setByPath(this, expr, value)
       },
-      getOpenerEventChannel () {
-        const router = this.$root.$options && this.$root.$options.router
-        const eventChannel = router && router.__mpxAction && router.__mpxAction.eventChannel
-        return eventChannel
+      __proxyEvent (e) {
+        const type = e.type
+        // 保持和微信一致 target 和 currentTarget 相同
+        e.target = e.currentTarget
+        this.triggerEvent(type, {}, e)
       }
     }
   }

package/src/platform/builtInMixins/refsMixin.web.js

@@ -8,7 +8,7 @@ function getEl (ref) {
 
 function processRefs (refs) {
   Object.keys(refs).forEach((key) => {
-    const matched = /^__mpx_ref_([^_]+)__$/.exec(key)
+    const matched = /^__mpx_ref_(.+)__$/.exec(key)
     const rKey = matched && matched[1]
     if (rKey) {
       const ref = refs[key]

package/src/platform/export/index.web.js

@@ -1,6 +1,6 @@
 import {
   effectScope as vueEffectScope,
-  getCurrentScope as getCurrentVueScope,
+  getCurrentScope as vueGetCurrentScope,
   onScopeDispose
 } from 'vue'
 
@@ -42,7 +42,7 @@ const fixEffectScope = (scope) => {
 }
 
 const effectScope = (detached) => fixEffectScope(vueEffectScope(detached))
-const getCurrentScope = () => fixEffectScope(getCurrentVueScope())
+const getCurrentScope = () => fixEffectScope(vueGetCurrentScope())
 
 export {
   // effectScope

package/src/vuePlugin.js

@@ -1,12 +1,39 @@
-import { walkChildren, parseSelector, error } from '@mpxjs/utils'
+import { walkChildren, parseSelector, error, hasOwn } from '@mpxjs/utils'
 import * as webApi from '@mpxjs/api-proxy/src/web/api'
+const datasetReg = /^data-(.+)$/
+
+function collectDataset (attrs) {
+  const dataset = {}
+  for (const key in attrs) {
+    if (hasOwn(attrs, key)) {
+      const matched = datasetReg.exec(key)
+      if (matched) {
+        dataset[matched[1]] = attrs[key]
+      }
+    }
+  }
+  return dataset
+}
 
 export default function install (Vue) {
-  Vue.prototype.triggerEvent = function (eventName, eventDetail) {
-    return this.$emit(eventName, {
-      type: eventName,
-      detail: eventDetail
-    })
+  Vue.prototype.triggerEvent = function (eventName, eventDetail, e) {
+    let eventObj = {}
+    if (e) {
+      e.detail = Object.assign(e.detail, eventDetail)
+      eventObj = e
+    } else {
+      const dataset = collectDataset(this.$attrs)
+      const id = this.$attrs.id || ''
+      const timeStamp = +new Date()
+      eventObj = {
+        type: eventName,
+        timeStamp,
+        target: { id, dataset, targetDataset: dataset },
+        currentTarget: { id, dataset },
+        detail: eventDetail
+      }
+    }
+    return this.$emit(eventName, eventObj)
   }
   Vue.prototype.selectComponent = function (selector, all) {
     const result = []