@tarojs/taro-h5 3.4.0 → 3.4.3

package/src/api/media/audio/index.ts

@@ -1,93 +1,8 @@
 import Taro from '@tarojs/api'
 import { temporarilyNotSupport } from '../../utils'
-import { CallbackManager } from '../../utils/handler'
+import { InnerAudioContext } from './InnerAudioContext'
 
 // 音频
-class InnerAudioContext implements Taro.InnerAudioContext {
-  Instance?: HTMLAudioElement
-  errorStack: CallbackManager
-  stopStack: CallbackManager
-
-  constructor () {
-    this.Instance = new Audio()
-    this.errorStack = new CallbackManager()
-    this.stopStack = new CallbackManager()
-
-    Taro.eventCenter.on('__taroRouterChange', () => { this.stop() })
-  }
-
-  set autoplay (e) { this.setProperty('autoplay', e) }
-  get autoplay () { return this.Instance?.autoplay || false }
-  get buffered () { return this.Instance?.buffered.length || 0 }
-  get currentTime () { return this.Instance?.currentTime || 0 }
-  get duration () { return this.Instance?.duration || 0 }
-  set loop (e) { this.setProperty('loop', e) }
-  get loop () { return this.Instance?.loop || false }
-  get paused () { return this.Instance?.paused || true }
-  set src (e) { this.setProperty('src', e) }
-  get src () { return this.Instance?.src || '' }
-  set volume (e) { this.setProperty('volume', e) }
-  get volume () { return this.Instance?.volume || 0 }
-  set playbackRate (e) { this.setProperty('playbackRate', e) }
-  get playbackRate () { return this.Instance?.volume || 0 }
-  get obeyMuteSwitch () { return true }
-  set startTime (e) { this.setProperty('startTime', e) }
-  get startTime () { return this.Instance?.volume || 0 }
-
-  private setProperty (key: string, value: unknown) {
-    if (this.Instance) {
-      this.Instance[key] = value
-    }
-  }
-
-  play = () => this.Instance?.play()
-
-  pause = () => this.Instance?.pause()
-
-  stop = () => {
-    this.pause()
-    this.seek(0)
-    this.stopStack.trigger()
-  }
-
-  seek = (position: number) => {
-    if (this.Instance) {
-      this.Instance.currentTime = position
-    }
-  }
-
-  /**
-   * @TODO destroy得并不干净
-   */
-  destroy = () => {
-    this.stop()
-    if (this.Instance) {
-      document.body.removeChild(this.Instance)
-      this.Instance = undefined
-    }
-  }
-
-  onCanplay = (callback = () => {}) => this.Instance?.addEventListener('canplay', callback)
-  onPlay = (callback = () => {}) => this.Instance?.addEventListener('play', callback)
-  onPause = (callback = () => {}) => this.Instance?.addEventListener('pause', callback)
-  onStop = (callback = () => {}) => this.stopStack.add(callback)
-  onEnded = (callback = () => {}) => this.Instance?.addEventListener('ended', callback)
-  onTimeUpdate = (callback = () => {}) => this.Instance?.addEventListener('timeupdate', callback)
-  onError = (callback?: ((res: Taro.InnerAudioContext.onErrorDetail) => void)) => this.errorStack.add(callback)
-  onWaiting = (callback = () => {}) => this.Instance?.addEventListener('waiting', callback)
-  onSeeking = (callback = () => {}) => this.Instance?.addEventListener('seeking', callback)
-  onSeeked = (callback = () => {}) => this.Instance?.addEventListener('seeked', callback)
-  offCanplay = (callback = () => {}) => this.Instance?.removeEventListener('canplay', callback)
-  offPlay = (callback = () => {}) => this.Instance?.removeEventListener('play', callback)
-  offPause = (callback = () => {}) => this.Instance?.removeEventListener('pause', callback)
-  offStop = (callback = () => {}) => this.stopStack.remove(callback)
-  offEnded = (callback = () => {}) => this.Instance?.removeEventListener('ended', callback)
-  offTimeUpdate = (callback = () => {}) => this.Instance?.removeEventListener('timeupdate', callback)
-  offError = (callback = () => {}) => this.errorStack.remove(callback)
-  offWaiting = (callback = () => {}) => this.Instance?.removeEventListener('waiting', callback)
-  offSeeking = (callback = () => {}) => this.Instance?.removeEventListener('seeking', callback)
-  offSeeked = (callback = () => {}) => this.Instance?.removeEventListener('seeked', callback)
-}
 
 export const stopVoice = temporarilyNotSupport('stopVoice')
 export const setInnerAudioOption = temporarilyNotSupport('setInnerAudioOption')

