3.12 例行上线 (#541)

mipengine · Mar 12, 2019 · c9c8ec1 · c9c8ec1
1 parent 2ddd182
commit c9c8ec1
Show file tree

Hide file tree

Showing 5 changed files with 30 additions and 11 deletions.
diff --git a/packages/mip/src/base-element.js b/packages/mip/src/base-element.js
@@ -5,7 +5,7 @@ import {LAYOUT, applyLayout} from './layout'
 import performance from './performance'
 import customElementsStore from './custom-element-store'
 import Services from './services'
-import {hasOwnProperty} from './util'
+import {hasOwn} from './util'
 import {customEmit} from './util/custom-event'
 import dom from './util/dom/dom'
 import css from './util/dom/css'
@@ -339,7 +339,7 @@ class BaseElement extends HTMLElement {
     for (let i = 0; i < names.length; i++) {
       const name = names[i]
 
-      if (typeof props[name] !== 'undefined' || !hasOwnProperty.call(defaultValues, name)) {
+      if (typeof props[name] !== 'undefined' || !hasOwn(defaultValues, name)) {
         continue
       }
 

diff --git a/packages/mip/src/services/vue-compat.js b/packages/mip/src/services/vue-compat.js
@@ -1,6 +1,6 @@
 import Services from './services'
 
-import {hasOwnProperty, jsonParse} from '../util'
+import {hasOwn, jsonParse} from '../util'
 import {hyphenate} from '../util/string'
 import {memoize} from '../util/fn'
 
@@ -99,7 +99,7 @@ export class VueCompat {
 
       metadata.propTypes[name] = this.getPropType(prop)
 
-      if (prop && typeof prop === 'object' && hasOwnProperty.call(prop, 'default')) {
+      if (prop && typeof prop === 'object' && hasOwn(prop, 'default')) {
         metadata.defaultValues[name] = prop.default
       }
     }
@@ -190,18 +190,32 @@ export class VueCompat {
    * Returns props of element parsed from JSON.
    *
    * @param {!HTMLElement} element instance.
+   * @param {!Object} propTypes of custom element.
    * @returns {?Object}
    * @private
    */
-  getPropsFromJSON (element) {
+  getPropsFromJSON (element, propTypes) {
     const script = element.querySelector('script[type*=json]')
 
     if (!script) {
       return null
     }
 
     try {
-      return jsonParse(script.innerHTML)
+      const props = jsonParse(script.innerHTML)
+      const names = Object.keys(props)
+
+      for (let i = 0; i < names.length; i++) {
+        const name = names[i]
+
+        if (typeof props[name] !== 'string') {
+          continue
+        }
+
+        props[name] = this.parseAttribute(props[name], propTypes[name])
+      }
+
+      return props
     } catch (err) {
       return null
     }
@@ -217,7 +231,7 @@ export class VueCompat {
   getProps (element, propTypes) {
     return {
       ...this.getPropsFromAttributes(element, propTypes),
-      ...this.getPropsFromJSON(element)
+      ...this.getPropsFromJSON(element, propTypes)
     }
   }
 }

diff --git a/packages/mip/src/util/index.js b/packages/mip/src/util/index.js
@@ -126,7 +126,9 @@ export function isCacheUrl (pageUrl) {
   return fn.isCacheUrl(pageUrl)
 }
 
-export const hasOwnProperty = Object.prototype.hasOwnProperty
+const hasOwnProperty = Object.prototype.hasOwnProperty
+
+export const hasOwn = (obj, key) => hasOwnProperty.call(obj, key)
 
 export {
   dom,

diff --git a/packages/mip/test/karma.base.conf.js b/packages/mip/test/karma.base.conf.js
@@ -17,7 +17,10 @@ class WebpackRequirePlugin {
           '__webpack_require__.n = function (exported) {',
           '  return exported.a = exported',
           '}',
-          '__webpack_require__.r = function () {}'
+          '__webpack_require__.r = function () {}',
+          '__webpack_require__.o = function (object, property) {',
+          '  return Object.prototype.hasOwnProperty.call(object, property)',
+          '};'
         ].join('\n')
       )
     })

diff --git a/packages/mip/test/specs/services/vue-compat.spec.js b/packages/mip/test/specs/services/vue-compat.spec.js
@@ -312,7 +312,7 @@ describe('vue-compat', () => {
     })
 
     it('should return props merged from attributes and JSON', () => {
-      script.innerHTML = JSON.stringify({num: 0, bool: true, obj: {foo: 'baz'}, mixed: 1})
+      script.innerHTML = JSON.stringify({num: 'Infinity', bool: true, obj: {foo: 'baz'}, mixed: 1})
       element.appendChild(script)
 
       element.setAttribute('str', 'foo')
@@ -326,7 +326,7 @@ describe('vue-compat', () => {
 
       expect(vueCompat.getProps(element, propTypes)).to.deep.equal({
         str: 'foo',
-        num: 0,
+        num: Infinity,
         bool: true,
         date: '2019-01-01',
         arr: ['foo', 'bar'],