CHANGELOG.md

@@ -1,3 +1,13 @@
+<a name="0.6.3"></a>
+## [0.6.3](https://github.com/vuejs/composition-api/compare/v0.6.2...v0.6.3) (2020-06-12)
+
+
+### Bug Fixes
+
+* unwrapRefProxy native objects handling ([#376](https://github.com/vuejs/composition-api/issues/376)) ([8322fc7](https://github.com/vuejs/composition-api/commit/8322fc7)), closes [#375](https://github.com/vuejs/composition-api/issues/375)
+
+
+
 <a name="0.6.2"></a>
 ## [0.6.2](https://github.com/vuejs/composition-api/compare/v0.6.1...v0.6.2) (2020-06-11)
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vue/composition-api",
-  "version": "0.6.2",
+  "version": "0.6.3",
   "description": "Provide logic composition capabilities for Vue.",
   "keywords": [
     "vue",
@@ -25,7 +25,7 @@
     "dist"
   ],
   "scripts": {
-    "start": "cross-env TARGET=es rollup -c -w",
+    "start": "concurrently \"tsc --emitDeclarationOnly -w\" \"cross-env TARGET=es rollup -c -w\"",
     "build": "rimraf dist typings && tsc --emitDeclarationOnly && rollup -c",
     "lint": "prettier --write --parser typescript \"{src,test,test-dts}/*.ts?(x)\" && prettier --write \"{src,test}/*.js\"",
     "test": "yarn test-dts && yarn test-unit",
@@ -35,7 +35,7 @@
     "prepublish": "yarn test",
     "postpublish": "yarn release-gh",
     "version": "yarn changelog && git add CHANGELOG.md",
-    "release": "yarn version && yarn publish",
+    "release": "yarn publish",
     "release-gh": "conventional-github-releaser -p angular"
   },
   "bugs": {
@@ -47,6 +47,7 @@
     "@rollup/plugin-replace": "^2.3.2",
     "@types/jest": "^25.2.3",
     "@types/node": "^14.0.6",
+    "concurrently": "^5.2.0",
     "conventional-changelog-cli": "^2.0.31",
     "conventional-github-releaser": "^3.1.3",
     "cross-env": "^7.0.2",

rollup.config.js

@@ -87,7 +87,7 @@ function genConfig({ outFile, format, mode }) {
 let buildConfig
 
 if (process.env.TARGET) {
-  buildConfig = genConfig(builds[process.env.TARGET])
+  buildConfig = [genConfig(builds[process.env.TARGET])]
 } else {
   buildConfig = getAllBuilds()
 }

src/component/componentProps.ts

@@ -34,6 +34,16 @@ type RequiredKeys<T, MakeDefaultRequired> = {
 
 type OptionalKeys<T, MakeDefaultRequired> = Exclude<keyof T, RequiredKeys<T, MakeDefaultRequired>>;
 
+type ExtractFunctionPropType<
+  T extends Function,
+  TArgs extends Array<any> = any[],
+  TResult = any
+> = T extends (...args: TArgs) => TResult ? T : never;
+
+type ExtractCorrectPropType<T> = T extends Function
+  ? ExtractFunctionPropType<T>
+  : Exclude<T, Function>;
+
 // prettier-ignore
 type InferPropType<T> = T extends null
   ? any // null & true would fail to infer
@@ -43,7 +53,8 @@ type InferPropType<T> = T extends null
       ? { [key: string]: any }
       : T extends BooleanConstructor | { type: BooleanConstructor }
         ? boolean
-        : T extends Prop<infer V> ? V : T;
+        : T extends Prop<infer V>
+          ? ExtractCorrectPropType<V> : T;
 
 export type ExtractPropTypes<O, MakeDefaultRequired extends boolean = true> = O extends object
   ? { [K in RequiredKeys<O, MakeDefaultRequired>]: InferPropType<O[K]> } &

src/reactivity/unwrap.ts

@@ -1,29 +1,16 @@
 import { isRef } from './ref'
-import { proxy, isFunction, isObject, isArray } from '../utils'
+import { proxy, isFunction, isPlainObject, isArray } from '../utils'
 import { isReactive } from './reactive'
 
 export function unwrapRefProxy(value: any) {
-  if (isFunction(value)) {
-    return value
-  }
-
-  if (isRef(value)) {
-    return value
-  }
-
-  if (isArray(value)) {
-    return value
-  }
-
-  if (isReactive(value)) {
-    return value
-  }
-
-  if (!isObject(value)) {
-    return value
-  }
-
-  if (!Object.isExtensible(value)) {
+  if (
+    isFunction(value) ||
+    isRef(value) ||
+    isArray(value) ||
+    isReactive(value) ||
+    !isPlainObject(value) ||
+    !Object.isExtensible(value)
+  ) {
     return value
   }
 

test/setup.spec.js

@@ -568,6 +568,60 @@ describe('setup', () => {
     ).toMatchObject([{ value: 1 }])
   })
 
+  it('should not unwrap built-in objects on the template', () => {
+    const date = new Date('2020-01-01')
+    const regex = /a(b).*/
+    const dateString = date.toString()
+    const regexString = regex.toString()
+    const mathString = Math.toString()
+
+    const vm = new Vue({
+      setup() {
+        return {
+          raw_date: date,
+          nested_date: {
+            a: date,
+            b: date,
+          },
+          raw_regex: regex,
+          nested_regex: {
+            a: regex,
+            b: regex,
+          },
+          math: Math,
+        }
+      },
+      template: `<div>
+        <p id="raw_date">{{raw_date}}</p>
+        <p id="nested_date">{{nested_date}}</p>
+        <p id="raw_regex">{{raw_regex}}</p>
+        <p id="nested_regex_a">{{nested_regex.a}}</p>
+        <p id="nested_regex_b">{{nested_regex.b}}</p>
+        <p id="math">{{math}}</p>
+      </div>`,
+    }).$mount()
+
+    expect(vm.$el.querySelector('#raw_date').textContent).toBe(dateString)
+    expect(
+      JSON.parse(vm.$el.querySelector('#nested_date').textContent)
+    ).toMatchObject(
+      JSON.parse(
+        JSON.stringify({
+          a: date,
+          b: date,
+        })
+      )
+    )
+    expect(vm.$el.querySelector('#raw_regex').textContent).toBe(regexString)
+    expect(vm.$el.querySelector('#nested_regex_a').textContent).toBe(
+      regexString
+    )
+    expect(vm.$el.querySelector('#nested_regex_b').textContent).toBe(
+      regexString
+    )
+    expect(vm.$el.querySelector('#math').textContent).toBe(mathString)
+  })
+
   describe('Methods', () => {
     it('binds methods when calling with parenthesis', async () => {
       let context = null

test/types/defineComponent.spec.ts

@@ -122,7 +122,7 @@ describe('defineComponent', () => {
       },
       setup(props) {
         type PropsType = typeof props;
-        isSubType<{ user?: User }, PropsType>(true);
+        isSubType<{ user?: User; func?: () => boolean; userFunc?: (u: User) => User }, PropsType>(true);
         isSubType<PropsType, { user?: User; func?: () => boolean; userFunc?: (u: User) => User }>(
           true
         );