Add Vitest tests for the languages, router, footer and pages, and a lint:check script

tests/router.test.js

@@ -0,0 +1,127 @@
+/**
+ * Every address on the site starts with the language: /de/servers. The router
+ * adds one when it is missing, remembers the one in use, switches the page's
+ * language and sets the title. The real router and its guard run here.
+ */
+
+import { installI18n, withRedirectLimit } from './helpers'
+import router from '@/routes'
+
+// Pushing the address the router is already on does nothing (and so skips the
+// guard), so every test starts from the same neutral page.
+beforeEach(async () => {
+  installI18n('en')
+  await router.push('/en/privacy')
+  localStorage.clear()
+  installI18n('en')
+  document.title = ''
+})
+
+describe('addresses without a language', () => {
+  test('the home address goes to the language you used last, or English', async () => {
+    await router.push('/')
+    expect(router.currentRoute.value.fullPath).toBe('/en')
+    expect(router.currentRoute.value.name).toBe('Home')
+
+    localStorage.setItem('lang', 'fr')
+    await router.push('/')
+    expect(router.currentRoute.value.fullPath).toBe('/fr')
+  })
+
+  test('a page address gets the language put in front of it', async () => {
+    await router.push('/servers')
+    expect(router.currentRoute.value.fullPath).toBe('/en/servers')
+    expect(router.currentRoute.value.name).toBe('Servers')
+
+    localStorage.setItem('lang', 'de')
+    await router.push('/about')
+    expect(router.currentRoute.value.fullPath).toBe('/de/about')
+  })
+})
+
+describe('opening a page in a language', () => {
+  test('sets the page language, remembers it, and sets the title', async () => {
+    await router.push('/de/about')
+    expect(router.currentRoute.value.name).toBe('About')
+    expect(document.documentElement.getAttribute('lang')).toBe('de')
+    expect(localStorage.getItem('lang')).toBe('de')
+    expect(document.title).toBe('About - BeamMP')
+  })
+
+  test('loads a language the first time it is used', async () => {
+    expect(window.i18n.global.availableLocales).toEqual(['en'])
+    await router.push('/ru/about')
+    expect(window.i18n.global.availableLocales).toContain('ru')
+  })
+
+  test('every language in the picker opens', async () => {
+    for (const code of ['en', 'es', 'fr', 'de', 'it', 'ru', 'zh']) {
+      await router.push(`/${code}/partners`)
+      expect(router.currentRoute.value.fullPath).toBe(`/${code}/partners`)
+      expect(document.documentElement.getAttribute('lang')).toBe(code)
+    }
+  })
+})
+
+describe('the pages', () => {
+  const pages = ['', 'about', 'communities', 'servers', 'stats', 'partners', 'privacy', 'terms']
+
+  test.each(pages)('/en/%s opens its page', async (page) => {
+    await router.push(`/en/${page}`)
+    expect(router.currentRoute.value.matched.length).toBeGreaterThan(0)
+    expect(router.currentRoute.value.name).not.toBe('NotFound')
+  })
+
+  test('every page has its own title and description for search engines and tabs', () => {
+    const named = router.getRoutes().filter((r) => r.name && r.name !== 'NotFound')
+    expect(named.length).toBeGreaterThanOrEqual(pages.length)
+    for (const route of named) {
+      expect(route.meta.title, `${String(route.name)} title`).toMatch(/ - BeamMP$/)
+      expect(route.meta.description, `${String(route.name)} description`).toBeTruthy()
+    }
+    const titles = named.map((r) => r.meta.title)
+    expect(new Set(titles).size).toBe(titles.length)
+  })
+})
+
+// This used to never finish: the not-found route matches anything, so it has
+// no `locale` param even for /en/nope. The guard took that to mean "no
+// language", redirected to /en/en/nope, which also has none, and so on - the
+// page froze instead of showing the not-found page. withRedirectLimit stops a
+// runaway redirect so a regression fails the test instead of hanging it.
+describe('an address the site does not have', () => {
+  const openWithRedirectLimit = (address) => withRedirectLimit(() => router.push(address))
+
+  test.each([
+    ['/en/does-not-exist', '/en/does-not-exist'],
+    ['/de/does-not-exist', '/de/does-not-exist'],
+    ['/en/servers/nope/deeper', '/en/servers/nope/deeper'],
+  ])('%s shows the not-found page where it is', async (address, expected) => {
+    await openWithRedirectLimit(address)
+    expect(router.currentRoute.value.name).toBe('NotFound')
+    expect(router.currentRoute.value.fullPath).toBe(expected)
+  })
+
+  test('one with no language gets the language you last used, then the not-found page', async () => {
+    await openWithRedirectLimit('/does-not-exist')
+    expect(router.currentRoute.value.fullPath).toBe('/en/does-not-exist')
+    expect(router.currentRoute.value.name).toBe('NotFound')
+
+    localStorage.setItem('lang', 'fr')
+    await openWithRedirectLimit('/also-missing')
+    expect(router.currentRoute.value.fullPath).toBe('/fr/also-missing')
+    expect(router.currentRoute.value.name).toBe('NotFound')
+  })
+
+  test('a language the site does not have is treated as part of the missing address', async () => {
+    await openWithRedirectLimit('/xx/about')
+    expect(router.currentRoute.value.fullPath).toBe('/en/xx/about')
+    expect(router.currentRoute.value.name).toBe('NotFound')
+  })
+
+  test('the not-found page is shown in the language of the address', async () => {
+    await openWithRedirectLimit('/de/does-not-exist')
+    expect(document.documentElement.getAttribute('lang')).toBe('de')
+    expect(localStorage.getItem('lang')).toBe('de')
+  })
+})