quasar 2.18.6 → 2.19.0

package/src/components/chip/QChip.json

@@ -11,7 +11,7 @@
     "size": {
       "type": "String",
       "desc": "QChip size name or a CSS unit including unit name",
-      "examples": [ "'xs'", "'sm'", "'md'", "'lg'", "'xl'", "'25px'", "'2rem'" ],
+      "examples": ["'xs'", "'sm'", "'md'", "'lg'", "'xl'", "'25px'", "'2rem'"],
       "category": "style"
     },
 
@@ -36,9 +36,9 @@
     },
 
     "label": {
-      "type": [ "String", "Number" ],
+      "type": ["String", "Number"],
       "desc": "Chip's content as string; overrides default slot if specified",
-      "examples": [ "'John Doe'", "'Book'" ],
+      "examples": ["'John Doe'", "'Book'"],
       "category": "content"
     },
 
@@ -59,11 +59,11 @@
     },
 
     "selected": {
-      "type": [ "Boolean", "null" ],
+      "type": ["Boolean", "null"],
       "default": "null",
       "sync": true,
       "desc": "Model for QChip if it's selected or not",
-      "examples": [ "# v-model:selected=\"myState\"" ],
+      "examples": ["# v-model:selected=\"myState\""],
       "category": "model"
     },
 
@@ -97,7 +97,7 @@
     "remove-aria-label": {
       "type": "String",
       "desc": "aria-label to be used on the remove icon",
-      "examples": [ "'Remove item'" ],
+      "examples": ["'Remove item'"],
       "category": "accessibility",
       "addedIn": "v2.8.4"
     },

package/src/components/chip/QChip.test.js

@@ -10,16 +10,12 @@ describe('[QChip API]', () => {
         const wrapper = mount(QChip)
         const target = wrapper.get('.q-chip')
 
-        expect(
-          target.classes()
-        ).not.toContain('q-chip--dense')
+        expect(target.classes()).not.toContain('q-chip--dense')
 
         await wrapper.setProps({ dense: true })
         await flushPromises()
 
-        expect(
-          target.classes()
-        ).toContain('q-chip--dense')
+        expect(target.classes()).toContain('q-chip--dense')
       })
     })
 
@@ -28,22 +24,16 @@ describe('[QChip API]', () => {
         const wrapper = mount(QChip)
         const target = wrapper.get('.q-chip')
 
-        expect(
-          target.$style('font-size')
-        ).not.toBe('100px')
+        expect(target.$style('font-size')).not.toBe('100px')
 
         await wrapper.setProps({ size: '100px' })
         await flushPromises()
 
-        expect(
-          target.$style('font-size')
-        ).toBe('100px')
+        expect(target.$style('font-size')).toBe('100px')
 
         await wrapper.setProps({ size: 'sm' })
 
-        expect(
-          target.$style('font-size')
-        ).toBe(`${ defaultSizes.sm }px`)
+        expect(target.$style('font-size')).toBe(`${defaultSizes.sm}px`)
       })
     })
 
@@ -52,32 +42,24 @@ describe('[QChip API]', () => {
         const wrapper = mount(QChip)
         const target = wrapper.get('.q-chip')
 
-        expect(
-          target.classes()
-        ).not.toContain('q-chip--dark')
+        expect(target.classes()).not.toContain('q-chip--dark')
 
         await wrapper.setProps({ dark: true })
         await flushPromises()
 
-        expect(
-          target.classes()
-        ).toContain('q-chip--dark')
+        expect(target.classes()).toContain('q-chip--dark')
       })
 
       test('type null has effect', async () => {
         const wrapper = mount(QChip)
         const target = wrapper.get('.q-chip')
 
-        expect(
-          target.classes()
-        ).not.toContain('q-chip--dense')
+        expect(target.classes()).not.toContain('q-chip--dense')
 
         await wrapper.setProps({ dark: null })
         await flushPromises()
 
-        expect(
-          target.classes()
-        ).not.toContain('q-chip--dense')
+        expect(target.classes()).not.toContain('q-chip--dense')
       })
     })
 
