visual testing

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);
     },

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();
   });
 });

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,
       }"