From fc0b41cb6776f1450b35316d86e0f3dbb8f516e3 Mon Sep 17 00:00:00 2001
From: Frank Elsinga <frank@elsinga.de>
Date: Wed, 15 Nov 2023 20:58:21 +0100
Subject: [PATCH] visual testing

---
 webclient/cypress.config.ts               |  2 ++
 webclient/cypress/e2e/visual.cy.ts        | 30 +++++++++++------------
 webclient/src/components/AppSearchBar.vue |  1 +
 3 files changed, 18 insertions(+), 15 deletions(-)

diff --git a/webclient/cypress.config.ts b/webclient/cypress.config.ts
index 830d2e987..a48aa31f7 100644
--- a/webclient/cypress.config.ts
+++ b/webclient/cypress.config.ts
@@ -2,7 +2,9 @@ import { defineConfig } from "cypress";
 import { initPlugin } from "@frsource/cypress-plugin-visual-regression-diff/plugins";
 
 export default defineConfig({
+  projectId: "u6fxcx",
   e2e: {
+    experimentalStudio: true,
     setupNodeEvents(on, config) {
       initPlugin(on, config);
     },
diff --git a/webclient/cypress/e2e/visual.cy.ts b/webclient/cypress/e2e/visual.cy.ts
index 1492095c1..919c8cc44 100644
--- a/webclient/cypress/e2e/visual.cy.ts
+++ b/webclient/cypress/e2e/visual.cy.ts
@@ -1,53 +1,53 @@
-describe("Visual change", () => {
+describe("visual", () => {
   it("main", () => {
     cy.visit("http://localhost:3000/");
     cy.contains("Standorte");
-    cy.matchImage();
+    cy.get("#content").matchImage();
   });
   it("search", () => {
     cy.visit("http://localhost:3000/search?q=mw2001");
     cy.contains("Räume");
-    cy.matchImage();
+    cy.get("#content").matchImage();
   });
   it("search-bar", () => {
     cy.visit("http://localhost:3000/");
     cy.get("input").type("fsmb");
     cy.wait(500);
-    cy.matchImage();
+    cy.get('[data-cy="autocomplete-menu"]').matchImage();
   });
   it("about/privacy", () => {
     cy.visit("http://localhost:3000/about/privacy");
-    cy.contains("Privacy");
-    cy.matchImage();
+    cy.contains("Privacy Policy");
+    cy.get("#content").matchImage();
   });
   it("about/datenschutz", () => {
     cy.visit("http://localhost:3000/about/datenschutz");
     cy.contains("Datenschutz");
-    cy.matchImage();
+    cy.get("#content").matchImage();
   });
   it("about/ueber-uns", () => {
     cy.visit("http://localhost:3000/about/ueber-uns");
-    cy.contains("Über Navigatum");
-    cy.matchImage();
+    cy.contains("Über NavigaTUM");
+    cy.get("#content").matchImage();
   });
   it("about/about-us", () => {
-    cy.visit("http://localhost:3000/about/ueber-uns");
-    cy.contains("About us");
-    cy.matchImage();
+    cy.visit("http://localhost:3000/about/about-us");
+    cy.contains("About NavigaTUM");
+    cy.get("#content").matchImage();
   });
   it("about/impressum", () => {
     cy.visit("http://localhost:3000/about/impressum");
     cy.contains("Impressum");
-    cy.matchImage();
+    cy.get("#content").matchImage();
   });
   it("about/imprint", () => {
     cy.visit("http://localhost:3000/about/imprint");
     cy.contains("Imprint");
-    cy.matchImage();
+    cy.get("#content").matchImage();
   });
   it("api", () => {
     cy.visit("http://localhost:3000/api");
     cy.contains("Api");
-    cy.matchImage();
+    cy.get("#content").matchImage();
   });
 });
diff --git a/webclient/src/components/AppSearchBar.vue b/webclient/src/components/AppSearchBar.vue
index 7aafba567..941827d38 100644
--- a/webclient/src/components/AppSearchBar.vue
+++ b/webclient/src/components/AppSearchBar.vue
@@ -176,6 +176,7 @@ onMounted(() => {
     <ul
       v-cloak
       class="menu"
+      data-cy="autocomplete-menu"
       :class="{
         'd-none': !global.search_focused || autocomplete.sections.length === 0,
       }"