quasar 2.4.13 → 2.5.3

package/src/components/editor/__tests__/QEditor.spec.js

@@ -0,0 +1,195 @@
+describe('Editor API', () => {
+  describe('Props', () => {
+    describe('Category: behavior', () => {
+      describe('(prop): paragraph-tag', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+    })
+
+    describe('Category: content', () => {
+      describe('(prop): placeholder', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+    })
+
+    describe('Category: model', () => {
+      describe('(prop): model-value', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+    })
+
+    describe('Category: state', () => {
+      describe('(prop): readonly', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): disable', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+    })
+
+    describe('Category: style', () => {
+      describe('(prop): square', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): flat', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): dense', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): dark', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): min-height', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): max-height', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): height', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): content-style', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): content-class', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+    })
+
+    describe('Category: toolbar', () => {
+      describe('(prop): definitions', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): fonts', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): toolbar', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): toolbar-color', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): toolbar-text-color', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): toolbar-toggle-color', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): toolbar-bg', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+    })
+
+    describe('Category: toolbar|style', () => {
+      describe('(prop): toolbar-outline', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): toolbar-push', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): toolbar-rounded', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+    })
+  })
+
+  describe('Events', () => {
+    describe('(event): update:model-value', () => {
+      it.skip(' ', () => {
+        //
+      })
+    })
+  })
+
+  describe('Methods', () => {
+    describe('(method): runCmd', () => {
+      it.skip(' ', () => {
+        //
+      })
+    })
+
+    describe('(method): refreshToolbar', () => {
+      it.skip(' ', () => {
+        //
+      })
+    })
+
+    describe('(method): focus', () => {
+      it.skip(' ', () => {
+        //
+      })
+    })
+
+    describe('(method): getContentEl', () => {
+      it.skip(' ', () => {
+        //
+      })
+    })
+  })
+})

package/src/components/field/QField.sass

@@ -45,6 +45,7 @@ $field-transition-label-right-up: .324s cubic-bezier(.4,0,.2,1)
     line-height: 1
     color: rgba(0,0,0,.54)
     padding: 8px 12px 0
+    backface-visibility: hidden
 
     &--animated
       transform: translateY(100%)
@@ -190,6 +191,7 @@ $field-transition-label-right-up: .324s cubic-bezier(.4,0,.2,1)
     text-transform: inherit
     transform-origin: left top
     transition: transform $field-transition, max-width $field-transition-label-right-up
+    backface-visibility: hidden
 
   &--float .q-field__label
     max-width: 133%

package/src/components/form/QForm.js

@@ -33,7 +33,7 @@ export default createComponent({
         ? shouldFocus
         : props.noErrorFocus !== true
 
-      validateIndex++
+      const index = ++validateIndex
 
       const emitEvent = (res, ref) => {
         emit('validation-' + (res === true ? 'success' : 'error'), ref)
@@ -47,7 +47,7 @@ export default createComponent({
           promises.push(
             valid.then(
               valid => ({ valid, comp }),
-              error => ({ valid: false, comp, error })
+              err => ({ valid: false, comp, err })
             )
           )
         }
@@ -71,34 +71,33 @@ export default createComponent({
         return Promise.resolve(true)
       }
 
-      const index = validateIndex
-
-      return Promise.all(promises).then(
-        res => {
-          if (index === validateIndex) {
-            const errors = res.filter(r => r.valid !== true)
+      return Promise.all(promises).then(res => {
+        const errors = res.filter(r => r.valid !== true)
 
-            if (errors.length === 0) {
-              emitEvent(true)
-              return true
-            }
+        if (errors.length === 0) {
+          index === validateIndex && emitEvent(true)
+          return true
+        }
 
-            const { valid, comp } = errors[ 0 ]
+        const { valid, comp, err } = errors[ 0 ]
 
-            emitEvent(false, comp)
+        // if not outdated already
+        if (index === validateIndex) {
+          err !== void 0 && console.error(err)
 
-            if (
-              focus === true
-              && valid !== true
-              && typeof comp.focus === 'function'
-            ) {
-              comp.focus()
-            }
+          emitEvent(false, comp)
 
-            return false
+          if (
+            focus === true
+            && valid !== true
+            && typeof comp.focus === 'function'
+          ) {
+            comp.focus()
           }
         }
-      )
+
+        return false
+      })
     }
 
     function resetValidation () {
@@ -112,8 +111,11 @@ export default createComponent({
     function submit (evt) {
       evt !== void 0 && stopAndPrevent(evt)
 
+      const index = validateIndex + 1
+
       validate().then(val => {
-        if (val === true) {
+        // if not outdated && validation succeeded
+        if (index === validateIndex && val === true) {
           if (props.onSubmit !== void 0) {
             emit('submit', evt)
           }

package/src/components/input/QInput.js

@@ -125,6 +125,15 @@ export default createComponent({
       return attrs
     })
 
+    // some browsers lose the native input value
+    // so we need to reattach it dynamically
+    // (like type="password" <-> type="text"; see #12078)
+    watch(() => props.type, () => {
+      if (inputRef.value) {
+        inputRef.value.value = props.modelValue
+      }
+    })
+
     watch(() => props.modelValue, v => {
       if (hasMask.value === true) {
         if (stopValueWatcher === true) {

package/src/components/input/__tests__/QInput.spec.js

@@ -0,0 +1,105 @@
+describe('Input API', () => {
+  describe('Props', () => {
+    describe('Category: content', () => {
+      describe('(prop): shadow-text', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): autogrow', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+    })
+
+    describe('Category: general', () => {
+      describe('(prop): type', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+    })
+
+    describe('Category: model', () => {
+      describe('(prop): model-value', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): debounce', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): maxlength', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+    })
+
+    describe('Category: style', () => {
+      describe('(prop): input-class', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): input-style', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+    })
+  })
+
+  describe('Events', () => {
+    describe('(event): update:model-value', () => {
+      it.skip(' ', () => {
+        //
+      })
+    })
+
+    describe('(event): focus', () => {
+      it.skip(' ', () => {
+        //
+      })
+    })
+
+    describe('(event): blur', () => {
+      it.skip(' ', () => {
+        //
+      })
+    })
+  })
+
+  describe('Methods', () => {
+    describe('(method): focus', () => {
+      it.skip(' ', () => {
+        //
+      })
+    })
+
+    describe('(method): blur', () => {
+      it.skip(' ', () => {
+        //
+      })
+    })
+
+    describe('(method): select', () => {
+      it.skip(' ', () => {
+        //
+      })
+    })
+
+    describe('(method): getNativeElement', () => {
+      it.skip(' ', () => {
+        //
+      })
+    })
+  })
+})

package/src/components/input/__tests__/use-mask.spec.js

@@ -0,0 +1,29 @@
+describe('use-mask API', () => {
+  describe('Props', () => {
+    describe('Category: behavior', () => {
+      describe('(prop): mask', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): fill-mask', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): reverse-fill-mask', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+
+      describe('(prop): unmasked-value', () => {
+        it.skip(' ', () => {
+          //
+        })
+      })
+    })
+  })
+})