diff --git a/cypress.config.ts b/cypress.config.ts
index 6726a804af..15d714ba26 100644
--- a/cypress.config.ts
+++ b/cypress.config.ts
@@ -42,11 +42,6 @@ export default defineConfig({
 
 		},
 
-		excludeSpecPattern: [
-			'cypress/visual/AppNavigationItem.cy.ts',
-		],
-
-
 		devServer: {
 			framework: 'vue',
 			bundler: 'vite',
diff --git a/cypress/visual/AppNavigationItem.cy.ts b/cypress/visual/AppNavigationItem.cy.ts
index 7f10f036b2..5eec903f22 100644
--- a/cypress/visual/AppNavigationItem.cy.ts
+++ b/cypress/visual/AppNavigationItem.cy.ts
@@ -1,37 +1,24 @@
-import { mount } from 'cypress/vue2'
-import Vue, { defineComponent } from 'vue'
-import VueRouter from 'vue-router'
+import { mount } from 'cypress/vue'
+import { createRouter, createMemoryHistory} from 'vue-router'
 
-import NcAppNavigationItem from '../../src/components/NcAppNavigationItem/NcAppNavigationItem.vue'
+import Wrapper from './Wrapper.vue'
 
 describe('NcAppNavigationItem', () => {
 	describe('With router link', () => {
-		const RouterComponent = defineComponent({
-			template: `
-			<div style="width: 300px; background: white;">
-				<NcAppNavigationItem name="Home" to="/" :editable="true" />
-				<NcAppNavigationItem name="Foo" to="/foo" :editable="true" />
-				<NcAppNavigationItem name="Back" active :editable="true" />
-				<NcAppNavigationItem name="Bar" :editable="true" />
-			</div>`,
-			components: { NcAppNavigationItem },
-		})
 
-		const router = new VueRouter({
+		const router = createRouter({
 			routes: [
-				{ path: '/' },
-				{ path: '/foo' },
+				{ path: '/', component: Wrapper },
+				{ path: '/foo', component: Wrapper },
 			],
+			history: createMemoryHistory(),
 		})
 
 		beforeEach(() => {
-			Vue.use(VueRouter)
-
-			mount(RouterComponent as never, {
+			mount(Wrapper as never, {
 				extensions: {
 					plugins: [router],
 				},
-				router,
 			})
 		})
 
diff --git a/cypress/visual/Wrapper.vue b/cypress/visual/Wrapper.vue
new file mode 100644
index 0000000000..f2fa4cf714
--- /dev/null
+++ b/cypress/visual/Wrapper.vue
@@ -0,0 +1,18 @@
+<template>
+	<div style="width: 300px; background: white;">
+		<NcAppNavigationItem name="Home" to="/" :editable="true" />
+		<NcAppNavigationItem name="Foo" to="/foo" :editable="true" />
+		<NcAppNavigationItem name="Back" active :editable="true" />
+		<NcAppNavigationItem name="Bar" :editable="true" />
+	</div>
+</template>
+
+<script>
+import NcAppNavigationItem from '../../src/components/NcAppNavigationItem/NcAppNavigationItem.vue'
+
+import { defineComponent } from 'vue'
+
+export default defineComponent({
+	components: { NcAppNavigationItem },
+})
+</script>