From cae87b87a5464fcb83a9d7db2740d967785bfaca Mon Sep 17 00:00:00 2001 From: Sine Jespersen Date: Mon, 1 Sep 2025 11:04:13 +0200 Subject: [PATCH 1/2] 5317: remove. sh from readme, the scripts file does not have this file type --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 50508dd4..78de6586 100644 --- a/README.md +++ b/README.md @@ -69,7 +69,7 @@ TODO To run tests, use the script: ```shell -./scripts/test.sh +./scripts/test ``` This script will stop the node container, build the javascript/css assets, and run tests with playwright, From fc4a379faaf27abb61f35424615b8a53e2f5c14b Mon Sep 17 00:00:00 2001 From: Sine Jespersen Date: Mon, 1 Sep 2025 11:10:57 +0200 Subject: [PATCH 2/2] 5317: tests of travel template and add fixtures --- assets/template/fixtures/slide-fixtures.js | 41 ++++-- assets/tests/template/template-travel.spec.js | 134 +++++++++++++++++- 2 files changed, 157 insertions(+), 18 deletions(-) diff --git a/assets/template/fixtures/slide-fixtures.js b/assets/template/fixtures/slide-fixtures.js index abe134b7..4828a998 100644 --- a/assets/template/fixtures/slide-fixtures.js +++ b/assets/template/fixtures/slide-fixtures.js @@ -1559,7 +1559,7 @@ const slideFixtures = [ }, }, { - id: "travel-0", + id: "travel-multiple-stations", templateData: { id: "01FZD7K807VAKZ99BGSSCHRJM6", }, @@ -1583,19 +1583,36 @@ const slideFixtures = [ { id: "813041802", name: "Rolykkevej (Sæbygårdvej / Sæby)" }, ], iframeTitle: "Titel til iframe", - title: "Overskrift", - text: "

Tekst på slide

", - distance: "2 km", - timeModerate: "5-7 minutter", - timeFast: "3-23 minutter", image: ["/v1/media/00000000000000000000000001"], mediaContain: true, }, }, { - id: "travel-1", + id: "travel-spacious-info-box", templateData: { - id: "01FQBJFKM0YFX1VW5K94VBSNCP", + id: "01FZD7K807VAKZ99BGSSCHRJM6", + }, + content: { + numberOfJourneys: 1, + station: [ + { id: "41565", name: "Rolfsvej (Maribovej)" }, + { id: "813041802", name: "Rolykkevej (Sæbygårdvej / Sæby)" }, + ], + busOrTram: "tram", + iframeTitle: "Aarhus H (Letbane)", + title: "Stor infoboks!", + text: "

Tekst på slide med stor infoboks!

", + distance: "43 km", + timeModerate: "15-37 minutter", + timeFast: "3-23 minutter", + monitorLayout: "night", + disableIcons: true, + }, + }, + { + id: "travel-one-station", + templateData: { + id: "01FZD7K807VAKZ99BGSSCHRJM6", }, mediaData: { "/v1/media/00000000000000000000000001": { @@ -1616,10 +1633,10 @@ const slideFixtures = [ ], busOrTram: "tram", iframeTitle: "Aarhus H (Letbane)", - title: "Overskrift", - text: "

Tekst på slide

", - distance: "2 km", - timeModerate: "5-7 minutter", + title: "Én station", + text: "

Tekst på slide med én station

", + distance: "43 km", + timeModerate: "15-37 minutter", timeFast: "3-23 minutter", image: ["/v1/media/00000000000000000000000001"], monitorLayout: "night", diff --git a/assets/tests/template/template-travel.spec.js b/assets/tests/template/template-travel.spec.js index a9b9bb7c..5929ef61 100644 --- a/assets/tests/template/template-travel.spec.js +++ b/assets/tests/template/template-travel.spec.js @@ -1,13 +1,135 @@ import { test, expect } from "@playwright/test"; -test("Travel 0", async ({ page }) => { - await page.goto("/template/travel-0"); +test.describe("Travel-one-station: UI tests", () => { + test.beforeEach(async ({ page }) => { + await page.goto("/template/travel-one-station"); + }); - // TODO + test("Should display the correct heading", async ({ page }) => { + const heading = page.locator(".info-box .header h1"); + await expect(heading).toHaveText("Én station"); + }); + + test("Should display the info text", async ({ page }) => { + const text = page.locator(".info-box .text p"); + await expect(text).toHaveText("Tekst på slide med én station"); + }); + + test("Should display the distance correctly", async ({ page }) => { + const label = page.locator(".info-box .distance div:first-child"); + const value = page.locator(".info-box .distance .text"); + await expect(label).toHaveText("Afstand"); + await expect(value).toHaveText("43 km"); + }); + + test("Should display fast time correctly", async ({ page }) => { + const label = page.locator(".info-box .time-fast div:first-child"); + const value = page.locator(".info-box .time-fast .text"); + await expect(label).toHaveText("Tid (hurtig)"); + await expect(value).toHaveText("3-23 minutter"); + }); + + test("Should display moderate time correctly", async ({ page }) => { + const label = page.locator(".info-box .time-moderat div:first-child"); + const value = page.locator(".info-box .time-moderat .text"); + await expect(label).toHaveText("Tid (moderat)"); + await expect(value).toHaveText("15-37 minutter"); + }); + + test("Should display the map with correct background image", async ({ + page, + }) => { + const backgroundImage = page.locator(".map"); + await expect(backgroundImage).toHaveCSS( + "background-image", + new RegExp("/fixtures/template/images/mountain1.jpeg"), + ); + }); + + test("Should load the iframe with correct title and src", async ({ + page, + }) => { + const iframe = page.locator("iframe"); + await expect(iframe).toHaveAttribute("title", "iframe title"); + await expect(iframe).toHaveAttribute( + "src", + "https://webapp.rejseplanen.dk/bin/help.exe/mn?L=vs_tus.vs_new&station=860005301&tpl=monitor&stopFrequency=low&preview=50&offsetTime=1&maxJourneys=6&p1=letbane&p1title=Aarhus+H+%28Letbane%29&p1icons=null&monitorLayout=night", + ); + }); +}); + +test.describe("Travel-multiple-stations: UI tests", () => { + test.beforeEach(async ({ page }) => { + await page.goto("/template/travel-multiple-stations"); + }); + + test("Infobox not displayed", async ({ page }) => { + const infoBox = page.locator(".info-box"); + // Test that it does not exists + await expect(infoBox).toHaveCount(0); + }); + + test("Should not display background image", async ({ page }) => { + const backgroundImage = page.locator(".map"); + // Test that it does not exists + await expect(backgroundImage).toHaveCount(0); + }); + + test("Should load the iframe with correct title and src", async ({ + page, + }) => { + const iframe = page.locator("iframe"); + const growClass = page.locator(".iframe.grow"); + await expect(growClass).toBeVisible(); + await expect(iframe).toHaveAttribute("title", "iframe title"); + await expect(iframe).toHaveAttribute( + "src", + "https://webapp.rejseplanen.dk/bin/help.exe/mn?L=vs_tus.vs_new&station=751434104%40503000201%4053014%4044061%403342%403269%4041565%40813041802&tpl=monitor&stopFrequency=low&preview=50&offsetTime=1&maxJourneys=13&p1=bus&p1title=Titel+til+iframe", + ); + }); }); -test("Travel 1", async ({ page }) => { - await page.goto("/template/travel-1"); +test.describe("Travel-spacious-info-box: UI tests", () => { + test.beforeEach(async ({ page }) => { + await page.goto("/template/travel-spacious-info-box"); + }); + + test("Infobox class grow displayed", async ({ page }) => { + const growClass = page.locator(".info-box.grow"); + await expect(growClass).toBeVisible(); + }); + test("Should display the correct heading", async ({ page }) => { + const heading = page.locator(".info-box .header h1"); + await expect(heading).toHaveText("Stor infoboks!"); + }); + test("Should display the info text", async ({ page }) => { + const text = page.locator(".info-box .text p"); + await expect(text).toHaveText("Tekst på slide med stor infoboks!"); + }); + + test("Should display the distance correctly", async ({ page }) => { + const label = page.locator(".info-box .distance div:first-child"); + const value = page.locator(".info-box .distance .text"); + await expect(label).toHaveText("Afstand"); + await expect(value).toHaveText("43 km"); + }); + + test("Should display fast time correctly", async ({ page }) => { + const label = page.locator(".info-box .time-fast div:first-child"); + const value = page.locator(".info-box .time-fast .text"); + await expect(label).toHaveText("Tid (hurtig)"); + await expect(value).toHaveText("3-23 minutter"); + }); - // TODO + test("Should display moderate time correctly", async ({ page }) => { + const label = page.locator(".info-box .time-moderat div:first-child"); + const value = page.locator(".info-box .time-moderat .text"); + await expect(label).toHaveText("Tid (moderat)"); + await expect(value).toHaveText("15-37 minutter"); + }); + test("Should not display background image", async ({ page }) => { + const backgroundImage = page.locator(".map"); + // Test that it does not exists + await expect(backgroundImage).toBeEmpty(); + }); });