package/src/api/media/background-audio/BackgroundAudioManager.ts

@@ -0,0 +1,103 @@
+import Taro from '@tarojs/api'
+import { permanentlyNotSupport } from '../../utils'
+import { CallbackManager } from '../../utils/handler'
+
+export class BackgroundAudioManager implements Taro.BackgroundAudioManager {
+  Instance?: HTMLAudioElement
+  errorStack: CallbackManager
+  stopStack: CallbackManager
+  __startTime = 0
+
+  constructor () {
+    this.Instance = new Audio()
+    this.errorStack = new CallbackManager()
+    this.stopStack = new CallbackManager()
+    this.Instance.autoplay = true
+    this.onPlay(() => {
+      if (this.currentTime !== this.startTime) {
+        this.seek(this.startTime)
+      }
+    })
+  }
+
+  set src (e) { this.setProperty('src', e) }
+  get src () { return this.Instance?.src || '' }
+  set startTime (e) { this.__startTime = e }
+  get startTime () { return this.__startTime || 0 }
+  set title (e) { this.dataset('title', e) }
+  get title () { return this.Instance?.dataset.title || '' }
+  set epname (e) { this.dataset('epname', e) }
+  get epname () { return this.Instance?.dataset.epname || '' }
+  set singer (e) { this.dataset('singer', e) }
+  get singer () { return this.Instance?.dataset.singer || '' }
+  set coverImgUrl (e) { this.dataset('coverImgUrl', e) }
+  get coverImgUrl () { return this.Instance?.dataset.coverImgUrl || '' }
+  set webUrl (e) { this.dataset('webUrl', e) }
+  get webUrl () { return this.Instance?.dataset.webUrl || '' }
+  set protocol (e) { this.dataset('protocol', e) }
+  get protocol () { return this.Instance?.dataset.protocol || '' }
+  set playbackRate (e) { this.setProperty('playbackRate', e) }
+  get playbackRate () { return this.Instance?.playbackRate || 0 }
+  get duration () { return this.Instance?.duration || 0 }
+  get currentTime () { return this.Instance?.currentTime || 0 }
+  get paused () { return this.Instance?.paused || false }
+  get buffered () { return this.Instance?.buffered.length || 0 }
+  set referrerPolicy (e) { this.Instance?.setAttribute('referrerpolicy', e) }
+  get referrerPolicy () { return this.Instance?.getAttribute('referrerpolicy') || 'origin' }
+
+  private setProperty (key: string, value: unknown) {
+    if (this.Instance) {
+      this.Instance[key] = value
+    }
+  }
+
+  private dataset (key: string, value: string) {
+    if (this.Instance) {
+      this.Instance.dataset[key] = value
+    }
+  }
+
+  play = () => this.Instance?.play()
+
+  pause = () => this.Instance?.pause()
+
+  seek = (position: number) => {
+    if (this.Instance) {
+      this.Instance.currentTime = position
+    }
+  }
+
+  stop = () => {
+    this.pause()
+    this.seek(0)
+    this.stopStack.trigger()
+  }
+
+  onCanplay = (callback = () => {}) => this.Instance?.addEventListener('canplay', callback)
+  onWaiting = (callback = () => {}) => this.Instance?.addEventListener('waiting', callback)
+  onError = (callback?: ((res: Taro.InnerAudioContext.onErrorDetail) => void)) => this.errorStack.add(callback)
+  onPlay = (callback = () => {}) => this.Instance?.addEventListener('play', callback)
+  onPause = (callback = () => {}) => this.Instance?.addEventListener('pause', callback)
+  onSeeking = (callback = () => {}) => this.Instance?.addEventListener('seeking', callback)
+  onSeeked = (callback = () => {}) => this.Instance?.addEventListener('seeked', callback)
+
+  onEnded = (callback = () => {}) => this.Instance?.addEventListener('ended', callback)
+  onStop = (callback = () => {}) => this.stopStack.add(callback)
+  onTimeUpdate = (callback = () => {}) => this.Instance?.addEventListener('timeupdate', callback)
+  onPrev = permanentlyNotSupport('BackgroundAudioManager.onPrev')
+  onNext = permanentlyNotSupport('BackgroundAudioManager.onNext')
+
+  offCanplay = (callback = () => {}) => this.Instance?.removeEventListener('canplay', callback)
+  offWaiting = (callback = () => {}) => this.Instance?.removeEventListener('waiting', callback)
+  offError = (callback = () => {}) => this.errorStack.remove(callback)
+  offPlay = (callback = () => {}) => this.Instance?.removeEventListener('play', callback)
+  offPause = (callback = () => {}) => this.Instance?.removeEventListener('pause', callback)
+  offSeeking = (callback = () => {}) => this.Instance?.removeEventListener('seeking', callback)
+  offSeeked = (callback = () => {}) => this.Instance?.removeEventListener('seeked', callback)
+
+  offEnded = (callback = () => {}) => this.Instance?.removeEventListener('ended', callback)
+  offStop = (callback = () => {}) => this.stopStack.remove(callback)
+  offTimeUpdate = (callback = () => {}) => this.Instance?.removeEventListener('timeupdate', callback)
+  offPrev = permanentlyNotSupport('BackgroundAudioManager.offPrev')
+  offNext = permanentlyNotSupport('BackgroundAudioManager.offNext')
+}

