quasar 2.18.6 → 2.19.0

package/src/components/video/QVideo.test.js

@@ -7,8 +7,8 @@ describe('[QVideo API]', () => {
   describe('[Props]', () => {
     describe('[(prop)ratio]', () => {
       test.each([
-        [ 'String', '5' ],
-        [ 'Number', 5 ]
+        ['String', '5'],
+        ['Number', 5]
       ])('type %s has effect', async (_, propVal) => {
         const wrapper = mount(QVideo, {
           props: {
@@ -16,18 +16,12 @@ describe('[QVideo API]', () => {
           }
         })
 
-        expect(
-          wrapper.get('.q-video')
-            .$style('padding-bottom')
-        ).toBe('')
+        expect(wrapper.get('.q-video').$style('padding-bottom')).toBe('')
 
         await wrapper.setProps({ ratio: propVal })
         await flushPromises()
 
-        expect(
-          wrapper.get('.q-video')
-            .$style('padding-bottom')
-        ).toBe('20%')
+        expect(wrapper.get('.q-video').$style('padding-bottom')).toBe('20%')
       })
     })
 
@@ -40,10 +34,7 @@ describe('[QVideo API]', () => {
           }
         })
 
-        expect(
-          wrapper.get('iframe')
-            .attributes('src')
-        ).toBe(propVal)
+        expect(wrapper.get('iframe').attributes('src')).toBe(propVal)
       })
     })
 
@@ -55,85 +46,68 @@ describe('[QVideo API]', () => {
           }
         })
 
-        expect(
-          wrapper.get('iframe')
-            .attributes('title')
-        ).toBeUndefined()
+        expect(wrapper.get('iframe').attributes('title')).toBeUndefined()
 
         const propVal = 'My Daily Marathon'
         await wrapper.setProps({ title: propVal })
         await flushPromises()
 
-        expect(
-          wrapper.get('iframe')
-            .attributes('title')
-        ).toBe(propVal)
+        expect(wrapper.get('iframe').attributes('title')).toBe(propVal)
       })
     })
 
     describe('[(prop)fetchpriority]', () => {
-      test.each([
-        [ 'high' ],
-        [ 'low' ],
-        [ 'auto' ]
-      ])('value "%s" has effect', async propVal => {
-        const wrapper = mount(QVideo, {
-          props: {
-            src: 'https://www.youtube.com/embed/k3_tw44QsZQ'
-          }
-        })
-
-        expect(
-          wrapper.get('iframe')
-            .attributes('fetchpriority')
-        ).toBe('auto')
-
-        await wrapper.setProps({ fetchpriority: propVal })
-        await flushPromises()
-
-        expect(
-          wrapper.get('iframe')
-            .attributes('fetchpriority')
-        ).toBe(propVal)
-      })
+      test.each([['high'], ['low'], ['auto']])(
+        'value "%s" has effect',
+        async propVal => {
+          const wrapper = mount(QVideo, {
+            props: {
+              src: 'https://www.youtube.com/embed/k3_tw44QsZQ'
+            }
+          })
+
+          expect(wrapper.get('iframe').attributes('fetchpriority')).toBe('auto')
+
+          await wrapper.setProps({ fetchpriority: propVal })
+          await flushPromises()
+
+          expect(wrapper.get('iframe').attributes('fetchpriority')).toBe(
+            propVal
+          )
+        }
+      )
     })
 
     describe('[(prop)loading]', () => {
-      test.each([
-        [ 'eager' ],
-        [ 'lazy' ]
-      ])('value "%s" has effect', async propVal => {
-        const wrapper = mount(QVideo, {
-          props: {
-            src: 'https://www.youtube.com/embed/k3_tw44QsZQ'
-          }
-        })
-
-        expect(
-          wrapper.get('iframe')
-            .attributes('loading')
-        ).toBe('eager')
-
-        await wrapper.setProps({ loading: propVal })
-        await flushPromises()
-
-        expect(
-          wrapper.get('iframe')
-            .attributes('loading')
-        ).toBe(propVal)
-      })
+      test.each([['eager'], ['lazy']])(
+        'value "%s" has effect',
+        async propVal => {
+          const wrapper = mount(QVideo, {
+            props: {
+              src: 'https://www.youtube.com/embed/k3_tw44QsZQ'
+            }
+          })
+
+          expect(wrapper.get('iframe').attributes('loading')).toBe('eager')
+
+          await wrapper.setProps({ loading: propVal })
+          await flushPromises()
+
+          expect(wrapper.get('iframe').attributes('loading')).toBe(propVal)
+        }
+      )
     })
 
     describe('[(prop)referrerpolicy]', () => {
       test.each([
-        [ 'no-referrer' ],
-        [ 'no-referrer-when-downgrade' ],
-        [ 'origin' ],
-        [ 'origin-when-cross-origin' ],
-        [ 'same-origin' ],
-        [ 'strict-origin' ],
-        [ 'strict-origin-when-cross-origin' ],
-        [ 'unsafe-url' ]
+        ['no-referrer'],
+        ['no-referrer-when-downgrade'],
+        ['origin'],
+        ['origin-when-cross-origin'],
+        ['same-origin'],
+        ['strict-origin'],
+        ['strict-origin-when-cross-origin'],
+        ['unsafe-url']
       ])('value "%s" has effect', async propVal => {
         const wrapper = mount(QVideo, {
           props: {
@@ -141,18 +115,14 @@ describe('[QVideo API]', () => {
           }
         })
 
-        expect(
-          wrapper.get('iframe')
-            .attributes('referrerpolicy')
-        ).toBe('strict-origin-when-cross-origin')
+        expect(wrapper.get('iframe').attributes('referrerpolicy')).toBe(
+          'strict-origin-when-cross-origin'
+        )
 
         await wrapper.setProps({ referrerpolicy: propVal })
         await flushPromises()
 
-        expect(
-          wrapper.get('iframe')
-            .attributes('referrerpolicy')
-        ).toBe(propVal)
+        expect(wrapper.get('iframe').attributes('referrerpolicy')).toBe(propVal)
       })
     })
   })

