feat: change WrapperArray.wrappers and WrapperArray.length to read-only

Author: 38elements

Diff for: docs/api/wrapper-array/README.md

@@ -4,13 +4,13 @@ A `WrapperArray` is an object that contains an array of [`Wrappers`](../wrapper/
 
 ## Properties
 
-### `wrappers` 
+### `wrappers`
 
-`array`: the `Wrappers` contained in the `WrapperArray`  
+`array` (read-only): the `Wrappers` contained in the `WrapperArray`
 
-### `length` 
+### `length`
 
-`number`: the number of `Wrappers` contained in the `WrapperArray`
+`number` (read-only): the number of `Wrappers` contained in the `WrapperArray`
 
 ## Methods
 

Diff for: docs/api/wrapper/README.md

@@ -14,13 +14,13 @@ A `Wrapper` is an object that contains a mounted component or vnode and methods
 
 `HTMLElement` (read-only): the root DOM node of the wrapper
 
-### `options` 
+### `options`
 
 #### `options.attachedToDocument`
 
 `Boolean` (read-only): True if `attachedToDocument` in mounting options was `true`
 
-#### `options.sync` 
+#### `options.sync`
 
 `Boolean` (read-only): True if `sync` in mounting options was not `false`
 

Diff for: packages/test-utils/src/wrapper-array.js

@@ -5,12 +5,21 @@ import type VueWrapper from './vue-wrapper'
 import { throwError, warn } from 'shared/util'
 
 export default class WrapperArray implements BaseWrapper {
-  wrappers: Array<Wrapper | VueWrapper>;
-  length: number;
+  +wrappers: Array<Wrapper | VueWrapper>;
+  +length: number;
 
   constructor (wrappers: Array<Wrapper | VueWrapper>) {
-    this.wrappers = wrappers || []
-    this.length = this.wrappers.length
+    const length = wrappers.length
+    // $FlowIgnore
+    Object.defineProperty(this, 'wrappers', {
+      get: () => wrappers,
+      set: () => {}
+    })
+    // $FlowIgnore
+    Object.defineProperty(this, 'length', {
+      get: () => length,
+      set: () => {}
+    })
   }
 
   at (index: number): Wrapper | VueWrapper {

Diff for: packages/test-utils/src/wrapper.js

@@ -814,7 +814,7 @@ export default class Wrapper implements BaseWrapper {
    */
   destroy () {
     if (!this.isVueInstance()) {
-      throwError(`wrapper.destroy() can only be called on a Vue ` + `instance`)
+      throwError(`wrapper.destroy() can only be called on a Vue instance`)
     }
 
     if (this.element.parentNode) {

Diff for: test/specs/wrapper-array.spec.js

@@ -7,11 +7,7 @@ describeWithShallowAndMount('WrapperArray', mountingMethod => {
     const wrapper = mountingMethod(compiled)
     const wrapperArray = wrapper.findAll('p')
     expect(wrapperArray.constructor.name).to.equal('WrapperArray')
-    if (wrappers) {
-      wrapperArray.wrappers = wrappers
-      wrapperArray.length = wrappers.length
-    }
-    return wrapperArray
+    return wrappers ? new wrapperArray.constructor(wrappers) : wrapperArray
   }
 
   it('returns class with length equal to length of wrappers passed in constructor', () => {
@@ -67,8 +63,7 @@ describeWithShallowAndMount('WrapperArray', mountingMethod => {
       if (method === 'at') {
         return
       }
-      const wrapperArray = getWrapperArray()
-      wrapperArray.wrappers = []
+      const wrapperArray = getWrapperArray([])
       const message = `[vue-test-utils]: ${method} cannot be called on 0 items`
       expect(() => wrapperArray[method]())
         .to.throw()
@@ -99,8 +94,7 @@ describeWithShallowAndMount('WrapperArray', mountingMethod => {
       ) {
         return
       }
-      const wrapperArray = getWrapperArray()
-      wrapperArray.wrappers = [1, 2, 3]
+      const wrapperArray = getWrapperArray([1, 2, 3])
       const message = `[vue-test-utils]: ${method} must be called on a single wrapper, use at(i) to access a wrapper`
       expect(() => wrapperArray[method]())
         .to.throw()