package/src/api/media/{background-audio.ts → background-audio/index.ts}

@@ -1,4 +1,5 @@
-import { temporarilyNotSupport } from '../utils'
+import { temporarilyNotSupport } from '../../utils'
+import { BackgroundAudioManager } from './BackgroundAudioManager'
 
 // 背景音频
 export const stopBackgroundAudio = temporarilyNotSupport('stopBackgroundAudio')
@@ -9,4 +10,8 @@ export const onBackgroundAudioStop = temporarilyNotSupport('onBackgroundAudioSto
 export const onBackgroundAudioPlay = temporarilyNotSupport('onBackgroundAudioPlay')
 export const onBackgroundAudioPause = temporarilyNotSupport('onBackgroundAudioPause')
 export const getBackgroundAudioPlayerState = temporarilyNotSupport('getBackgroundAudioPlayerState')
-export const getBackgroundAudioManager = temporarilyNotSupport('getBackgroundAudioManager')
+
+/**
+ * 获取全局唯一的背景音频管理器
+ */
+export const getBackgroundAudioManager = () => new BackgroundAudioManager()

package/src/api/media/index.ts

@@ -1,7 +1,6 @@
 export * from './audio'
 export * from './background-audio'
 export * from './camera'
-export * from './editor'
 export * from './image'
 export * from './live'
 export * from './map'

package/src/api/network/upload.ts

@@ -1,5 +1,4 @@
 import Taro from '@tarojs/api'
-import { temporarilyNotSupport } from '../utils'
 import { CallbackManager } from '../utils/handler'
 import {
   convertObjectUrlToBlob,
@@ -8,7 +7,7 @@ import {
   XHR_STATS
 } from './utils'
 
-const createUploadTask = ({ url, filePath, formData, name, header, timeout, fileName, success, error }): Taro.UploadTask => {
+const createUploadTask = ({ url, filePath, formData = {}, name, header, timeout, fileName, success, error }): Taro.UploadTask => {
   let timeoutInter
   let formKey
   const apiName = 'uploadFile'
@@ -125,17 +124,12 @@ const createUploadTask = ({ url, filePath, formData, name, header, timeout, file
    */
   const offProgressUpdate = callbackManager.progressUpdate.remove
 
-  const headersReceived = temporarilyNotSupport('UploadTask.headersReceived')
-  const progress = temporarilyNotSupport('UploadTask.progress')
-
   return {
     abort,
     onHeadersReceived,
     offHeadersReceived,
     onProgressUpdate,
-    offProgressUpdate,
-    headersReceived,
-    progress
+    offProgressUpdate
   }
 }
 

package/src/api/ui/animation/index.ts

@@ -9,13 +9,17 @@ class StyleSheet {
     this.$style = document.createElement('style')
   }
 
-  $style: HTMLStyleElement
-  sheet?: CSSStyleSheet | null
+  $style?: HTMLStyleElement | null = null
+  sheet?: CSSStyleSheet | null = null
+
   appendStyleSheet = () => {
-    this.$style?.setAttribute('type', 'text/css')
-    this.$style?.setAttribute('data-type', 'Taro')
-    document.getElementsByTagName('head')[0].appendChild(this.$style)
-    this.sheet = this.$style?.sheet
+    if (this.$style) {
+      const head = document.getElementsByTagName('head')[0]
+      this.$style.setAttribute('type', 'text/css')
+      this.$style.setAttribute('data-type', 'Taro')
+      head.appendChild(this.$style)
+      this.sheet = this.$style.sheet
+    }
     if (this.sheet && !('insertRule' in this.sheet)) {
       console.warn('当前浏览器不支持 stylesheet.insertRule 接口')
     }

package/src/api/ui/fonts.ts

@@ -1,4 +1,63 @@
-import { temporarilyNotSupport } from '../utils'
+import Taro from '@tarojs/api'
+import { MethodHandler } from '../utils/handler'
 
 // 字体
-export const loadFontFace = temporarilyNotSupport('loadFontFace')
+export const loadFontFace: typeof Taro.loadFontFace = async options => {
+  options = Object.assign({ global: false }, options)
+  const { success, fail, complete, family, source, desc = {} } = options
+  const handle = new MethodHandler({ name: 'loadFontFace', success, fail, complete })
+  // @ts-ignore
+  const fonts = document.fonts
+  if (fonts) {
+    // @ts-ignore
+    const fontFace = new FontFace(family, source, desc)
+    try {
+      await fontFace.load()
+      fonts.add(fontFace)
+      return handle.success({})
+    } catch (error) {
+      return handle.fail({
+        errMsg: error.message || error
+      })
+    }
+  } else {
+    const style = document.createElement('style')
+    let innerText = `font-family:"${
+      family
+    }";src:${
+      source
+    };font-style:${
+      desc.style || 'normal'
+    };font-weight:${
+      desc.weight || 'normal'
+    };font-variant:${
+      desc.variant || 'normal'
+    };`
+
+    if (desc.ascentOverride) {
+      innerText += `ascent-override:${desc.ascentOverride};`
+    }
+    if (desc.descentOverride) {
+      innerText += `descent-override:${desc.descentOverride};`
+    }
+    if (desc.featureSettings) {
+      innerText += `font-feature-settings:${desc.featureSettings};`
+    }
+    if (desc.lineGapOverride) {
+      innerText += `line-gap-override:${desc.lineGapOverride};`
+    }
+    if (desc.stretch) {
+      innerText += `font-stretch:${desc.stretch};`
+    }
+    if (desc.unicodeRange) {
+      innerText += `unicode-range:${desc.unicodeRange};`
+    }
+    if (desc.variationSettings) {
+      innerText += `font-variation-settings:${desc.variationSettings};`
+    }
+
+    style.innerText = `@font-face{${innerText}}`
+    document.head.appendChild(style)
+    return handle.success()
+  }
+}

package/src/api/ui/scroll/index.ts

@@ -4,7 +4,7 @@ import { Current } from '@tarojs/runtime'
 import { MethodHandler } from '../../utils/handler'
 import { getTimingFunc, easeInOut } from '../../utils'
 
-let timer: number
+let timer: NodeJS.Timer
 const FRAME_DURATION = 17
 
 /**
@@ -21,9 +21,9 @@ export const pageScrollTo: typeof Taro.pageScrollTo = ({ scrollTop, selector = '
         }, reject)
       }
 
-      const id = Current.page?.path
+      const id = Current.page?.path?.replace(/([^a-z0-9\u00a0-\uffff_-])/ig, '\\$1')
       const el: HTMLDivElement | null = (id
-        ? document.getElementById(id)
+        ? document.querySelector(`.taro_page#${id}`)
         : document.querySelector('.taro_page') ||
       document.querySelector('.taro_router')) as HTMLDivElement
 

package/src/api/utils/handler.ts

@@ -58,7 +58,7 @@ export class CallbackManager {
    * 添加回调
    * @param {{ callback: function, ctx: any } | function} opt
    */
-  add (opt?: TCallbackManagerListItem) {
+  add = (opt?: TCallbackManagerListItem) => {
     if (opt) this.callbacks.push(opt)
   }
 
@@ -66,7 +66,7 @@ export class CallbackManager {
    * 移除回调
    * @param {{ callback: function, ctx: any } | function} opt
    */
-  remove (opt?: TCallbackManagerListItem) {
+  remove = (opt?: TCallbackManagerListItem) => {
     if (opt) {
       let pos = -1
       this.callbacks.forEach((callback, k) => {
@@ -84,7 +84,7 @@ export class CallbackManager {
    * 获取回调函数数量
    * @return {number}
    */
-  count () {
+  count = () => {
     return this.callbacks.length
   }
 
@@ -92,7 +92,7 @@ export class CallbackManager {
    * 触发回调
    * @param  {...any} args 回调的调用参数
    */
-  trigger (...args: TCallbackManagerList) {
+  trigger = (...args: TCallbackManagerList) => {
     this.callbacks.forEach(opt => {
       if (typeof opt === 'function') {
         opt(...args)

package/src/api/utils/index.ts

@@ -88,30 +88,51 @@ export function serializeParams (params) {
 export function temporarilyNotSupport (apiName) {
   return () => {
     const errMsg = `暂时不支持 API ${apiName}`
-    console.error(errMsg)
-    return Promise.reject({
-      errMsg
-    })
+    if (process.env.NODE_ENV !== 'production') {
+      console.error(errMsg)
+      return Promise.reject({
+        errMsg
+      })
+    } else {
+      console.warn(errMsg)
+      return Promise.resolve({
+        errMsg
+      })
+    }
   }
 }
 
 export function weixinCorpSupport (apiName) {
   return () => {
     const errMsg = `h5端仅在微信公众号中支持 API ${apiName}`
-    console.error(errMsg)
-    return Promise.reject({
-      errMsg
-    })
+    if (process.env.NODE_ENV !== 'production') {
+      console.error(errMsg)
+      return Promise.reject({
+        errMsg
+      })
+    } else {
+      console.warn(errMsg)
+      return Promise.resolve({
+        errMsg
+      })
+    }
   }
 }
 
 export function permanentlyNotSupport (apiName) {
   return () => {
     const errMsg = `不支持 API ${apiName}`
-    console.error(errMsg)
-    return Promise.reject({
-      errMsg
-    })
+    if (process.env.NODE_ENV !== 'production') {
+      console.error(errMsg)
+      return Promise.reject({
+        errMsg
+      })
+    } else {
+      console.warn(errMsg)
+      return Promise.resolve({
+        errMsg
+      })
+    }
   }
 }
 

package/dist/api/base/system/index.js

@@ -1,2 +0,0 @@
-export * from './info';
-export * from './network';

package/dist/api/base/system/info.js

@@ -1,57 +0,0 @@
-import MobileDetect from 'mobile-detect';
-import { MethodHandler } from '../../utils/handler';
-export const getSystemInfoSync = () => {
-    const md = new MobileDetect(navigator.userAgent);
-    const info = {
-        brand: md.mobile() || '',
-        model: md.mobile() || '',
-        system: md.os(),
-        pixelRatio: window.devicePixelRatio,
-        screenWidth: window.screen.width,
-        screenHeight: window.screen.height,
-        windowWidth: document.documentElement.clientWidth,
-        windowHeight: document.documentElement.clientHeight,
-        version: '',
-        statusBarHeight: NaN,
-        platform: navigator.platform,
-        language: navigator.language,
-        fontSizeSetting: NaN,
-        SDKVersion: '',
-        // TODO
-        albumAuthorized: false,
-        benchmarkLevel: 0,
-        bluetoothEnabled: false,
-        cameraAuthorized: false,
-        enableDebug: false,
-        locationAuthorized: false,
-        locationEnabled: false,
-        microphoneAuthorized: false,
-        notificationAlertAuthorized: false,
-        notificationAuthorized: false,
-        notificationBadgeAuthorized: false,
-        notificationSoundAuthorized: false,
-        safeArea: {
-            bottom: 0,
-            height: 0,
-            left: 0,
-            right: 0,
-            top: 0,
-            width: 0
-        },
-        wifiEnabled: false
-    };
-    return info;
-};
-export const getSystemInfo = async (options = {}) => {
-    const { success, fail, complete } = options;
-    const handle = new MethodHandler({ name: 'getSystemInfo', success, fail, complete });
-    try {
-        const info = await getSystemInfoSync();
-        return handle.success(info);
-    }
-    catch (error) {
-        return handle.fail({
-            errMsg: error
-        });
-    }
-};

package/src/api/base/system/index.ts

@@ -1,2 +0,0 @@
-export * from './info'
-export * from './network'

package/src/api/base/system/info.ts

@@ -1,64 +0,0 @@
-import Taro from '@tarojs/api'
-import MobileDetect from 'mobile-detect'
-
-import { MethodHandler } from '../../utils/handler'
-
-export const getSystemInfoSync: typeof Taro.getSystemInfoSync = () => {
-  const md = new MobileDetect(navigator.userAgent)
-
-  const info: ReturnType<typeof Taro.getSystemInfoSync> = {
-    brand: md.mobile() || '', // 手机品牌
-    model: md.mobile() || '', // 手机型号
-    system: md.os(), // 操作系统版本
-    pixelRatio: window.devicePixelRatio, // 设备像素比
-    screenWidth: window.screen.width, // 屏幕宽度
-    screenHeight: window.screen.height, // 屏幕高度
-    windowWidth: document.documentElement.clientWidth, // 可使用窗口宽度
-    windowHeight: document.documentElement.clientHeight, // 可使用窗口高度
-    version: '', // 微信版本号
-    statusBarHeight: NaN, // 状态栏的高度
-    platform: navigator.platform, // 客户端平台
-    language: navigator.language, // 微信设置的语言
-    fontSizeSetting: NaN, // 用户字体大小设置。以“我-设置-通用-字体大小”中的设置为准，单位：px
-    SDKVersion: '', // 客户端基础库版本
-
-    // TODO
-    albumAuthorized: false,
-    benchmarkLevel: 0,
-    bluetoothEnabled: false,
-    cameraAuthorized: false,
-    enableDebug: false,
-    locationAuthorized: false,
-    locationEnabled: false,
-    microphoneAuthorized: false,
-    notificationAlertAuthorized: false,
-    notificationAuthorized: false,
-    notificationBadgeAuthorized: false,
-    notificationSoundAuthorized: false,
-    safeArea: {
-      bottom: 0,
-      height: 0,
-      left: 0,
-      right: 0,
-      top: 0,
-      width: 0
-    },
-    wifiEnabled: false
-  }
-
-  return info
-}
-
-export const getSystemInfo: typeof Taro.getSystemInfo = async (options = {}) => {
-  const { success, fail, complete } = options
-  const handle = new MethodHandler({ name: 'getSystemInfo', success, fail, complete })
-
-  try {
-    const info = await getSystemInfoSync()
-    return handle.success(info)
-  } catch (error) {
-    return handle.fail({
-      errMsg: error
-    })
-  }
-}