@@ -86,16 +68,12 @@ describe('[QChip API]', () => {
         const propVal = 'map'
         const wrapper = mount(QChip)
 
-        expect(
-          wrapper.find('.q-icon').exists()
-        ).toBe(false)
+        expect(wrapper.find('.q-icon').exists()).toBe(false)
 
         await wrapper.setProps({ icon: propVal })
         await flushPromises()
 
-        expect(
-          wrapper.get('.q-icon').text()
-        ).toContain(propVal)
+        expect(wrapper.get('.q-icon').text()).toContain(propVal)
       })
     })
 
@@ -104,16 +82,12 @@ describe('[QChip API]', () => {
         const propVal = 'map'
         const wrapper = mount(QChip)
 
-        expect(
-          wrapper.find('.q-icon').exists()
-        ).toBe(false)
+        expect(wrapper.find('.q-icon').exists()).toBe(false)
 
         await wrapper.setProps({ iconRight: propVal })
         await flushPromises()
 
-        expect(
-          wrapper.get('.q-icon').text()
-        ).toContain(propVal)
+        expect(wrapper.get('.q-icon').text()).toContain(propVal)
       })
     })
 
@@ -122,9 +96,7 @@ describe('[QChip API]', () => {
         const propVal = 'map'
         const wrapper = mount(QChip)
 
-        expect(
-          wrapper.find('.q-icon').exists()
-        ).toBe(false)
+        expect(wrapper.find('.q-icon').exists()).toBe(false)
 
         await wrapper.setProps({
           removable: true,
@@ -132,10 +104,7 @@ describe('[QChip API]', () => {
         })
         await flushPromises()
 
-        expect(
-          wrapper.get('.q-icon.q-chip__icon--remove')
-            .text()
-        ).toBe(propVal)
+        expect(wrapper.get('.q-icon.q-chip__icon--remove').text()).toBe(propVal)
       })
     })
 
@@ -144,9 +113,7 @@ describe('[QChip API]', () => {
         const propVal = 'map'
         const wrapper = mount(QChip)
 
-        expect(
-          wrapper.find('.q-icon').exists()
-        ).toBe(false)
+        expect(wrapper.find('.q-icon').exists()).toBe(false)
 
         await wrapper.setProps({
           selected: true,
@@ -155,32 +122,24 @@ describe('[QChip API]', () => {
         await flushPromises()
 
         expect(
-          wrapper.get('.q-chip.q-chip--selected')
-            .get('.q-icon')
-            .text()
+          wrapper.get('.q-chip.q-chip--selected').get('.q-icon').text()
         ).toBe(propVal)
       })
     })
 
     describe('[(prop)label]', () => {
       test.each([
-        [ 'String', 'John Doe' ],
-        [ 'Number', 22 ]
+        ['String', 'John Doe'],
+        ['Number', 22]
       ])('type %s has effect', async (_, propVal) => {
         const wrapper = mount(QChip)
 
-        expect(
-          wrapper.get('.q-chip__content')
-            .text()
-        ).not.toBe('' + propVal)
+        expect(wrapper.get('.q-chip__content').text()).not.toBe(String(propVal))
 
         await wrapper.setProps({ label: propVal })
         await flushPromises()
 
-        expect(
-          wrapper.get('.q-chip__content')
-            .text()
-        ).toBe('' + propVal)
+        expect(wrapper.get('.q-chip__content').text()).toBe(String(propVal))
       })
     })
 
@@ -335,17 +294,12 @@ describe('[QChip API]', () => {
           }
         })
 
-        expect(
-          wrapper.find('.q-chip').exists()
-        ).toBe(true)
+        expect(wrapper.find('.q-chip').exists()).toBe(true)
 
         await wrapper.setProps({ modelValue: false })
         await flushPromises()
 
-        expect(
-          wrapper.find('.q-chip')
-            .exists()
-        ).toBe(false)
+        expect(wrapper.find('.q-chip').exists()).toBe(false)
       })
     })
 
