handle v-model select initial value edge cases in IE (fix vuejs#2983)

yyx990803 · yyx990803 · commit aab74bd7ce58 · 2016-06-16T16:30:42.000-04:00
diff --git a/src/directives/public/model/select.js b/src/directives/public/model/select.js
@@ -1,4 +1,10 @@
-import { isArray, toNumber, looseEqual } from '../../../util/index'
+import {
+  inDoc,
+  isArray,
+  toNumber,
+  looseEqual,
+  nextTick
+} from '../../../util/index'
 
 export default {
 
@@ -39,11 +45,16 @@ export default {
     // selectedIndex with value -1 to 0 when the element
     // is appended to a new parent, therefore we have to
     // force a DOM update whenever that happens...
-    this.vm.$on('hook:attached', this.forceUpdate)
+    this.vm.$on('hook:attached', () => {
+      nextTick(this.forceUpdate)
+    })
   },
 
   update (value) {
     var el = this.el
+    if (!inDoc(el)) {
+      return nextTick(this.forceUpdate)
+    }
     el.selectedIndex = -1
     var multi = this.multiple && isArray(value)
     var options = el.options
diff --git a/src/util/env.js b/src/util/env.js
@@ -13,6 +13,7 @@ export const devtools = inBrowser && window.__VUE_DEVTOOLS_GLOBAL_HOOK__
 
 // UA sniffing for working around browser-specific quirks
 const UA = inBrowser && window.navigator.userAgent.toLowerCase()
+export const isIE = UA && UA.indexOf('trident') > 0
 export const isIE9 = UA && UA.indexOf('msie 9.0') > 0
 export const isAndroid = UA && UA.indexOf('android') > 0
 export const isIos = UA && /(iphone|ipad|ipod|ios)/i.test(UA)
diff --git a/test/unit/specs/directives/public/model_spec.js b/test/unit/specs/directives/public/model_spec.js
@@ -235,7 +235,7 @@ describe('v-model', function () {
     })
   })
 
-  it('select persist non-selected on append', function () {
+  it('select persist non-selected on append', function (done) {
     var vm = new Vue({
       el: el,
       data: {
@@ -249,12 +249,17 @@ describe('v-model', function () {
           '<option>c</option>' +
         '</select>'
     })
-    expect(vm.$el.value).toBe('')
-    expect(vm.$el.selectedIndex).toBe(-1)
-    vm.$remove()
-    vm.$appendTo(document.body)
-    expect(vm.$el.value).toBe('')
-    expect(vm.$el.selectedIndex).toBe(-1)
+    _.nextTick(function () {
+      expect(vm.$el.value).toBe('')
+      expect(vm.$el.selectedIndex).toBe(-1)
+      vm.$remove()
+      vm.$appendTo(document.body)
+      _.nextTick(function () {
+        expect(vm.$el.value).toBe('')
+        expect(vm.$el.selectedIndex).toBe(-1)
+        done()
+      })
+    })
   })
 
   it('select template default value', function () {
