summercms/admin/tests/app/router.test.ts

import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
import { createMemoryHistory } from 'vue-router'
import { activateStyles, loadStyles } from '../../src/app/pluginAssets'
import { createAdminRouter, routeControllerId, safeRedirect } from '../../src/app/router'
import { setNavigation } from '../../src/state/useNavigation'
import { navigationFixture } from '../fixtures/typed'
import { resetState, routerAt, signIn } from '../helpers'

beforeEach(() => {
  resetState()
})

describe('safeRedirect', () => {
  it('accepts in-app paths with exactly one leading slash', () => {
    expect(safeRedirect('/acme/demo/widgets')).toBe('/acme/demo/widgets')
    expect(safeRedirect('/acme/demo/widgets/1?tab=2#x')).toBe('/acme/demo/widgets/1?tab=2#x')
    expect(safeRedirect('/')).toBe('/')
  })

  it.each([
    ['protocol-relative', '//evil.example/x'],
    ['backslash protocol-relative', '/\\evil.example'],
    ['absolute http', 'http://evil.example/'],
    ['absolute https', 'https://evil.example/'],
    ['javascript', 'javascript:alert(1)'],
    ['relative', 'acme/demo'],
    ['empty', ''],
  ])('rejects a %s value', (_label, value) => {
    expect(safeRedirect(value)).toBeNull()
  })

  it('rejects non-string values', () => {
    expect(safeRedirect(undefined)).toBeNull()
    expect(safeRedirect(null)).toBeNull()
    expect(safeRedirect(['/a'])).toBeNull()
    expect(safeRedirect(1)).toBeNull()
  })
})

describe('route guard', () => {
  it('sends a visitor without a session to login with the requested path', async () => {
    const router = await routerAt('/acme/demo/widgets/3?x=1')
    expect(router.currentRoute.value.name).toBe('login')
    expect(router.currentRoute.value.query.redirect).toBe('/acme/demo/widgets/3?x=1')
  })

  it('lets a visitor open the login screen', async () => {
    const router = await routerAt('/login')
    expect(router.currentRoute.value.name).toBe('login')
  })

  it('moves a signed-in admin away from login to a safe redirect', async () => {
    await signIn()
    const router = await routerAt('/login?redirect=/acme/demo/gadgets')
    expect(router.currentRoute.value.fullPath).toBe('/acme/demo/gadgets')
  })

  it.each(['//evil.example/x', 'https://evil.example/', '/\\evil'])(
    'ignores the unsafe redirect %j and goes home',
    async (redirect) => {
      await signIn()
      setNavigation(navigationFixture.data)
      const router = createAdminRouter(createMemoryHistory())
      await router.push({ path: '/login', query: { redirect } })
      expect(router.currentRoute.value.fullPath).toBe('/acme/demo/widgets')
    },
  )

  it('lands home on the first permitted controller, or on the empty page without navigation', async () => {
    await signIn()
    setNavigation(navigationFixture.data)
    expect((await routerAt('/')).currentRoute.value.fullPath).toBe('/acme/demo/widgets')
    setNavigation([])
    const empty = await routerAt('/')
    expect(empty.currentRoute.value.name).toBe('home')
  })

  it('names the list, create, record, settings and not-found routes', async () => {
    await signIn()
    const cases: Array<[string, string]> = [
      ['/acme/demo/widgets', 'list'],
      ['/acme/demo/widgets/create', 'create'],
      ['/acme/demo/widgets/12', 'record'],
      ['/acme/demo/widgets/abc', 'not-found'],
      ['/settings', 'settings'],
      ['/settings/mail', 'settings-form'],
      ['/nowhere', 'not-found'],
    ]
    for (const [path, name] of cases) {
      const router = await routerAt(path)
      expect(router.currentRoute.value.name, path).toBe(name)
      expect(router.currentRoute.value.meta.shell, path).toBe(true)
    }
    expect((await routerAt('/acme/demo/widgets/12')).currentRoute.value.params.id).toBe('12')
  })
})

describe('plugin stylesheets follow the route (D-16, T-10.1-16)', () => {
  let links: HTMLLinkElement[]

  beforeEach(() => {
    links = []
    const head = document.head
    const append = head.appendChild.bind(head)
    vi.spyOn(head, 'appendChild').mockImplementation(<T extends Node>(node: T): T => {
      if (node instanceof HTMLLinkElement) {
        links.push(node)
        return node
      }
      return append(node)
    })
  })

  afterEach(() => {
    vi.restoreAllMocks()
    activateStyles('')
  })

  const enabled = () => links.filter((link) => !link.disabled).map((link) => link.getAttribute('data-summer-controller'))

  it('names the controller of list, create and record routes only', async () => {
    await signIn()
    expect(routeControllerId((await routerAt('/acme/demo/widgets')).currentRoute.value)).toBe('acme.demo.widgets')
    expect(routeControllerId((await routerAt('/acme/demo/widgets/create')).currentRoute.value)).toBe('acme.demo.widgets')
    expect(routeControllerId((await routerAt('/acme/demo/widgets/12')).currentRoute.value)).toBe('acme.demo.widgets')
    for (const path of ['/settings', '/settings/mail', '/nowhere', '/acme/demo/widgets/abc']) {
      expect(routeControllerId((await routerAt(path)).currentRoute.value), path).toBe('')
    }
    expect(routeControllerId((await routerAt('/login')).currentRoute.value)).toBe('')
  })

  it('disables every plugin stylesheet on screens that are not controller views', async () => {
    await signIn()
    loadStyles('acme.demo.widgets', ['/admin-test/assets/acme/demo/css/route-widgets.css'])
    loadStyles('acme.demo.gadgets', ['/admin-test/assets/acme/demo/css/route-gadgets.css'])
    const router = await routerAt('/acme/demo/widgets')
    expect(enabled()).toEqual(['acme.demo.widgets'])

    for (const path of ['/settings', '/settings/mail', '/nowhere']) {
      await router.push(path)
      expect(enabled(), path).toEqual([])
    }

    await router.push('/acme/demo/gadgets/create')
    expect(enabled()).toEqual(['acme.demo.gadgets'])
    // Opening another controller whose schema has not arrived yet already
    // hides the previous controller's stylesheets.
    await router.push('/acme/demo/sprockets')
    expect(enabled()).toEqual([])
  })
})