@@ -354,38 +308,34 @@ describe('[QChip API]', () => {
         const wrapper = mount(QChip)
         const target = wrapper.get('.q-chip')
 
-        expect(
-          target.classes()
-        ).not.toContain('q-chip--selected')
+        expect(target.classes()).not.toContain('q-chip--selected')
 
         await wrapper.setProps({
           selected: true,
-          'onUpdate:selected': val => { wrapper.setProps({ selected: val }) }
+          'onUpdate:selected': val => {
+            wrapper.setProps({ selected: val })
+          }
         })
         await flushPromises()
 
-        expect(
-          target.classes()
-        ).toContain('q-chip--selected')
+        expect(target.classes()).toContain('q-chip--selected')
       })
 
       test('type null has effect', async () => {
         const wrapper = mount(QChip)
         const target = wrapper.get('.q-chip')
 
-        expect(
-          target.classes()
-        ).not.toContain('q-chip--selected')
+        expect(target.classes()).not.toContain('q-chip--selected')
 
         await wrapper.setProps({
           selected: null,
-          'onUpdate:selected': val => { wrapper.setProps({ selected: val }) }
+          'onUpdate:selected': val => {
+            wrapper.setProps({ selected: val })
+          }
         })
         await flushPromises()
 
-        expect(
-          target.classes()
-        ).not.toContain('q-chip--selected')
+        expect(target.classes()).not.toContain('q-chip--selected')
       })
     })
 
@@ -394,20 +344,14 @@ describe('[QChip API]', () => {
         const wrapper = mount(QChip)
         const target = wrapper.get('.q-chip')
 
-        expect(
-          target.classes()
-        ).not.toContain('q-chip--square')
+        expect(target.classes()).not.toContain('q-chip--square')
 
         await wrapper.setProps({ square: true })
         await flushPromises()
 
-        expect(
-          target.classes()
-        ).toContain('q-chip--square')
+        expect(target.classes()).toContain('q-chip--square')
 
-        expect(
-          target.$computedStyle('border-radius')
-        ).toBe('4px')
+        expect(target.$computedStyle('border-radius')).toBe('4px')
       })
     })
 
@@ -416,16 +360,12 @@ describe('[QChip API]', () => {
         const wrapper = mount(QChip)
         const target = wrapper.get('.q-chip')
 
-        expect(
-          target.classes()
-        ).not.toContain('q-chip--outline')
+        expect(target.classes()).not.toContain('q-chip--outline')
 
         await wrapper.setProps({ outline: true })
         await flushPromises()
 
-        expect(
-          target.classes()
-        ).toContain('q-chip--outline')
+        expect(target.classes()).toContain('q-chip--outline')
       })
     })
 
@@ -434,20 +374,14 @@ describe('[QChip API]', () => {
         const wrapper = mount(QChip)
         const target = wrapper.get('.q-chip')
 
-        expect(
-          target.attributes('tabindex')
-        ).toBeUndefined()
+        expect(target.attributes('tabindex')).toBeUndefined()
 
         await wrapper.setProps({ clickable: true })
         await flushPromises()
 
-        expect(
-          target.attributes('tabindex')
-        ).toBe('0')
+        expect(target.attributes('tabindex')).toBe('0')
 
-        expect(
-          target.$computedStyle('cursor')
-        ).toBe('pointer')
+        expect(target.$computedStyle('cursor')).toBe('pointer')
       })
     })
 
