Files
summercms/admin/tests/list/CellValue.test.ts
Jakub Zych 1c2a66df45 test(10-05): bring every SPA module, composable and component under Vitest
- 41 unit and component suites under admin/tests/{app,state,shell,list,form,relation,views,ui}
  covering states and a11y roles; every src module is imported by a test
- typed fixture helper assigns each JSON fixture to its generated OpenAPI type
- fix: iconFor ignores inherited object members such as "constructor"
- fix: field controls import ./control instead of the registry (import cycle
  left a renderer unregistered depending on module load order)
- fix: dropdown shows the placeholder for an unknown stored value next to an emptyOption
- fix: list announces a failed schema load even when the rows arrive after it
- tailwind no longer scans admin/tests; boardwalk/dist rebuilt
2026-09-27 17:53:57 +02:00

78 lines
2.7 KiB
TypeScript

import { beforeEach, describe, expect, it } from 'vitest'
import { mount } from '@vue/test-utils'
import CellValue from '../../src/components/list/CellValue.vue'
import type { ListColumn } from '../../src/api/types'
import { listColumn } from '../fixtures/typed'
import { resetState } from '../helpers'
function cell(column: ListColumn, value: unknown) {
return mount({ components: { CellValue }, props: [], template: '<span data-cell><CellValue :column="column" :value="value" /></span>', data: () => ({ column, value }) })
}
const text = listColumn('name')
const datetime = listColumn('created_at')
const toggle = listColumn('active')
beforeEach(() => {
resetState()
})
describe('cell value (D-12)', () => {
it.each([
['a string', 'Blue', 'Blue'],
['a number', 12, '12'],
['an array', ['small', 3, null, ''], 'small, 3'],
['a boolean true', true, 'Tak'],
['a boolean false', false, 'Nie'],
])('renders %s as plain text', (_label, value, expected) => {
const wrapper = cell(text, value)
expect(wrapper.text()).toBe(expected)
expect(wrapper.find('[data-empty]').exists()).toBe(false)
})
it.each([
['null', null],
['undefined', undefined],
['an empty string', ''],
['an object', { nested: true }],
['an empty array', []],
])('renders %s as a muted dash', (_label, value) => {
const wrapper = cell(text, value)
expect(wrapper.find('[data-empty]').text()).toBe('—')
})
it('never renders markup from a value', () => {
const wrapper = cell(text, '<img src=x onerror=alert(1)>')
expect(wrapper.find('img').exists()).toBe(false)
expect(wrapper.text()).toBe('<img src=x onerror=alert(1)>')
})
it('formats datetimes as YYYY-MM-DD HH:mm in tabular numbers', () => {
const wrapper = cell(datetime, '2026-09-21T14:32:00')
expect(wrapper.text()).toBe('2026-09-21 14:32')
expect(wrapper.find('span.tabular-nums').exists()).toBe(true)
expect(cell(datetime, 'not a date').text()).toBe('not a date')
expect(cell(datetime, null).find('[data-empty]').exists()).toBe(true)
expect(cell(datetime, true).find('[data-empty]').exists()).toBe(true)
})
it.each([
[true, 'true', 'Tak'],
[1, 'true', 'Tak'],
['yes', 'true', 'Tak'],
[false, 'false', 'Nie'],
[0, 'false', 'Nie'],
['0', 'false', 'Nie'],
['FALSE', 'false', 'Nie'],
])('renders the switch value %j as the %s pill', (value, state, label) => {
const wrapper = cell(toggle, value)
expect(wrapper.find('[data-switch]').attributes('data-switch')).toBe(state)
expect(wrapper.text()).toBe(label)
})
it('renders an empty switch value as a dash', () => {
expect(cell(toggle, null).find('[data-empty]').exists()).toBe(true)
expect(cell(toggle, null).find('[data-switch]').exists()).toBe(false)
})
})