Skip to content

Commit

Permalink
refactor: types and style
Browse files Browse the repository at this point in the history
  • Loading branch information
oliviareichl committed Oct 2, 2024
1 parent ed6dbe8 commit 90b0609
Show file tree
Hide file tree
Showing 11 changed files with 149 additions and 153 deletions.
4 changes: 2 additions & 2 deletions components/app-header.vue
Original file line number Diff line number Diff line change
Expand Up @@ -103,13 +103,13 @@ const links = computed(() => {
<span class="sr-only">{{ links.home.label }}</span>
<NuxtImg
alt=""
class="mr-6 block h-18 w-44 object-contain lg:w-44 dark:hidden"
class="h-18 mr-6 block w-44 object-contain lg:w-44 dark:hidden"

Check warning on line 106 in components/app-header.vue

View workflow job for this annotation

GitHub Actions / Validate (20.x, ubuntu-latest)

Classname 'h-18' is not a Tailwind CSS class!
preload
:src="project.logos.light"
/>
<NuxtImg
alt=""
class="mr-6 hidden h-18 w-44 object-contain lg:w-44 dark:block"
class="h-18 mr-6 hidden w-44 object-contain lg:w-44 dark:block"

Check warning on line 112 in components/app-header.vue

View workflow job for this annotation

GitHub Actions / Validate (20.x, ubuntu-latest)

Classname 'h-18' is not a Tailwind CSS class!
preload
:src="project.logos.dark"
/>
Expand Down
2 changes: 1 addition & 1 deletion components/locale-switcher.vue
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ const labels = computed(() => {
<span class="sr-only">
{{ t("LocaleSwitcher.switch-locale", { locale: labels.of(locale) }) }}
</span>
<span aria-hidden="true">{{ locale.toUpperCase() }}</span>
<span aria-hidden="true">{{ (locale as string).toUpperCase() }}</span>
</NuxtLink>
<span v-else class="cursor-default font-semibold">
<span class="sr-only">
Expand Down
2 changes: 1 addition & 1 deletion config/i18n.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import type projectDe from "@/messages/de/project.json";

import { project } from "../config/project.config";

export const locales = ["de"];
export const locales = ["de"] as const;

export type Locale = (typeof locales)[number];

Expand Down
2 changes: 1 addition & 1 deletion config/project.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ const schema = v.object({
network: v.object({
excludeSystemClasses: v.array(v.string()),
}),
defaultLocale: v.picklist(["de", "en"]),
defaultLocale: v.picklist(["de"]),
fullscreen: v.boolean(),
imprint: v.picklist(["acdh-ch", "custom", "none"]),
logos: v.object({
Expand Down
1 change: 0 additions & 1 deletion e2e/lib/fixtures/i18n.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@ export async function createI18n(_page: Page, locale = defaultLocale): Promise<I
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
const messages = { ..._project.default, ..._messages.default } as Messages;

// @ts-expect-error Only messages for single locale provided.
return _createI18n({
legacy: false,
locale,
Expand Down
199 changes: 99 additions & 100 deletions e2e/tests/app/i18n.test.ts
Original file line number Diff line number Diff line change
@@ -1,104 +1,103 @@
import { createUrl } from "@acdh-oeaw/lib";
// import { createUrl } from "@acdh-oeaw/lib";

import { locales } from "@/config/i18n.config";
// import { locales } from "@/config/i18n.config";
import { expect, test } from "@/e2e/lib/test";

// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
const baseUrl = process.env.NUXT_PUBLIC_APP_BASE_URL!;

test.describe("i18n", () => {
test.describe("should redirect root route to preferred locale", () => {
test.use({ locale: "en" });

test("with default locale", async ({ page }) => {
await page.goto("/");
await expect(page).toHaveURL("/en");
});
});

test.describe("should redirect root route to preferred locale", () => {
test.use({ locale: "de" });

test("with supported locale", async ({ page }) => {
await page.goto("/");
await expect(page).toHaveURL("/de");
});
});

test.describe("should redirect root route to preferred locale", () => {
test.use({ locale: "fr" });

test("with unsupported locale", async ({ page }) => {
await page.goto("/");
await expect(page).toHaveURL("/en");
});
});

test("should display not-found page for unknown locale", async ({ createI18n, page }) => {
const i18n = await createI18n("en");
const response = await page.goto("/unknown");
expect(response?.status()).toBe(404);
await expect(page.getByRole("heading", { name: i18n.t("NotFoundPage.title") })).toBeVisible();
});

test("should display localised not-found page for unknown pathname", async ({
createI18n,
page,
}) => {
const i18n = await createI18n("de");
const response = await page.goto("/de/unknown");
expect(response?.status()).toBe(404);
await expect(page.getByRole("heading", { name: i18n.t("NotFoundPage.title") })).toBeVisible();
});

test("should support switching locale", async ({ createImprintPage, createI18n, page }) => {
const { imprintPage, i18n: i18nDe } = await createImprintPage("de");
await imprintPage.goto();

await expect(page).toHaveURL("/de/imprint");
await expect(page.getByRole("heading", { name: i18nDe.t("ImprintPage.title") })).toBeVisible();
await expect(page).toHaveTitle(
[i18nDe.t("ImprintPage.meta.title"), i18nDe.t("Metadata.name")].join(" | "),
);

await page
.getByRole("link", { name: i18nDe.t("LocaleSwitcher.switch-locale", { locale: "Englisch" }) })
.click();

const i18nEn = await createI18n("en");

await expect(page).toHaveURL("/en/imprint");
await expect(page.getByRole("heading", { name: i18nEn.t("ImprintPage.title") })).toBeVisible();
await expect(page).toHaveTitle(
[i18nEn.t("ImprintPage.meta.title"), i18nEn.t("Metadata.name")].join(" | "),
);
});

test("should set alternate links in link tags", async ({ page }) => {
function createAbsoluteUrl(pathname: string) {
return String(createUrl({ baseUrl, pathname }));
}

const pathnames = ["", "/imprint"];

for (const pathname of pathnames) {
for (const locale of locales) {
await page.goto(`/${locale}${pathname}`);

const links = await page.locator('link[rel="alternate"]').evaluateAll((elements) => {
return elements.map((element) => {
return element.outerHTML;
});
});

expect(links).toEqual(
expect.arrayContaining([
`<link id="i18n-alt-de" rel="alternate" href="${createAbsoluteUrl(`/de${pathname}`)}" hreflang="de">`,
`<link id="i18n-alt-en" rel="alternate" href="${createAbsoluteUrl(`/en${pathname}`)}" hreflang="en">`,
`<link id="i18n-xd" rel="alternate" href="${createAbsoluteUrl(`/en${pathname}`)}" hreflang="x-default">`,
]),
);
}
}
});
// const baseUrl = process.env.NUXT_PUBLIC_APP_BASE_URL!;

// test.describe("i18n", () => {
// test.describe("should redirect root route to preferred locale", () => {
// test.use({ locale: "en" });

// test("with default locale", async ({ page }) => {
// await page.goto("/");
// await expect(page).toHaveURL("/en");
// });
// });

// test.describe("should redirect root route to preferred locale", () => {
// test.use({ locale: "de" });

// test("with supported locale", async ({ page }) => {
// await page.goto("/");
// await expect(page).toHaveURL("/de");
// });
// });

// test.describe("should redirect root route to preferred locale", () => {
// test.use({ locale: "fr" });

// test("with unsupported locale", async ({ page }) => {
// await page.goto("/");
// await expect(page).toHaveURL("/en");
// });
// });

// test("should display not-found page for unknown locale", async ({ createI18n, page }) => {
// const i18n = await createI18n("en");
// const response = await page.goto("/unknown");
// expect(response?.status()).toBe(404);
// await expect(page.getByRole("heading", { name: i18n.t("NotFoundPage.title") })).toBeVisible();
// });

test("should display localised not-found page for unknown pathname", async ({
createI18n,
page,
}) => {
const i18n = await createI18n("de");
const response = await page.goto("/de/unknown");
expect(response?.status()).toBe(404);
await expect(page.getByRole("heading", { name: i18n.t("NotFoundPage.title") })).toBeVisible();
});

// test("should support switching locale", async ({ createImprintPage, createI18n, page }) => {
// const { imprintPage, i18n: i18nDe } = await createImprintPage("de");
// await imprintPage.goto();

// await expect(page).toHaveURL("/de/imprint");
// await expect(page.getByRole("heading", { name: i18nDe.t("ImprintPage.title") })).toBeVisible();
// await expect(page).toHaveTitle(
// [i18nDe.t("ImprintPage.meta.title"), i18nDe.t("Metadata.name")].join(" | "),
// );

// await page
// .getByRole("link", { name: i18nDe.t("LocaleSwitcher.switch-locale", { locale: "Englisch" }) })
// .click();

// const i18nEn = await createI18n("en");

// await expect(page).toHaveURL("/en/imprint");
// await expect(page.getByRole("heading", { name: i18nEn.t("ImprintPage.title") })).toBeVisible();
// await expect(page).toHaveTitle(
// [i18nEn.t("ImprintPage.meta.title"), i18nEn.t("Metadata.name")].join(" | "),
// );
// });

// test("should set alternate links in link tags", async ({ page }) => {
// function createAbsoluteUrl(pathname: string) {
// return String(createUrl({ baseUrl, pathname }));
// }

// const pathnames = ["", "/imprint"];

// for (const pathname of pathnames) {
// for (const locale of locales) {
// await page.goto(`/${locale}${pathname}`);

// const links = await page.locator('link[rel="alternate"]').evaluateAll((elements) => {
// return elements.map((element) => {
// return element.outerHTML;
// });
// });

// expect(links).toEqual(
// expect.arrayContaining([
// `<link id="i18n-alt-de" rel="alternate" href="${createAbsoluteUrl(`/de${pathname}`)}" hreflang="de">`,
// `<link id="i18n-alt-en" rel="alternate" href="${createAbsoluteUrl(`/en${pathname}`)}" hreflang="en">`,
// `<link id="i18n-xd" rel="alternate" href="${createAbsoluteUrl(`/en${pathname}`)}" hreflang="x-default">`,
// ]),
// );
// }
// }
// });
// });
10 changes: 5 additions & 5 deletions e2e/tests/app/metadata.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -21,11 +21,11 @@ test("should set a canonical url", async ({ createIndexPage }) => {
});

test("should set document title on not-found page", async ({ createI18n, page }) => {
const i18nEn = await createI18n("en");
await page.goto("/unknown");
await expect(page).toHaveTitle(
[i18nEn.t("NotFoundPage.meta.title"), i18nEn.t("Metadata.name")].join(" | "),
);
// const i18nEn = await createI18n("en");
// await page.goto("/unknown");
// await expect(page).toHaveTitle(
// [i18nEn.t("NotFoundPage.meta.title"), i18nEn.t("Metadata.name")].join(" | "),
// );

const i18nDe = await createI18n("de");
await page.goto("/de/unknown");
Expand Down
6 changes: 3 additions & 3 deletions e2e/tests/pages/imprint.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import { locales } from "@/config/i18n.config";
import { expect, test } from "@/e2e/lib/test";

test.describe("imprint page", () => {
test.skip("should have document title", async ({ createImprintPage }) => {
test("should have document title", async ({ createImprintPage }) => {
for (const locale of locales) {
const { i18n, imprintPage } = await createImprintPage(locale);
await imprintPage.goto();
Expand All @@ -13,7 +13,7 @@ test.describe("imprint page", () => {
}
});

test.skip("should have imprint text", async ({ createImprintPage }) => {
test("should have imprint text", async ({ createImprintPage }) => {
const imprints = {
de: "Offenlegung",
en: "Legal disclosure",
Expand All @@ -27,7 +27,7 @@ test.describe("imprint page", () => {
}
});

test.skip("should not have any automatically detectable accessibility issues", async ({
test("should not have any automatically detectable accessibility issues", async ({
createAccessibilityScanner,
createImprintPage,
}) => {
Expand Down
69 changes: 33 additions & 36 deletions project.config.json
Original file line number Diff line number Diff line change
@@ -1,38 +1,35 @@
{
"colors": {
"brand": "#6b5bcf",
"geojsonPoints": "#3A2A59",
"geojsonAreaCenterPoints": "#B2814E"
},
"network": {
"excludeSystemClasses": [
"type",
"reference_system",
"source_translation",
"source",
"bibliography",
"external_reference",
"administrative_unit",
"edition",
"type_tools",
"file"
]
},
"map": {
"startPage": false,
"mapDisplayedSystemClasses": [
"place",
"feature"
]
},
"fullscreen": true,
"defaultLocale": "de",
"imprint": "acdh-ch",
"logos": {
"light": "/assets/images/logo.jpg",
"dark": "/assets/images/logo.jpg",
"withTextLight": "/assets/images/logo.jpg",
"withTextDark": "/assets/images/logo.jpg"
},
"twitter": "@openatlas_eu"
"colors": {
"brand": "#6b5bcf",
"geojsonPoints": "#3A2A59",
"geojsonAreaCenterPoints": "#B2814E"
},
"network": {
"excludeSystemClasses": [
"type",
"reference_system",
"source_translation",
"source",
"bibliography",
"external_reference",
"administrative_unit",
"edition",
"type_tools",
"file"
]
},
"map": {
"startPage": false,
"mapDisplayedSystemClasses": ["place", "feature"]
},
"fullscreen": true,
"defaultLocale": "de",
"imprint": "acdh-ch",
"logos": {
"light": "/assets/images/logo.jpg",
"dark": "/assets/images/logo.jpg",
"withTextLight": "/assets/images/logo.jpg",
"withTextDark": "/assets/images/logo.jpg"
},
"twitter": "@openatlas_eu"
}
1 change: 1 addition & 0 deletions scripts/generate-crm-locale.ts
Original file line number Diff line number Diff line change
Expand Up @@ -127,6 +127,7 @@ async function writeCrmMessages(obj: object, locale: string) {
encoding: "utf-8",
});
}

/**
* Generates CRM messages for the specified locale.
* @param locale - The locale for which to generate CRM messages. Defaults to `defaultLocale` if not provided.
Expand Down
6 changes: 3 additions & 3 deletions server/routes/manifest.webmanifest.get.ts
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
import { createI18n } from "vue-i18n";

import en from "@/messages/en/common.json";
import projectEn from "@/messages/en/project.json";
import de from "@/messages/de/common.json";
import projectDe from "@/messages/de/project.json";

const locale = "en";

const { t } = createI18n({
legacy: false,
locale,
messages: { en: { ...en, ...projectEn } },
messages: { de: { ...de, ...projectDe } },
}).global;

const manifest = {
Expand Down

0 comments on commit 90b0609

Please sign in to comment.