@@ -455,18 +389,14 @@ describe('[QChip API]', () => {
       test('type Boolean has effect', async () => {
         const wrapper = mount(QChip)
 
-        expect(
-          wrapper.find('.q-icon.q-chip__icon--remove')
-            .exists()
-        ).not.toBe(true)
+        expect(wrapper.find('.q-icon.q-chip__icon--remove').exists()).not.toBe(
+          true
+        )
 
         await wrapper.setProps({ removable: true })
         await flushPromises()
 
-        expect(
-          wrapper.find('.q-icon.q-chip__icon--remove')
-            .exists()
-        ).toBe(true)
+        expect(wrapper.find('.q-icon.q-chip__icon--remove').exists()).toBe(true)
       })
     })
 
@@ -474,40 +404,28 @@ describe('[QChip API]', () => {
       test('type Boolean has effect', async () => {
         const wrapper = mount(QChip)
 
-        expect(
-          wrapper.find('.q-ripple')
-            .exists()
-        ).toBe(false)
+        expect(wrapper.find('.q-ripple').exists()).toBe(false)
 
         await wrapper.setProps({ ripple: true })
         await flushPromises()
 
         await wrapper.trigger('click')
 
-        expect(
-          wrapper.find('.q-ripple')
-            .exists()
-        ).toBe(true)
+        expect(wrapper.find('.q-ripple').exists()).toBe(true)
       })
 
       test('type Object has effect', async () => {
         const propVal = { center: true, color: 'teal', keyCodes: [] }
         const wrapper = mount(QChip)
 
-        expect(
-          wrapper.find('.q-ripple')
-            .exists()
-        ).toBe(false)
+        expect(wrapper.find('.q-ripple').exists()).toBe(false)
 
         await wrapper.setProps({ ripple: propVal })
         await flushPromises()
 
         await wrapper.trigger('click')
 
-        expect(
-          wrapper.find('.q-ripple')
-            .exists()
-        ).toBe(true)
+        expect(wrapper.find('.q-ripple').exists()).toBe(true)
       })
     })
 
