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: '', 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, '') expect(wrapper.find('img').exists()).toBe(false) expect(wrapper.text()).toBe('') }) 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) }) })