quasar/src/composables/private.use-align/use-align.test.js

Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time

import { describe, test, expect } from 'vitest'

import useAlign, { alignMap, alignValues, useAlignProps } from './use-align.js'

describe('[useAlign API]', () => {
  describe('[Variables]', () => {
    describe('[(variable)alignMap]', () => {
      test('is defined correctly', () => {
        expect(alignMap).toBeTypeOf('object')
        expect(Object.keys(alignMap)).not.toHaveLength(0)
      })
    })

    describe('[(variable)alignValues]', () => {
      test('is defined correctly', () => {
        expect(Array.isArray(alignValues)).toBe(true)
        expect(alignValues).not.toHaveLength(0)
      })
    })

    describe('[(variable)useAlignProps]', () => {
      test('is defined correctly', () => {
        expect(useAlignProps).toBeTypeOf('object')
        expect(Object.keys(useAlignProps)).not.toHaveLength(0)
      })
    })
  })

  describe('[Functions]', () => {
    describe('[(function)default]', () => {
      test('returns correctly', () => {
        expect(
          useAlign({})
        ).$ref()
      })

      test('horizontal', () => {
        expect(
          useAlign({}).value
        ).toMatch(/^justify-/)
      })

      test('vertical', () => {
        expect(
          useAlign({ vertical: true }).value
        ).toMatch(/^items-/)
      })

      test.each([
        [ 'empty', {}, 'justify-start' ],
        [ 'vertical', { vertical: true }, 'items-stretch' ],
        [ 'align right', { align: 'right' }, 'justify-end' ],
        [ 'align evenly', { align: 'evenly' }, 'justify-evenly' ],
        [ 'vertical right', { vertical: true, align: 'right' }, 'items-end' ]
      ])('useAlign: %s', (_, arg, expected) => {
        expect(
          useAlign(arg)
        ).$ref(expected)
      })
    })
  })
})