@@ -522,27 +440,21 @@ describe('[QChip API]', () => {
 
         const removeIcon = wrapper.get('.q-chip__icon--remove')
 
-        expect(
-          removeIcon.attributes('aria-label')
-        ).not.toBe(propVal)
+        expect(removeIcon.attributes('aria-label')).not.toBe(propVal)
 
         await wrapper.setProps({ removeAriaLabel: propVal })
         await flushPromises()
 
-        expect(
-          removeIcon.attributes('aria-label')
-        ).toBe(propVal)
+        expect(removeIcon.attributes('aria-label')).toBe(propVal)
 
-        expect(
-          removeIcon.attributes('tabindex')
-        ).toBe('0')
+        expect(removeIcon.attributes('tabindex')).toBe('0')
       })
     })
 
     describe('[(prop)tabindex]', () => {
       test.each([
-        [ 'Number', 100 ],
-        [ 'String', '100' ]
+        ['Number', 100],
+        ['String', '100']
       ])('type %s has effect', async (_, propVal) => {
         const wrapper = mount(QChip, {
           props: {
@@ -551,21 +463,15 @@ describe('[QChip API]', () => {
           }
         })
 
-        expect(
-          wrapper.attributes('tabindex')
-        ).toBe('' + propVal)
+        expect(wrapper.attributes('tabindex')).toBe(String(propVal))
 
         // we'll test clickable + disable
         await wrapper.setProps({ disable: true })
         await flushPromises()
 
-        expect(
-          wrapper.attributes('tabindex')
-        ).toBeUndefined()
+        expect(wrapper.attributes('tabindex')).toBeUndefined()
 
-        expect(
-          wrapper.attributes('aria-disabled')
-        ).toBeUndefined()
+        expect(wrapper.attributes('aria-disabled')).toBeUndefined()
 
         // we'll now test removable + disable
         await wrapper.setProps({
@@ -576,13 +482,9 @@ describe('[QChip API]', () => {
 
         let removeIcon = wrapper.get('.q-chip__icon--remove')
 
-        expect(
-          removeIcon.attributes('tabindex')
-        ).toBe('-1')
+        expect(removeIcon.attributes('tabindex')).toBe('-1')
 
-        expect(
-          removeIcon.attributes('aria-disabled')
-        ).toBe('true')
+        expect(removeIcon.attributes('aria-disabled')).toBe('true')
 
         // we'll now test removable
         await wrapper.setProps({ disable: false })
@@ -590,13 +492,9 @@ describe('[QChip API]', () => {
 
         removeIcon = wrapper.get('.q-chip__icon--remove')
 
-        expect(
-          removeIcon.attributes('tabindex')
-        ).toBe('' + propVal)
+        expect(removeIcon.attributes('tabindex')).toBe(String(propVal))
 
-        expect(
-          removeIcon.attributes('aria-disabled')
-        ).toBeUndefined()
+        expect(removeIcon.attributes('aria-disabled')).toBeUndefined()
       })
     })
 
@@ -604,16 +502,12 @@ describe('[QChip API]', () => {
       test('type Boolean has effect', async () => {
         const wrapper = mount(QChip)
 
-        expect(
-          wrapper.get('.q-chip').classes()
-        ).not.toContain('disabled')
+        expect(wrapper.get('.q-chip').classes()).not.toContain('disabled')
 
         await wrapper.setProps({ disable: true })
         await flushPromises()
 
-        expect(
-          wrapper.get('.q-chip').classes()
-        ).toContain('disabled')
+        expect(wrapper.get('.q-chip').classes()).toContain('disabled')
       })
     })
   })
@@ -648,7 +542,7 @@ describe('[QChip API]', () => {
         expect(eventList).toHaveProperty('click')
         expect(eventList.click).toHaveLength(1)
 
-        const [ evt ] = eventList.click[ 0 ]
+        const [evt] = eventList.click[0]
         expect(evt).toBeInstanceOf(Event)
       })
 
@@ -665,7 +559,7 @@ describe('[QChip API]', () => {
         expect(eventList).toHaveProperty('click')
         expect(eventList.click).toHaveLength(1)
 
-        const [ evt ] = eventList.click[ 0 ]
+        const [evt] = eventList.click[0]
         expect(evt).toBeInstanceOf(Event)
       })
 
@@ -723,9 +617,9 @@ describe('[QChip API]', () => {
 
         const eventList = wrapper.emitted()
         expect(eventList).toHaveProperty('update:selected')
-        expect(eventList[ 'update:selected' ]).toHaveLength(1)
+        expect(eventList['update:selected']).toHaveLength(1)
 
-        const [ state ] = eventList[ 'update:selected' ][ 0 ]
+        const [state] = eventList['update:selected'][0]
         expect(state).toBeTypeOf('boolean')
       })
 
@@ -756,14 +650,13 @@ describe('[QChip API]', () => {
           }
         })
 
-        await wrapper.get('.q-chip__icon--remove')
-          .trigger('click')
+        await wrapper.get('.q-chip__icon--remove').trigger('click')
 
         const eventList = wrapper.emitted()
         expect(eventList).toHaveProperty('remove')
         expect(eventList.remove).toHaveLength(1)
 
-        expect(eventList.remove[ 0 ]).toHaveLength(0)
+        expect(eventList.remove[0]).toHaveLength(0)
       })
     })
 
@@ -779,14 +672,13 @@ describe('[QChip API]', () => {
           }
         })
 
-        await wrapper.get('.q-chip__icon--remove')
-          .trigger('click')
+        await wrapper.get('.q-chip__icon--remove').trigger('click')
 
         const eventList = wrapper.emitted()
         expect(eventList).toHaveProperty('update:modelValue')
-        expect(eventList[ 'update:modelValue' ]).toHaveLength(1)
+        expect(eventList['update:modelValue']).toHaveLength(1)
 
-        const [ value ] = eventList[ 'update:modelValue' ][ 0 ]
+        const [value] = eventList['update:modelValue'][0]
         expect(value).toBe(false)
       })
     })

package/src/components/chip/index.js

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