From ad59e9b5b862c09182a0e3d27df4e62d429438ce Mon Sep 17 00:00:00 2001 From: Manuel Holtgrewe Date: Wed, 18 Oct 2023 12:17:25 +0200 Subject: [PATCH] fix: menu links for details page and tests (#160) Co-authored-by: gromdimon --- frontend/src/components/HeaderDefault.vue | 10 ++++----- frontend/src/components/HeaderDetailPage.vue | 22 +++++++++++++++++-- .../__tests__/HeaderDefault.spec.ts | 12 +++++----- .../__tests__/HeaderDetailPage.spec.ts | 7 +++--- .../views/__tests__/ACMGCriteriaDoc.spec.ts | 7 +++--- .../src/views/__tests__/ACMGSVDocs.spec.ts | 7 +++--- .../src/views/__tests__/AboutView.spec.ts | 7 +++--- .../src/views/__tests__/ContactView.spec.ts | 7 +++--- .../views/__tests__/GeneDetailView.spec.ts | 13 +++++------ .../src/views/__tests__/GenesListView.spec.ts | 7 +++--- frontend/src/views/__tests__/HomeView.spec.ts | 7 +++--- .../views/__tests__/VariantDetailView.spec.ts | 7 +++--- 12 files changed, 61 insertions(+), 52 deletions(-) diff --git a/frontend/src/components/HeaderDefault.vue b/frontend/src/components/HeaderDefault.vue index c7c86658..be181e78 100644 --- a/frontend/src/components/HeaderDefault.vue +++ b/frontend/src/components/HeaderDefault.vue @@ -20,22 +20,22 @@ import UserProfileButton from '@/components/UserProfileButton.vue' - + - + About - + Contact - + Privacy Policy - + Terms of Use diff --git a/frontend/src/components/HeaderDetailPage.vue b/frontend/src/components/HeaderDetailPage.vue index 1c24fa87..530dba18 100644 --- a/frontend/src/components/HeaderDetailPage.vue +++ b/frontend/src/components/HeaderDetailPage.vue @@ -64,9 +64,27 @@ watch(() => props.searchTerm, updateTerms) /> - About - Contact + + + + + + About + + + Contact + + + Privacy Policy + + + Terms of Use + + + diff --git a/frontend/src/components/__tests__/HeaderDefault.spec.ts b/frontend/src/components/__tests__/HeaderDefault.spec.ts index 57aac2cc..46034c4a 100644 --- a/frontend/src/components/__tests__/HeaderDefault.spec.ts +++ b/frontend/src/components/__tests__/HeaderDefault.spec.ts @@ -1,4 +1,6 @@ import { describe, expect, it } from 'vitest' +import { nextTick } from 'vue' +import { VMenu } from 'vuetify/components' import { setupMountedComponents } from '@/lib/test-utils' @@ -23,7 +25,7 @@ describe.concurrent('HeaderDefault.vue', () => { expect(title.text()).toBe('REEV: Explanation and Evaluation of Variants') }) - it('renders the navigation links', () => { + it('renders the navigation links', async () => { const { wrapper } = setupMountedComponents( { component: HeaderDefault, template: true }, { @@ -35,9 +37,9 @@ describe.concurrent('HeaderDefault.vue', () => { } ) - const aboutLink = wrapper.find('#about') - const contactLink = wrapper.find('#contact') - expect(aboutLink.exists()).toBe(true) - expect(contactLink.exists()).toBe(true) + const menu = wrapper.findComponent(VMenu) + expect(menu.exists()).toBe(true) + await menu.trigger('click') + await nextTick() }) }) diff --git a/frontend/src/components/__tests__/HeaderDetailPage.spec.ts b/frontend/src/components/__tests__/HeaderDetailPage.spec.ts index a08c95b8..311f56c5 100644 --- a/frontend/src/components/__tests__/HeaderDetailPage.spec.ts +++ b/frontend/src/components/__tests__/HeaderDetailPage.spec.ts @@ -1,5 +1,6 @@ import { afterEach, describe, expect, it, vi } from 'vitest' import { nextTick } from 'vue' +import { VMenu } from 'vuetify/components' import { DottyClient } from '@/api/dotty' import SearchBar from '@/components/SearchBar.vue' @@ -40,11 +41,9 @@ describe.concurrent('HeaderDetailPage', async () => { store.geneInfo = JSON.parse(JSON.stringify(geneData.geneInfo)) const logo = wrapper.find('#logo') - const aboutLink = wrapper.find('#about') - const contactLink = wrapper.find('#contact') + const menu = wrapper.findComponent(VMenu) expect(logo.exists()).toBe(true) - expect(aboutLink.exists()).toBe(true) - expect(contactLink.exists()).toBe(true) + expect(menu.exists()).toBe(true) }) it('renders the search bar', async () => { diff --git a/frontend/src/views/__tests__/ACMGCriteriaDoc.spec.ts b/frontend/src/views/__tests__/ACMGCriteriaDoc.spec.ts index 13c8ba50..6da585b1 100644 --- a/frontend/src/views/__tests__/ACMGCriteriaDoc.spec.ts +++ b/frontend/src/views/__tests__/ACMGCriteriaDoc.spec.ts @@ -1,4 +1,5 @@ import { describe, expect, it } from 'vitest' +import { VMenu } from 'vuetify/components' import { setupMountedComponents } from '@/lib/test-utils' @@ -18,11 +19,9 @@ describe.concurrent('ACMGCriteriaDocs', async () => { ) const logo = wrapper.find('#logo') - const aboutLink = wrapper.find('#about') - const contactLink = wrapper.find('#contact') + const menu = wrapper.findComponent(VMenu) expect(logo.exists()).toBe(true) - expect(aboutLink.exists()).toBe(true) - expect(contactLink.exists()).toBe(true) + expect(menu.exists()).toBe(true) }) it('renders the main content', () => { diff --git a/frontend/src/views/__tests__/ACMGSVDocs.spec.ts b/frontend/src/views/__tests__/ACMGSVDocs.spec.ts index b6eeec2f..04823c96 100644 --- a/frontend/src/views/__tests__/ACMGSVDocs.spec.ts +++ b/frontend/src/views/__tests__/ACMGSVDocs.spec.ts @@ -1,4 +1,5 @@ import { describe, expect, it } from 'vitest' +import { VMenu } from 'vuetify/components' import { setupMountedComponents } from '@/lib/test-utils' @@ -18,11 +19,9 @@ describe.concurrent('ACMGSVDocs', async () => { ) const logo = wrapper.find('#logo') - const aboutLink = wrapper.find('#about') - const contactLink = wrapper.find('#contact') + const menu = wrapper.findComponent(VMenu) expect(logo.exists()).toBe(true) - expect(aboutLink.exists()).toBe(true) - expect(contactLink.exists()).toBe(true) + expect(menu.exists()).toBe(true) }) it('renders the main content', () => { diff --git a/frontend/src/views/__tests__/AboutView.spec.ts b/frontend/src/views/__tests__/AboutView.spec.ts index 1632800c..af10c716 100644 --- a/frontend/src/views/__tests__/AboutView.spec.ts +++ b/frontend/src/views/__tests__/AboutView.spec.ts @@ -1,4 +1,5 @@ import { describe, expect, it } from 'vitest' +import { VMenu } from 'vuetify/components' import { setupMountedComponents } from '@/lib/test-utils' @@ -18,11 +19,9 @@ describe.concurrent('AboutView', async () => { ) const logo = wrapper.find('#logo') - const aboutLink = wrapper.find('#about') - const contactLink = wrapper.find('#contact') + const menu = wrapper.findComponent(VMenu) expect(logo.exists()).toBe(true) - expect(aboutLink.exists()).toBe(true) - expect(contactLink.exists()).toBe(true) + expect(menu.exists()).toBe(true) }) it('renders the main content', () => { diff --git a/frontend/src/views/__tests__/ContactView.spec.ts b/frontend/src/views/__tests__/ContactView.spec.ts index c5fae054..062feaf6 100644 --- a/frontend/src/views/__tests__/ContactView.spec.ts +++ b/frontend/src/views/__tests__/ContactView.spec.ts @@ -1,4 +1,5 @@ import { describe, expect, it } from 'vitest' +import { VMenu } from 'vuetify/components' import { setupMountedComponents } from '@/lib/test-utils' @@ -18,11 +19,9 @@ describe.concurrent('ContactView', async () => { ) const logo = wrapper.find('#logo') - const aboutLink = wrapper.find('#about') - const contactLink = wrapper.find('#contact') + const menu = wrapper.findComponent(VMenu) expect(logo.exists()).toBe(true) - expect(aboutLink.exists()).toBe(true) - expect(contactLink.exists()).toBe(true) + expect(menu.exists()).toBe(true) }) it('renders the main content', () => { diff --git a/frontend/src/views/__tests__/GeneDetailView.spec.ts b/frontend/src/views/__tests__/GeneDetailView.spec.ts index 56c1a901..3bb92d05 100644 --- a/frontend/src/views/__tests__/GeneDetailView.spec.ts +++ b/frontend/src/views/__tests__/GeneDetailView.spec.ts @@ -1,6 +1,7 @@ import { createTestingPinia } from '@pinia/testing' import { describe, expect, it, vi } from 'vitest' import { nextTick } from 'vue' +import { VMenu } from 'vuetify/components' import * as BRCA1geneInfo from '@/assets/__tests__/BRCA1GeneInfo.json' import HeaderDetailPage from '@/components/HeaderDetailPage.vue' @@ -55,11 +56,9 @@ describe.concurrent('GeneDetailView', async () => { expect(searchBar.exists()).toBe(true) const logo = wrapper.find('#logo') - const aboutLink = wrapper.find('#about') - const contactLink = wrapper.find('#contact') + const menu = wrapper.findComponent(VMenu) expect(logo.exists()).toBe(true) - expect(aboutLink.exists()).toBe(true) - expect(contactLink.exists()).toBe(true) + expect(menu.exists()).toBe(true) const launchImage = wrapper.findAll('.mdi-launch') expect(launchImage.length).toBe(14) @@ -74,11 +73,9 @@ describe.concurrent('GeneDetailView', async () => { expect(searchBar.exists()).toBe(true) const logo = wrapper.find('#logo') - const aboutLink = wrapper.find('#about') - const contactLink = wrapper.find('#contact') + const menu = wrapper.findComponent(VMenu) expect(logo.exists()).toBe(true) - expect(aboutLink.exists()).toBe(true) - expect(contactLink.exists()).toBe(true) + expect(menu.exists()).toBe(true) }) it('renders info-cards and navigation drawer', () => { diff --git a/frontend/src/views/__tests__/GenesListView.spec.ts b/frontend/src/views/__tests__/GenesListView.spec.ts index ffcead50..d7a3f21d 100644 --- a/frontend/src/views/__tests__/GenesListView.spec.ts +++ b/frontend/src/views/__tests__/GenesListView.spec.ts @@ -1,6 +1,7 @@ import { createTestingPinia } from '@pinia/testing' import { describe, expect, it, vi } from 'vitest' import { nextTick } from 'vue' +import { VMenu } from 'vuetify/components' import HeaderDetailPage from '@/components/HeaderDetailPage.vue' import SearchBar from '@/components/SearchBar.vue' @@ -68,11 +69,9 @@ describe.concurrent('GenesListView', async () => { expect(searchBar.exists()).toBe(true) const logo = wrapper.find('#logo') - const aboutLink = wrapper.find('#about') - const contactLink = wrapper.find('#contact') + const menu = wrapper.findComponent(VMenu) expect(logo.exists()).toBe(true) - expect(aboutLink.exists()).toBe(true) - expect(contactLink.exists()).toBe(true) + expect(menu.exists()).toBe(true) }) it('renders the search results', async () => { diff --git a/frontend/src/views/__tests__/HomeView.spec.ts b/frontend/src/views/__tests__/HomeView.spec.ts index 3b7f7fd0..d2f123e3 100644 --- a/frontend/src/views/__tests__/HomeView.spec.ts +++ b/frontend/src/views/__tests__/HomeView.spec.ts @@ -1,5 +1,6 @@ import { afterEach, describe, expect, it, vi } from 'vitest' import { nextTick } from 'vue' +import { VMenu } from 'vuetify/components' import { DottyClient } from '@/api/dotty' import FooterDefault from '@/components/FooterDefault.vue' @@ -50,11 +51,9 @@ describe.concurrent('HomeView with mocked router', async () => { expect(footer.exists()).toBe(true) const logo = wrapper.find('#logo') - const aboutLink = wrapper.find('#about') - const contactLink = wrapper.find('#contact') + const menu = wrapper.findComponent(VMenu) expect(logo.exists()).toBe(true) - expect(aboutLink.exists()).toBe(true) - expect(contactLink.exists()).toBe(true) + expect(menu.exists()).toBe(true) }) it('renders the search bar', () => { diff --git a/frontend/src/views/__tests__/VariantDetailView.spec.ts b/frontend/src/views/__tests__/VariantDetailView.spec.ts index 85d37937..eb99fa96 100644 --- a/frontend/src/views/__tests__/VariantDetailView.spec.ts +++ b/frontend/src/views/__tests__/VariantDetailView.spec.ts @@ -1,6 +1,7 @@ import { createTestingPinia } from '@pinia/testing' import { describe, expect, it, vi } from 'vitest' import { nextTick } from 'vue' +import { VMenu } from 'vuetify/components' import * as BRCA1ClinVar from '@/assets/__tests__/BRCA1ClinVar.json' import * as BRCA1GeneInfo from '@/assets/__tests__/BRCA1GeneInfo.json' @@ -105,11 +106,9 @@ describe('VariantDetailView', async () => { expect(searchBar.exists()).toBe(true) const logo = wrapper.find('#logo') - const aboutLink = wrapper.find('#about') - const contactLink = wrapper.find('#contact') + const menu = wrapper.findComponent(VMenu) expect(logo.exists()).toBe(true) - expect(aboutLink.exists()).toBe(true) - expect(contactLink.exists()).toBe(true) + expect(menu.exists()).toBe(true) }) it('emits update in header', async () => {