package/src/components/video/index.js

@@ -1,5 +1,3 @@
 import QVideo from './QVideo.js'
 
-export {
-  QVideo
-}
+export { QVideo }

package/src/components/virtual-scroll/QVirtualScroll.js

@@ -1,10 +1,23 @@
-import { h, ref, computed, watch, onBeforeMount, onMounted, onBeforeUnmount, onActivated, onDeactivated } from 'vue'
+import {
+  h,
+  ref,
+  computed,
+  watch,
+  onBeforeMount,
+  onMounted,
+  onBeforeUnmount,
+  onActivated,
+  onDeactivated
+} from 'vue'
 
 import QList from '../item/QList.js'
 import QMarkupTable from '../markup-table/QMarkupTable.js'
 import getTableMiddle from '../table/get-table-middle.js'
 
-import { useVirtualScroll, useVirtualScrollProps } from './use-virtual-scroll.js'
+import {
+  useVirtualScroll,
+  useVirtualScrollProps
+} from './use-virtual-scroll.js'
 
 import { createComponent } from '../../utils/private.create/create.js'
 import { getScrollTarget, scrollTargetProp } from '../../utils/scroll/scroll.js'
@@ -16,7 +29,7 @@ const comps = {
   table: QMarkupTable
 }
 
-const typeOptions = [ 'list', 'table', '__qtable' ]
+const typeOptions = ['list', 'table', '__qtable']
 
 export default createComponent({
   name: 'QVirtualScroll',
@@ -41,15 +54,17 @@ export default createComponent({
     scrollTarget: scrollTargetProp
   },
 
-  setup (props, { slots, attrs }) {
+  setup(props, { slots, attrs }) {
     let localScrollTarget
     const rootRef = ref(null)
 
-    const virtualScrollLength = computed(() => (
+    const virtualScrollLength = computed(() =>
       props.itemsSize >= 0 && props.itemsFn !== void 0
         ? parseInt(props.itemsSize, 10)
-        : (Array.isArray(props.items) ? props.items.length : 0)
-    ))
+        : Array.isArray(props.items)
+          ? props.items.length
+          : 0
+    )
 
     const {
       virtualScrollSliceRange,
@@ -57,7 +72,9 @@ export default createComponent({
       padVirtualScroll,
       onVirtualScrollEvt
     } = useVirtualScroll({
-      virtualScrollLength, getVirtualScrollTarget, getVirtualScrollEl
+      virtualScrollLength,
+      getVirtualScrollTarget,
+      getVirtualScrollEl
     })
 
     const virtualScrollScope = computed(() => {
@@ -71,49 +88,78 @@ export default createComponent({
       })
 
       return props.itemsFn === void 0
-        ? props.items.slice(virtualScrollSliceRange.value.from, virtualScrollSliceRange.value.to).map(mapFn)
-        : props.itemsFn(virtualScrollSliceRange.value.from, virtualScrollSliceRange.value.to - virtualScrollSliceRange.value.from).map(mapFn)
+        ? props.items
+            .slice(
+              virtualScrollSliceRange.value.from,
+              virtualScrollSliceRange.value.to
+            )
+            .map(mapFn)
+        : props
+            .itemsFn(
+              virtualScrollSliceRange.value.from,
+              virtualScrollSliceRange.value.to -
+                virtualScrollSliceRange.value.from
+            )
+            .map(mapFn)
     })
 
-    const classes = computed(() =>
-      'q-virtual-scroll q-virtual-scroll' + (props.virtualScrollHorizontal === true ? '--horizontal' : '--vertical')
-      + (props.scrollTarget !== void 0 ? '' : ' scroll')
+    const classes = computed(
+      () =>
+        'q-virtual-scroll q-virtual-scroll' +
+        (props.virtualScrollHorizontal === true
+          ? '--horizontal'
+          : '--vertical') +
+        (props.scrollTarget !== void 0 ? '' : ' scroll')
     )
 
-    const attributes = computed(() => (
+    const attributes = computed(() =>
       props.scrollTarget !== void 0 ? {} : { tabindex: 0 }
-    ))
+    )
 
     watch(virtualScrollLength, () => {
       localResetVirtualScroll()
     })
 
-    watch(() => props.scrollTarget, () => {
-      unconfigureScrollTarget()
-      configureScrollTarget()
-    })
+    watch(
+      () => props.scrollTarget,
+      () => {
+        unconfigureScrollTarget()
+        configureScrollTarget()
+      }
+    )
 
-    function getVirtualScrollEl () {
+    function getVirtualScrollEl() {
       return rootRef.value.$el || rootRef.value
     }
 
-    function getVirtualScrollTarget () {
+    function getVirtualScrollTarget() {
       return localScrollTarget
     }
 
-    function configureScrollTarget () {
-      localScrollTarget = getScrollTarget(getVirtualScrollEl(), props.scrollTarget)
-      localScrollTarget.addEventListener('scroll', onVirtualScrollEvt, listenOpts.passive)
+    function configureScrollTarget() {
+      localScrollTarget = getScrollTarget(
+        getVirtualScrollEl(),
+        props.scrollTarget
+      )
+      localScrollTarget.addEventListener(
+        'scroll',
+        onVirtualScrollEvt,
+        listenOpts.passive
+      )
     }
 
-    function unconfigureScrollTarget () {
+    function unconfigureScrollTarget() {
       if (localScrollTarget !== void 0) {
-        localScrollTarget.removeEventListener('scroll', onVirtualScrollEvt, listenOpts.passive)
+        localScrollTarget.removeEventListener(
+          'scroll',
+          onVirtualScrollEvt,
+          listenOpts.passive
+        )
         localScrollTarget = void 0
       }
     }
 
-    function __getVirtualChildren () {
+    function __getVirtualChildren() {
       let child = padVirtualScroll(
         props.type === 'list' ? 'div' : 'tbody',
         virtualScrollScope.value.map(slots.default)
@@ -148,21 +194,27 @@ export default createComponent({
 
     return () => {
       if (slots.default === void 0) {
-        console.error('QVirtualScroll: default scoped slot is required for rendering')
+        console.error(
+          'QVirtualScroll: default scoped slot is required for rendering'
+        )
         return
       }
 
       return props.type === '__qtable'
         ? getTableMiddle(
-          { ref: rootRef, class: 'q-table__middle ' + classes.value },
-          __getVirtualChildren()
-        )
-        : h(comps[ props.type ], {
-          ...attrs,
-          ref: rootRef,
-          class: [ attrs.class, classes.value ],
-          ...attributes.value
-        }, __getVirtualChildren)
+            { ref: rootRef, class: 'q-table__middle ' + classes.value },
+            __getVirtualChildren()
+          )
+        : h(
+            comps[props.type],
+            {
+              ...attrs,
+              ref: rootRef,
+              class: [attrs.class, classes.value],
+              ...attributes.value
+            },
+            __getVirtualChildren
+          )
     }
   }
 })

package/src/components/virtual-scroll/QVirtualScroll.json

@@ -1,5 +1,5 @@
 {
-  "mixins": [ "components/virtual-scroll/use-virtual-scroll" ],
+  "mixins": ["components/virtual-scroll/use-virtual-scroll"],
 
   "meta": {
     "docsUrl": "https://v2.quasar.dev/vue-components/virtual-scroll"
@@ -10,7 +10,7 @@
       "type": "String",
       "desc": "The type of content: list (default) or table",
       "default": "'list'",
-      "values": [ "'list'", "'table'" ],
+      "values": ["'list'", "'table'"],
       "category": "content"
     },
 
@@ -19,8 +19,8 @@
       "desc": "Available list items that will be passed to the scoped slot; For best performance freeze the list of items; Required if 'itemsFn' is not supplied",
       "default": "[]",
       "examples": [
-        "[ 'Tesla', 'iPhone' ]",
-        "[ { label: 'Tesla', value: 'car' }, { label: 'iPhone', value: 'phone' } ]"
+        "['Tesla', 'iPhone']",
+        "[{ label: 'Tesla', value: 'car' }, { label: 'iPhone', value: 'phone' }]"
       ],
       "category": "content"
     },
@@ -28,7 +28,7 @@
     "items-size": {
       "type": "Number",
       "desc": "Number of available items in the list; Required and used only if 'itemsFn' is provided",
-      "examples": [ "100000" ],
+      "examples": ["100000"],
       "category": "content"
     },
 
@@ -76,7 +76,7 @@
     }
   },
 
-  "slots" : {
+  "slots": {
     "before": {
       "desc": "Template slot for the elements that should be rendered before the list; Suggestion: thead before a table"
     },

package/src/components/virtual-scroll/index.js

@@ -1,5 +1,3 @@
 import QVirtualScroll from './QVirtualScroll.js'
 
-export {
-  QVirtualScroll
-}
+export { QVirtualScroll }