A settings entry with a controller opens that controller's route from its card (settingsPath); singleton cards still open /settings/<code>. On a linked controller with no navigation entry of its own the rail marks Settings current, the breadcrumbs read Settings > entry label (plus the record title on record and create routes) and the page title uses the entry label. The settings docs describe the admin behaviour; the embedded admin shell is rebuilt.
111 lines
4.6 KiB
TypeScript
111 lines
4.6 KiB
TypeScript
import { afterEach, beforeEach, describe, expect, it } from 'vitest'
|
|
import { enableAutoUnmount, flushPromises, mount } from '@vue/test-utils'
|
|
import Breadcrumbs from '../../src/components/shell/Breadcrumbs.vue'
|
|
import { setRecordCrumb } from '../../src/state/useBreadcrumbs'
|
|
import { setNavigation } from '../../src/state/useNavigation'
|
|
import { setSettings } from '../../src/state/useSettings'
|
|
import { navigationFixture, settingsFixture } from '../fixtures/typed'
|
|
import { resetState, routerAt, signIn } from '../helpers'
|
|
|
|
async function crumbsAt(path: string) {
|
|
await signIn()
|
|
setNavigation(navigationFixture.data)
|
|
setSettings(settingsFixture.list.data)
|
|
const router = await routerAt(path)
|
|
const wrapper = mount(Breadcrumbs, { global: { plugins: [router] } })
|
|
await flushPromises()
|
|
const items = wrapper.findAll('[data-crumb]')
|
|
return {
|
|
wrapper,
|
|
labels: items.map((item) => item.text()),
|
|
links: items.map((item) => (item.find('a').exists() ? item.find('a').attributes('href') : null)),
|
|
current: items.map((item) => item.find('[aria-current="page"]').exists()),
|
|
}
|
|
}
|
|
|
|
beforeEach(() => {
|
|
resetState()
|
|
})
|
|
|
|
afterEach(() => {
|
|
document.body.innerHTML = ''
|
|
})
|
|
|
|
enableAutoUnmount(afterEach)
|
|
|
|
describe('breadcrumbs', () => {
|
|
it('is a labelled nav listing plugin and controller, the last one current', async () => {
|
|
const { wrapper, labels, links, current } = await crumbsAt('/acme/demo/gadgets')
|
|
expect(wrapper.find('nav').attributes('aria-label')).toBe('Ścieżka nawigacji')
|
|
expect(wrapper.find('ol').exists()).toBe(true)
|
|
expect(labels).toEqual(['Demo', 'Gadgets'])
|
|
expect(links).toEqual(['/acme/demo/widgets', null])
|
|
expect(current).toEqual([false, true])
|
|
expect(wrapper.findAll('svg[aria-hidden="true"]')).toHaveLength(1)
|
|
})
|
|
|
|
it('adds the record title on record and create routes only', async () => {
|
|
setRecordCrumb('Blue widget')
|
|
let crumbs = await crumbsAt('/acme/demo/widgets/1')
|
|
expect(crumbs.labels).toEqual(['Demo', 'Widgets', 'Blue widget'])
|
|
expect(crumbs.links).toEqual(['/acme/demo/widgets', '/acme/demo/widgets', null])
|
|
expect(crumbs.current).toEqual([false, false, true])
|
|
|
|
setRecordCrumb('New widget')
|
|
crumbs = await crumbsAt('/acme/demo/widgets/create')
|
|
expect(crumbs.labels).toEqual(['Demo', 'Widgets', 'New widget'])
|
|
|
|
crumbs = await crumbsAt('/acme/demo/widgets')
|
|
expect(crumbs.labels).toEqual(['Demo', 'Widgets'])
|
|
})
|
|
|
|
it('leaves out an empty record title', async () => {
|
|
const { labels } = await crumbsAt('/acme/demo/widgets/1')
|
|
expect(labels).toEqual(['Demo', 'Widgets'])
|
|
})
|
|
|
|
it('shows Ustawienia and the page label on settings routes', async () => {
|
|
expect((await crumbsAt('/settings')).labels).toEqual(['Ustawienia'])
|
|
const page = await crumbsAt('/settings/mail')
|
|
expect(page.labels).toEqual(['Ustawienia', 'Mail'])
|
|
expect(page.links).toEqual(['/settings', null])
|
|
expect((await crumbsAt('/settings/unknown')).labels).toEqual(['Ustawienia'])
|
|
})
|
|
|
|
it('reads Ustawienia and the entry label on a settings-linked controller', async () => {
|
|
const locales = { ...settingsFixture.list.data[0]!, code: 'locales', label: 'Locales', model: '', controller: 'acme.lang.locales' }
|
|
const crumbsWithLink = async (path: string) => {
|
|
await signIn()
|
|
setNavigation(navigationFixture.data)
|
|
setSettings([...settingsFixture.list.data, locales])
|
|
const router = await routerAt(path)
|
|
const wrapper = mount(Breadcrumbs, { global: { plugins: [router] } })
|
|
await flushPromises()
|
|
const items = wrapper.findAll('[data-crumb]')
|
|
return {
|
|
labels: items.map((item) => item.text()),
|
|
links: items.map((item) => (item.find('a').exists() ? item.find('a').attributes('href') : null)),
|
|
current: items.map((item) => item.find('[aria-current="page"]').exists()),
|
|
}
|
|
}
|
|
let crumbs = await crumbsWithLink('/acme/lang/locales')
|
|
expect(crumbs.labels).toEqual(['Ustawienia', 'Locales'])
|
|
expect(crumbs.links).toEqual(['/settings', null])
|
|
expect(crumbs.current).toEqual([false, true])
|
|
|
|
setRecordCrumb('Polish')
|
|
crumbs = await crumbsWithLink('/acme/lang/locales/3')
|
|
expect(crumbs.labels).toEqual(['Ustawienia', 'Locales', 'Polish'])
|
|
expect(crumbs.links).toEqual(['/settings', '/acme/lang/locales', null])
|
|
|
|
setRecordCrumb('')
|
|
crumbs = await crumbsWithLink('/acme/lang/locales/create')
|
|
expect(crumbs.labels).toEqual(['Ustawienia', 'Locales'])
|
|
})
|
|
|
|
it('is empty outside any permitted plugin', async () => {
|
|
expect((await crumbsAt('/acme/secret/things')).labels).toEqual([])
|
|
expect((await crumbsAt('/acme/demo/unlisted')).labels).toEqual(['Demo'])
|
|
})
|
|
})
|