fix(reactivity): explicitly do type conversions in warning strings (#129)

packages/reactivity/__tests__/readonly.spec.ts

@@ -13,6 +13,11 @@ import {
 } from '../src'
 import { mockWarn } from '@vue/runtime-test'
 
+/**
+ * @see https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-4.html
+ */
+type Writable<T> = { -readonly [P in keyof T]: T[P] }
+
 describe('reactivity/readonly', () => {
   mockWarn()
 
@@ -38,27 +43,51 @@ describe('reactivity/readonly', () => {
     })
 
     it('should not allow mutation', () => {
-      const observed: any = readonly({ foo: 1, bar: { baz: 2 } })
+      const qux = Symbol('qux')
+      const original = {
+        foo: 1,
+        bar: {
+          baz: 2
+        },
+        [qux]: 3
+      }
+      const observed: Writable<typeof original> = readonly(original)
+
       observed.foo = 2
       expect(observed.foo).toBe(1)
       expect(
         `Set operation on key "foo" failed: target is readonly.`
       ).toHaveBeenWarnedLast()
+
       observed.bar.baz = 3
       expect(observed.bar.baz).toBe(2)
       expect(
         `Set operation on key "baz" failed: target is readonly.`
       ).toHaveBeenWarnedLast()
+
+      observed[qux] = 4
+      expect(observed[qux]).toBe(3)
+      expect(
+        `Set operation on key "Symbol(qux)" failed: target is readonly.`
+      ).toHaveBeenWarnedLast()
+
       delete observed.foo
       expect(observed.foo).toBe(1)
       expect(
         `Delete operation on key "foo" failed: target is readonly.`
       ).toHaveBeenWarnedLast()
+
       delete observed.bar.baz
       expect(observed.bar.baz).toBe(2)
       expect(
         `Delete operation on key "baz" failed: target is readonly.`
       ).toHaveBeenWarnedLast()
+
+      delete observed[qux]
+      expect(observed[qux]).toBe(3)
+      expect(
+        `Delete operation on key "Symbol(qux)" failed: target is readonly.`
+      ).toHaveBeenWarnedLast()
     })
 
     it('should allow mutation when unlocked', () => {

packages/reactivity/src/baseHandlers.ts

@@ -107,7 +107,7 @@ export const readonlyHandlers: ProxyHandler<any> = {
     if (LOCKED) {
       if (__DEV__) {
         console.warn(
-          `Set operation on key "${key as any}" failed: target is readonly.`,
+          `Set operation on key "${String(key)}" failed: target is readonly.`,
           target
         )
       }
@@ -121,7 +121,9 @@ export const readonlyHandlers: ProxyHandler<any> = {
     if (LOCKED) {
       if (__DEV__) {
         console.warn(
-          `Delete operation on key "${key as any}" failed: target is readonly.`,
+          `Delete operation on key "${String(
+            key
+          )}" failed: target is readonly.`,
           target
         )
       }