quasar 2.18.6 → 2.19.0

package/src/install-quasar.js

@@ -1,6 +1,8 @@
 import { createApp } from 'vue'
 
-import Platform, { isRuntimeSsrPreHydration } from './plugins/platform/Platform.js'
+import Platform, {
+  isRuntimeSsrPreHydration
+} from './plugins/platform/Platform.js'
 import Screen from './plugins/screen/Screen.js'
 import Dark from './plugins/dark/Dark.js'
 import Body from './plugins/private.body/Body.js'
@@ -9,7 +11,11 @@ import Lang from './plugins/lang/Lang.js'
 import IconSet from './plugins/icon-set/IconSet.js'
 
 import { quasarKey } from './utils/private.symbols/symbols.js'
-import { globalConfig, globalConfigIsFrozen, freezeGlobalConfig } from './utils/private.config/instance-config.js'
+import {
+  globalConfig,
+  globalConfigIsFrozen,
+  freezeGlobalConfig
+} from './utils/private.config/instance-config.js'
 import { isObject } from './utils/is/is.js'
 
 /**
@@ -27,7 +33,7 @@ const autoInstalledPlugins = [
   IconSet
 ]
 
-export function createChildApp (appCfg, parentApp) {
+export function createChildApp(appCfg, parentApp) {
   const app = createApp(appCfg)
 
   app.config.globalProperties = parentApp.config.globalProperties
@@ -38,107 +44,117 @@ export function createChildApp (appCfg, parentApp) {
   return app
 }
 
-function installPlugins (pluginOpts, pluginList) {
+function installPlugins(pluginOpts, pluginList) {
   pluginList.forEach(Plugin => {
     Plugin.install(pluginOpts)
     Plugin.__installed = true
   })
 }
 
-function prepareApp (app, uiOpts, pluginOpts) {
+function prepareApp(app, uiOpts, pluginOpts) {
   app.config.globalProperties.$q = pluginOpts.$q
   app.provide(quasarKey, pluginOpts.$q)
 
   installPlugins(pluginOpts, autoInstalledPlugins)
 
-  uiOpts.components !== void 0 && Object.values(uiOpts.components).forEach(c => {
-    if (isObject(c) === true && c.name !== void 0) {
-      app.component(c.name, c)
-    }
-  })
+  if (uiOpts.components !== void 0) {
+    Object.values(uiOpts.components).forEach(c => {
+      if (isObject(c) === true && c.name !== void 0) {
+        app.component(c.name, c)
+      }
+    })
+  }
 
-  uiOpts.directives !== void 0 && Object.values(uiOpts.directives).forEach(d => {
-    if (isObject(d) === true && d.name !== void 0) {
-      app.directive(d.name, d)
-    }
-  })
+  if (uiOpts.directives !== void 0) {
+    Object.values(uiOpts.directives).forEach(d => {
+      if (isObject(d) === true && d.name !== void 0) {
+        app.directive(d.name, d)
+      }
+    })
+  }
 
-  uiOpts.plugins !== void 0 && installPlugins(
-    pluginOpts,
-    Object.values(uiOpts.plugins).filter(
-      p => typeof p.install === 'function' && autoInstalledPlugins.includes(p) === false
+  if (uiOpts.plugins !== void 0) {
+    installPlugins(
+      pluginOpts,
+      Object.values(uiOpts.plugins).filter(
+        p =>
+          typeof p.install === 'function' &&
+          autoInstalledPlugins.includes(p) === false
+      )
     )
-  )
+  }
 
   if (isRuntimeSsrPreHydration.value === true) {
     pluginOpts.$q.onSSRHydrated = () => {
-      pluginOpts.onSSRHydrated.forEach(fn => { fn() })
+      pluginOpts.onSSRHydrated.forEach(fn => {
+        fn()
+      })
       pluginOpts.$q.onSSRHydrated = () => {}
     }
   }
 }
 
 export default __QUASAR_SSR_SERVER__
-  ? function (parentApp, opts = {}, ssrContext) {
-    const $q = {
-      version: __QUASAR_VERSION__,
-      config: opts.config || {}
-    }
-
-    Object.assign(ssrContext, {
-      $q,
-      _meta: {
-        htmlAttrs: '',
-        headTags: '',
-        endingHeadTags: '',
-        bodyClasses: '',
-        bodyAttrs: 'data-server-rendered',
-        bodyTags: ''
+  ? // oxlint-disable-next-line default-param-last
+    function installQuasar(parentApp, opts = {}, ssrContext) {
+      const $q = {
+        version: __QUASAR_VERSION__,
+        config: opts.config || {}
       }
-    })
 
-    if (ssrContext._modules === void 0) {
-      // not OK. means the SSR build is not using @quasar/ssr-helpers,
-      // but we shouldn't crash the app
-      ssrContext._modules = []
-    }
+      Object.assign(ssrContext, {
+        $q,
+        _meta: {
+          htmlAttrs: '',
+          headTags: '',
+          endingHeadTags: '',
+          bodyClasses: '',
+          bodyAttrs: 'data-server-rendered',
+          bodyTags: ''
+        }
+      })
+
+      if (ssrContext._modules === void 0) {
+        // not OK. means the SSR build is not using @quasar/ssr-helpers,
+        // but we shouldn't crash the app
+        ssrContext._modules = []
+      }
 
-    if (ssrContext.onRendered === void 0) {
-      // not OK. means the SSR build is not using @quasar/ssr-helpers,
-      // but we shouldn't crash the app
-      ssrContext.onRendered = () => {}
-    }
+      if (ssrContext.onRendered === void 0) {
+        // not OK. means the SSR build is not using @quasar/ssr-helpers,
+        // but we shouldn't crash the app
+        ssrContext.onRendered = () => {}
+      }
 
-    parentApp.config.globalProperties.ssrContext = ssrContext
+      parentApp.config.globalProperties.ssrContext = ssrContext
 
-    prepareApp(parentApp, opts, {
-      parentApp,
-      $q,
-      lang: opts.lang,
-      iconSet: opts.iconSet,
-      ssrContext
-    })
-  }
-  : function (parentApp, opts = {}) {
-    const $q = { version: __QUASAR_VERSION__ }
-
-    if (globalConfigIsFrozen === false) {
-      if (opts.config !== void 0) {
-        Object.assign(globalConfig, opts.config)
+      prepareApp(parentApp, opts, {
+        parentApp,
+        $q,
+        lang: opts.lang,
+        iconSet: opts.iconSet,
+        ssrContext
+      })
+    }
+  : function installQuasar(parentApp, opts = {}) {
+      const $q = { version: __QUASAR_VERSION__ }
+
+      if (globalConfigIsFrozen === false) {
+        if (opts.config !== void 0) {
+          Object.assign(globalConfig, opts.config)
+        }
+
+        $q.config = { ...globalConfig }
+        freezeGlobalConfig()
+      } else {
+        $q.config = opts.config || {}
       }
 
-      $q.config = { ...globalConfig }
-      freezeGlobalConfig()
-    }
-    else {
-      $q.config = opts.config || {}
+      prepareApp(parentApp, opts, {
+        parentApp,
+        $q,
+        lang: opts.lang,
+        iconSet: opts.iconSet,
+        onSSRHydrated: []
+      })
     }
-
-    prepareApp(parentApp, opts, {
-      parentApp,
-      $q,
-      lang: opts.lang,
-      iconSet: opts.iconSet,
-      onSSRHydrated: []
-    })
-  }

package/src/plugins/addressbar/AddressbarColor.js

@@ -4,22 +4,20 @@ import getCssVar from '../../utils/css-var/get-css-var.js'
 
 let metaValue
 
-function getProp () {
-  return client.is.winphone
-    ? 'msapplication-navbutton-color'
-    : 'theme-color' // Safari, Chrome, ...
+function getProp() {
+  return client.is.winphone ? 'msapplication-navbutton-color' : 'theme-color' // Safari, Chrome, ...
 }
 
-function getMetaTag (v) {
+function getMetaTag(v) {
   const els = document.getElementsByTagName('META')
   for (const i in els) {
-    if (els[ i ].name === v) {
-      return els[ i ]
+    if (els[i].name === v) {
+      return els[i]
     }
   }
 }
 
-function setColor (hexColor) {
+function setColor(hexColor) {
   if (metaValue === void 0) {
     // cache it
     metaValue = getProp()
@@ -41,25 +39,30 @@ function setColor (hexColor) {
 }
 
 export default {
-  set: __QUASAR_SSR_SERVER__ !== true && client.is.mobile === true && (
-    client.is.nativeMobile === true
-    || client.is.winphone === true || client.is.safari === true
-    || client.is.webkit === true || client.is.vivaldi === true
-  )
-    ? hexColor => {
-      const val = hexColor || getCssVar('primary')
+  set:
+    __QUASAR_SSR_SERVER__ !== true &&
+    client.is.mobile === true &&
+    (client.is.nativeMobile === true ||
+      client.is.winphone === true ||
+      client.is.safari === true ||
+      client.is.webkit === true ||
+      client.is.vivaldi === true)
+      ? hexColor => {
+          const val = hexColor || getCssVar('primary')
 
-      if (client.is.nativeMobile === true && window.StatusBar) {
-        window.StatusBar.backgroundColorByHexString(val)
-      }
-      else {
-        setColor(val)
-      }
-    }
-    : noop,
+          if (client.is.nativeMobile === true && window.StatusBar) {
+            window.StatusBar.backgroundColorByHexString(val)
+          } else {
+            setColor(val)
+          }
+        }
+      : noop,
 
-  install ({ $q }) {
+  install({ $q }) {
     $q.addressbarColor = this
-    $q.config.addressbarColor && this.set($q.config.addressbarColor)
+
+    if ($q.config.addressbarColor) {
+      this.set($q.config.addressbarColor)
+    }
   }
 }

package/src/plugins/addressbar/AddressbarColor.json

@@ -13,7 +13,7 @@
           "type": "String",
           "desc": "Color in hex format",
           "required": true,
-          "examples": [ "'#ff0000'" ]
+          "examples": ["'#ff0000'"]
         }
       },
       "returns": null

package/src/plugins/addressbar/AddressbarColor.test.js

@@ -4,14 +4,17 @@ import { mount, config } from '@vue/test-utils'
 import AddressbarColor from './AddressbarColor.js'
 
 // We override Quasar install so it installs this plugin
-const quasarVuePlugin = config.global.plugins.find(entry => entry.name === 'Quasar')
+const quasarVuePlugin = config.global.plugins.find(
+  entry => entry.name === 'Quasar'
+)
 const { install } = quasarVuePlugin
 
-function mountPlugin (addressbarColor) {
-  quasarVuePlugin.install = app => install(app, {
-    config: { addressbarColor },
-    plugins: { AddressbarColor }
-  })
+function mountPlugin(addressbarColor) {
+  quasarVuePlugin.install = app =>
+    install(app, {
+      config: { addressbarColor },
+      plugins: { AddressbarColor }
+    })
 
   return mount({ template: '<div />' })
 }
@@ -29,9 +32,7 @@ describe('[AddressbarColor API]', () => {
       test('should be callable', () => {
         mountPlugin()
 
-        expect(
-          AddressbarColor.set('#ff0000')
-        ).toBeUndefined()
+        expect(AddressbarColor.set('#ff0000')).toBeUndefined()
       })
 
       test('should be called automatically when $q.config.addressbarColor is set', () => {

package/src/plugins/app-fullscreen/AppFullscreen.js

@@ -3,7 +3,7 @@ import { changeGlobalNodesTarget } from '../../utils/private.config/nodes.js'
 
 const prefixes = {}
 
-function assignFn (fn) {
+function assignFn(fn) {
   Object.assign(Plugin, {
     request: fn,
     exit: fn,
@@ -11,75 +11,72 @@ function assignFn (fn) {
   })
 }
 
-function getFullscreenElement () {
+function getFullscreenElement() {
   return (
-    document.fullscreenElement
-    || document.mozFullScreenElement
-    || document.webkitFullscreenElement
-    || document.msFullscreenElement
-    || null
+    document.fullscreenElement ||
+    document.mozFullScreenElement ||
+    document.webkitFullscreenElement ||
+    document.msFullscreenElement ||
+    null
   )
 }
 
-function updateEl () {
-  const newEl = Plugin.activeEl = Plugin.isActive === false
-    ? null
-    : getFullscreenElement()
+function updateEl() {
+  const newEl = (Plugin.activeEl =
+    Plugin.isActive === false ? null : getFullscreenElement())
 
   changeGlobalNodesTarget(
-    newEl === null || newEl === document.documentElement
-      ? document.body
-      : newEl
+    newEl === null || newEl === document.documentElement ? document.body : newEl
   )
 }
 
-function togglePluginState () {
+function togglePluginState() {
   Plugin.isActive = Plugin.isActive === false
   updateEl()
 }
 
 // needed for consistency across browsers
-function promisify (target, fn) {
+function promisify(target, fn) {
   try {
-    const res = target[ fn ]()
-    return res === void 0
-      ? Promise.resolve()
-      : res
-  }
-  catch (err) {
+    const res = target[fn]()
+    return res === void 0 ? Promise.resolve() : res
+  } catch (err) {
     return Promise.reject(err)
   }
 }
 
-const Plugin = createReactivePlugin({
-  isActive: false,
-  activeEl: null
-}, {
-  isCapable: false,
-
-  install ({ $q }) {
-    $q.fullscreen = this
+const Plugin = createReactivePlugin(
+  {
+    isActive: false,
+    activeEl: null
+  },
+  {
+    isCapable: false,
+
+    install({ $q }) {
+      $q.fullscreen = this
+    }
   }
-})
+)
 
 if (__QUASAR_SSR_SERVER__ === true) {
   assignFn(() => Promise.resolve())
-}
-else {
+} else {
   prefixes.request = [
     'requestFullscreen',
-    'msRequestFullscreen', 'mozRequestFullScreen', 'webkitRequestFullscreen'
-  ].find(request => document.documentElement[ request ] !== void 0)
+    'msRequestFullscreen',
+    'mozRequestFullScreen',
+    'webkitRequestFullscreen'
+  ].find(request => document.documentElement[request] !== void 0)
 
   Plugin.isCapable = prefixes.request !== void 0
 
   if (Plugin.isCapable === false) {
     // it means the browser does NOT support it
     assignFn(() => Promise.reject('Not capable'))
-  }
-  else {
+  } else {
     Object.assign(Plugin, {
-      request (target) {
+      request(target) {
         const el = target || document.documentElement
         const { activeEl } = Plugin
 
@@ -87,39 +84,41 @@ else {
           return Promise.resolve()
         }
 
-        const queue = activeEl !== null && el.contains(activeEl) === true
-          ? Plugin.exit()
-          : Promise.resolve()
+        const queue =
+          activeEl !== null && el.contains(activeEl) === true
+            ? Plugin.exit()
+            : Promise.resolve()
 
         return queue.finally(() => promisify(el, prefixes.request))
       },
 
-      exit () {
+      exit() {
         return Plugin.isActive === true
           ? promisify(document, prefixes.exit)
           : Promise.resolve()
       },
 
-      toggle (target) {
-        return Plugin.isActive === true
-          ? Plugin.exit()
-          : Plugin.request(target)
+      toggle(target) {
+        return Plugin.isActive === true ? Plugin.exit() : Plugin.request(target)
       }
     })
 
     prefixes.exit = [
       'exitFullscreen',
-      'msExitFullscreen', 'mozCancelFullScreen', 'webkitExitFullscreen'
-    ].find(exit => document[ exit ])
+      'msExitFullscreen',
+      'mozCancelFullScreen',
+      'webkitExitFullscreen'
+    ].find(exit => document[exit])
 
     Plugin.isActive = Boolean(getFullscreenElement())
-    Plugin.isActive === true && updateEl()
+    if (Plugin.isActive === true) updateEl()
 
     ;[
       'onfullscreenchange',
-      'onmsfullscreenchange', 'onwebkitfullscreenchange'
+      'onmsfullscreenchange',
+      'onwebkitfullscreenchange'
     ].forEach(evt => {
-      document[ evt ] = togglePluginState
+      document[evt] = togglePluginState
     })
   }
 }

package/src/plugins/app-fullscreen/AppFullscreen.json

@@ -18,10 +18,10 @@
     },
 
     "activeEl": {
-      "type": [ "Element", "null" ],
+      "type": ["Element", "null"],
       "desc": "The DOM element used as root for fullscreen, otherwise 'null'",
       "reactive": true,
-      "examples": [ "document.fullscreenElement", "null" ]
+      "examples": ["document.fullscreenElement", "null"]
     }
   },
 
@@ -32,7 +32,7 @@
         "target": {
           "type": "Element",
           "desc": "Optional Element of target to request Fullscreen on",
-          "examples": [ "document.getElementById('example')" ]
+          "examples": ["document.getElementById('example')"]
         }
       },
       "returns": {
@@ -50,9 +50,7 @@
       "returns": {
         "type": "Promise<void>",
         "desc": "A Promise which is resolved when exited out of fullscreen mode. It gets rejected with 'Not capable' if the browser is not capable, and with an Error object if something else went wrong.",
-        "examples": [
-          "exit().then(response => { ... }).catch(err => { ... })"
-        ]
+        "examples": ["exit().then(response => { ... }).catch(err => { ... })"]
       }
     },
 
@@ -62,15 +60,13 @@
         "target": {
           "type": "Element",
           "desc": "Optional Element of target to request Fullscreen on",
-          "examples": [ "document.getElementById('example')" ]
+          "examples": ["document.getElementById('example')"]
         }
       },
       "returns": {
         "type": "Promise<void>",
         "desc": "A Promise which is resolved when transitioned to / exited out of fullscreen mode. It gets rejected with 'Not capable' if the browser is not capable, and with an Error object if something else went wrong.",
-        "examples": [
-          "toggle().then(response => { ... }).catch(err => { ... })"
-        ]
+        "examples": ["toggle().then(response => { ... }).catch(err => { ... })"]
       }
     }
   }

package/src/plugins/app-fullscreen/AppFullscreen.test.js

@@ -10,7 +10,9 @@ import AppFullscreen from './AppFullscreen.js'
 const mountPlugin = () => mount({ template: '<div />' })
 
 // We override Quasar install so it installs this plugin
-const quasarVuePlugin = config.global.plugins.find(entry => entry.name === 'Quasar')
+const quasarVuePlugin = config.global.plugins.find(
+  entry => entry.name === 'Quasar'
+)
 const { install } = quasarVuePlugin
 quasarVuePlugin.install = app => install(app, { plugins: { AppFullscreen } })
 
@@ -56,10 +58,7 @@ describe('[AppFullscreen API]', () => {
     describe('[(prop)activeEl]', () => {
       test('is correct type', () => {
         mountPlugin()
-        expect(AppFullscreen.activeEl).$any([
-          expect.any(Element),
-          null
-        ])
+        expect(AppFullscreen.activeEl).$any([expect.any(Element), null])
       })
 
       test('is reactive', async () => {
@@ -81,9 +80,7 @@ describe('[AppFullscreen API]', () => {
         mountPlugin()
 
         const result = AppFullscreen.request()
-        expect(
-          result
-        ).toBeInstanceOf(Promise)
+        expect(result).toBeInstanceOf(Promise)
 
         await result
         expect(AppFullscreen.isActive).toBe(true)
@@ -100,9 +97,7 @@ describe('[AppFullscreen API]', () => {
         const el = createMockedEl()
 
         const result = AppFullscreen.request(el)
-        expect(
-          result
-        ).toBeInstanceOf(Promise)
+        expect(result).toBeInstanceOf(Promise)
 
         await result
 
@@ -121,9 +116,7 @@ describe('[AppFullscreen API]', () => {
         const el = createMockedEl()
 
         const result = AppFullscreen.request(el)
-        expect(
-          result
-        ).toBeInstanceOf(Promise)
+        expect(result).toBeInstanceOf(Promise)
 
         await result
         expect(el.requestFullscreen).toHaveBeenCalledTimes(1)
@@ -141,18 +134,14 @@ describe('[AppFullscreen API]', () => {
     describe('[(method)exit]', () => {
       test('should be callable', () => {
         mountPlugin()
-        expect(
-          AppFullscreen.exit()
-        ).toBeInstanceOf(Promise)
+        expect(AppFullscreen.exit()).toBeInstanceOf(Promise)
       })
 
       test('request() + exit()', async () => {
         mountPlugin()
 
         const result = AppFullscreen.request()
-        expect(
-          result
-        ).toBeInstanceOf(Promise)
+        expect(result).toBeInstanceOf(Promise)
 
         await result
         expect(AppFullscreen.isActive).toBe(true)
@@ -169,9 +158,7 @@ describe('[AppFullscreen API]', () => {
         mountPlugin()
 
         const result = AppFullscreen.toggle()
-        expect(
-          result
-        ).toBeInstanceOf(Promise)
+        expect(result).toBeInstanceOf(Promise)
 
         await result
         expect(AppFullscreen.isActive).toBe(true)
@@ -188,9 +175,7 @@ describe('[AppFullscreen API]', () => {
         const el = createMockedEl()
 
         const result = AppFullscreen.toggle(el)
-        expect(
-          result
-        ).toBeInstanceOf(Promise)
+        expect(result).toBeInstanceOf(Promise)
 
         await result
         expect(el.requestFullscreen).toHaveBeenCalledTimes(1)