From 6b7a2aa70652dce6658b48ccfed79a660f640cb7 Mon Sep 17 00:00:00 2001
From: Mats <64415243+mnyflot@users.noreply.github.com>
Date: Mon, 22 Apr 2024 14:43:25 +0200
Subject: [PATCH] =?UTF-8?q?fix(frontend):=20:white=5Fcheck=5Fmark:=20fix?=
 =?UTF-8?q?=20blog=20end2end=20test=20to=20only=20acces=E2=80=A6=20(#355)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* fix(frontend): :white_check_mark: fix blog end2end test to only access first element

* refactor(ide): :recycle: move project en2end test into end2end folder

* test(frontend): :white_check_mark: add satellite end2end test

* style(frontend): :rotating_light: run prettier
---
 .../componentTests/SatelliteSelector.spec.tsx |  2 +
 frontend/tests/e2e/blog.desktop.spec.ts       |  6 ++-
 .../tests/{ => e2e}/project.desktop.spec.ts   |  0
 .../tests/{ => e2e}/project.mobile.spec.ts    |  0
 frontend/tests/e2e/satellite.desktop.spec.ts  | 34 ++++++++++++++
 frontend/tests/e2e/satellite.mobile.spec.ts   | 45 +++++++++++++++++++
 6 files changed, 85 insertions(+), 2 deletions(-)
 create mode 100644 frontend/tests/componentTests/SatelliteSelector.spec.tsx
 rename frontend/tests/{ => e2e}/project.desktop.spec.ts (100%)
 rename frontend/tests/{ => e2e}/project.mobile.spec.ts (100%)
 create mode 100644 frontend/tests/e2e/satellite.desktop.spec.ts
 create mode 100644 frontend/tests/e2e/satellite.mobile.spec.ts

diff --git a/frontend/tests/componentTests/SatelliteSelector.spec.tsx b/frontend/tests/componentTests/SatelliteSelector.spec.tsx
new file mode 100644
index 0000000..336646a
--- /dev/null
+++ b/frontend/tests/componentTests/SatelliteSelector.spec.tsx
@@ -0,0 +1,2 @@
+import SatelliteSelector from "@/components/homeComponents/SatelliteSelector";
+import { test, expect } from "@playwright/experimental-ct-react";
diff --git a/frontend/tests/e2e/blog.desktop.spec.ts b/frontend/tests/e2e/blog.desktop.spec.ts
index d8649d4..9d86179 100644
--- a/frontend/tests/e2e/blog.desktop.spec.ts
+++ b/frontend/tests/e2e/blog.desktop.spec.ts
@@ -9,8 +9,10 @@ test.describe("Blogs pages test", () => {
         await expect(page.getByTestId("pageSubtitle")).toBeVisible();
         await page.getByTestId("blogsSatellitesButton").click();
         await expect(page).toHaveURL("/blog?page=1&tag=Satellites");
-        await expect(page.getByTestId("articleTag")).toHaveText("Satellites");
-        await page.getByTestId("blogCardLink").click();
+        await expect(page.getByTestId("articleTag").first()).toHaveText(
+            "Satellites",
+        );
+        await page.getByTestId("blogCardLink").first().click();
         await expect(page).toHaveURL(/\/blog\/.+$/);
     });
     test("individualBlogPagetest", async ({ page }) => {
diff --git a/frontend/tests/project.desktop.spec.ts b/frontend/tests/e2e/project.desktop.spec.ts
similarity index 100%
rename from frontend/tests/project.desktop.spec.ts
rename to frontend/tests/e2e/project.desktop.spec.ts
diff --git a/frontend/tests/project.mobile.spec.ts b/frontend/tests/e2e/project.mobile.spec.ts
similarity index 100%
rename from frontend/tests/project.mobile.spec.ts
rename to frontend/tests/e2e/project.mobile.spec.ts
diff --git a/frontend/tests/e2e/satellite.desktop.spec.ts b/frontend/tests/e2e/satellite.desktop.spec.ts
new file mode 100644
index 0000000..c236843
--- /dev/null
+++ b/frontend/tests/e2e/satellite.desktop.spec.ts
@@ -0,0 +1,34 @@
+import { test, expect } from "@playwright/test";
+
+test.describe("All Satellites Page Test", () => {
+    test("CheckHeadingAndSubtitleIsVisible", async ({ page }) => {
+        await page.goto("/");
+        await page.getByRole("button", { name: "Satellites" }).click();
+        await expect(page).toHaveURL("/satellites");
+        await expect(page.getByTestId("pageHeader")).toBeVisible();
+        await expect(page.getByTestId("pageSubtitle")).toBeVisible();
+    });
+    test("CheckIfCardIsClickable", async ({ page }) => {
+        await page.goto("/");
+        await page.getByRole("button", { name: "Satellites" }).click();
+        await expect(page).toHaveURL("/satellites");
+        await expect(
+            page.getByTestId("satellitesTableRow").first(),
+        ).toBeVisible();
+        await page.getByTestId("satellitesTableRow").first().click();
+        //Checks if the URL matches /satellites/anySlug
+        await expect(page).toHaveURL(/\/satellites\/.+$/);
+    });
+});
+
+test.describe("Individual Satellite Page Test", () => {
+    test("TestHeadingAndParagraphIsVisible", async ({ page }) => {
+        await page.goto("/");
+        await page.getByRole("button", { name: "Satellites" }).click();
+        await page.getByTestId("satellitesTableRow").first().click();
+        await expect(page).toHaveURL(/\/satellites\/.+$/);
+        await expect(page.getByRole("heading").first()).toBeVisible();
+        await expect(page.getByRole("heading").nth(2)).toBeVisible();
+        await expect(page.getByTestId("blockParagraph").first()).toBeVisible();
+    });
+});
diff --git a/frontend/tests/e2e/satellite.mobile.spec.ts b/frontend/tests/e2e/satellite.mobile.spec.ts
new file mode 100644
index 0000000..df4561e
--- /dev/null
+++ b/frontend/tests/e2e/satellite.mobile.spec.ts
@@ -0,0 +1,45 @@
+import { test, expect } from "@playwright/test";
+
+test.describe("All Satellites Page Test", () => {
+    test.use({
+        viewport: { width: 390, height: 844 },
+    });
+
+    test("CheckHeadingAndSubtitleIsVisible", async ({ page }) => {
+        await page.goto("/");
+        await page.getByRole("navigation").getByRole("button").click();
+        await page.getByRole("button", { name: "Satellites" }).click();
+        await expect(page).toHaveURL("/satellites");
+        await expect(page.getByTestId("pageHeader")).toBeVisible();
+        await expect(page.getByTestId("pageSubtitle")).toBeVisible();
+    });
+    test("CheckIfCardIsClickable", async ({ page }) => {
+        await page.goto("/");
+        await page.getByRole("navigation").getByRole("button").click();
+        await page.getByRole("button", { name: "Satellites" }).click();
+        await expect(page).toHaveURL("/satellites");
+        await expect(
+            page.getByTestId("satellitesTableRow").first(),
+        ).toBeVisible();
+        await page.getByTestId("satellitesTableRow").first().click();
+        //Checks if the URL matches /satellites/anySlug
+        await expect(page).toHaveURL(/\/satellites\/.+$/);
+    });
+});
+
+test.describe("Individual Satellite Page Test", () => {
+    test.use({
+        viewport: { width: 390, height: 844 },
+    });
+
+    test("TestHeadingAndParagraphIsVisible", async ({ page }) => {
+        await page.goto("/");
+        await page.getByRole("navigation").getByRole("button").click();
+        await page.getByRole("button", { name: "Satellites" }).click();
+        await page.getByTestId("satellitesTableRow").first().click();
+        await expect(page).toHaveURL(/\/satellites\/.+$/);
+        await expect(page.getByRole("heading").first()).toBeVisible();
+        await expect(page.getByRole("heading").nth(2)).toBeVisible();
+        await expect(page.getByTestId("blockParagraph").first()).toBeVisible();
+    });
+});