From 229a27bce2acf81354fb513e13c2b4f47e8211b0 Mon Sep 17 00:00:00 2001
From: Christian Cueni <christian.cueni@iterativ.ch>
Date: Thu, 13 Oct 2022 11:21:59 +0200
Subject: [PATCH] Add medialibrary test

---
 client/src/components/MainNavigationBar.vue      |  1 +
 .../src/components/mediaLibrary/OverviewCard.vue |  5 ++++-
 .../pages/mediaLibrary/MLCategoryIndexPage.vue   |  4 +++-
 cypress/e2e/mediaLibrary.cy.js                   | 16 ++++++++++++++++
 4 files changed, 24 insertions(+), 2 deletions(-)
 create mode 100644 cypress/e2e/mediaLibrary.cy.js

diff --git a/client/src/components/MainNavigationBar.vue b/client/src/components/MainNavigationBar.vue
index 4bb0d802..b23609fa 100644
--- a/client/src/components/MainNavigationBar.vue
+++ b/client/src/components/MainNavigationBar.vue
@@ -173,6 +173,7 @@ const profileDropdownData = [
               to="/media/versicherungsvermittlerin-media"
               class="nav-item"
               :class="{ 'nav-item--active': isInRoutePath(['/media']) }"
+              data-cy="medialibrary-link"
             >
               Mediathek
             </router-link>
diff --git a/client/src/components/mediaLibrary/OverviewCard.vue b/client/src/components/mediaLibrary/OverviewCard.vue
index b1fa1abc..ba0de6c2 100644
--- a/client/src/components/mediaLibrary/OverviewCard.vue
+++ b/client/src/components/mediaLibrary/OverviewCard.vue
@@ -17,7 +17,10 @@ const props = withDefaults(defineProps<Props>(), {
     <div>
       <h3 class="mb-4">{{ title }}</h3>
       <p class="mb-4">{{ description }}</p>
-      <router-link :to="link" class="btn-text inline-flex items-center pl-0 pr-3 py-2">
+      <router-link
+        :to="link"
+        class="btn-text inline-flex items-center pl-0 pr-3 py-2"
+        :data-cy="`${title}-link`">
         <span class="inline">{{ call2Action }}</span>
         <it-icon-arrow-right class="ml-1 h-5 w-5"></it-icon-arrow-right>
       </router-link>
diff --git a/client/src/pages/mediaLibrary/MLCategoryIndexPage.vue b/client/src/pages/mediaLibrary/MLCategoryIndexPage.vue
index 363eb166..9188e344 100644
--- a/client/src/pages/mediaLibrary/MLCategoryIndexPage.vue
+++ b/client/src/pages/mediaLibrary/MLCategoryIndexPage.vue
@@ -33,7 +33,9 @@ watch(dropdownSelected, (newValue) =>
     <div v-if="mediaStore.mediaLibraryPage">
       <ul class="grid gap-5 grid-cols-1 lg:grid-cols-4">
         <li v-for="cat in categories" :key="cat.id" class="bg-white p-4">
-          <router-link :to="cat.frontend_url">
+          <router-link
+            :to="cat.frontend_url"
+            :data-cy="`${cat.title}-link`">
             <img
               class="m-auto"
               :src="`/static/icons/demo/${cat.overview_icon}.svg`"
diff --git a/cypress/e2e/mediaLibrary.cy.js b/cypress/e2e/mediaLibrary.cy.js
new file mode 100644
index 00000000..8ded30bf
--- /dev/null
+++ b/cypress/e2e/mediaLibrary.cy.js
@@ -0,0 +1,16 @@
+import { login } from "./helpers";
+
+describe("MediaLibrary", () => {
+  beforeEach(() => {
+    cy.manageCommand("cypress_reset");
+
+    login("admin", "test");
+    cy.visit("/learn/test-lehrgang-lp/analyse");
+  });
+
+  it("should be accessible", () => {
+    cy.get('[data-cy="medialibrary-link"]').click();
+    cy.get('[data-cy="Handlungsfelder-link"]').click();
+    cy.get('[data-cy="Fahrzeug-link"]').click();
+  });
+});