Add tests for settings view

ajuvonen · Sep 19, 2024 · 087c541 · 087c541
1 parent 9216d8a
commit 087c541
Show file tree

Hide file tree

Showing 6 changed files with 74 additions and 33 deletions.
diff --git a/e2e/log.spec.ts b/e2e/log.spec.ts
@@ -41,7 +41,7 @@ test('filters veggies in Finnish', async ({page}) => {
   await expect(page.getByTestId('veggie-search-option-cherry tomato')).toBeVisible();
 });
 
-test.only('weekly challenges work', async ({page}) => {
+test('weekly challenges work', async ({page}) => {
   await page.goto('/');
   await page.getByTestId('home-start-button').click();
   await page.getByTestId('veggie-search-button').click();

diff --git a/e2e/settings.spec.ts b/e2e/settings.spec.ts
@@ -0,0 +1,40 @@
+import {test, expect} from '@playwright/test';
+
+test('locale settings work', async ({page}) => {
+  await page.goto('/');
+  await page.getByTestId('home-start-button').click();
+  await page.getByTestId('navbar-settings-link').click();
+  await expect(page).toHaveURL('settings');
+  await page.getByTestId('locale-button-fi').click();
+  await expect(page.getByText('Tyhjennä')).toBeVisible();
+  await page.getByTestId('navbar-log-link').click();
+  await expect(page.getByTestId('veggie-search-input')).toHaveAttribute(
+    'placeholder',
+    'Etsi kasviksia',
+  );
+});
+
+test('reset works', async ({page}) => {
+  await page.goto('/');
+  await page.getByTestId('home-start-button').click();
+  await page.getByTestId('navbar-settings-link').click();
+  await page.getByTestId('locale-button-fi').click();
+  await page.getByTestId('reset-button').click();
+  await page.getByTestId('confirm-button').click();
+  await expect(page).toHaveURL('');
+  await expect(page.getByTestId('home-locale-button-fi')).toBeVisible();
+});
+
+test('q&a works', async ({page}) => {
+  await page.goto('/');
+  await page.getByTestId('home-start-button').click();
+  await page.getByTestId('navbar-settings-link').click();
+  await page.getByTestId('qa-button-appPurpose').click();
+  await page.getByTestId('qa-button-contact').click();
+  await expect(page.getByTestId('qa-panel-appPurpose')).toBeVisible();
+  await expect(page.getByTestId('qa-panel-contact')).toBeVisible();
+  await page.getByTestId('qa-button-appPurpose').click();
+  await page.getByTestId('qa-button-contact').click();
+  await expect(page.getByTestId('qa-panel-appPurpose')).toBeHidden();
+  await expect(page.getByTestId('qa-panel-contact')).toBeHidden();
+});
diff --git a/src/components/LocaleChanger.vue b/src/components/LocaleChanger.vue
@@ -13,6 +13,7 @@ const {settings} = storeToRefs(useAppStateStore());
         v-for="locale in $i18n.availableLocales"
         :key="locale"
         :value="locale"
+        :data-test-id="`locale-button-${locale}`"
         v-slot="{checked}"
         class="locale-changer__option"
       >

diff --git a/src/components/QAComponent.vue b/src/components/QAComponent.vue
@@ -19,7 +19,7 @@ const keysWithLinks = ['contact', 'studyDetails'];
     <label class="label-like">{{ $t('qa.title') }}</label>
     <div class="flex-container flex-col has-scroll">
       <Disclosure v-for="key in questions" :key="key" v-slot="{open}">
-        <DisclosureButton class="QA__button">
+        <DisclosureButton class="QA__button" :data-test-id="`qa-button-${key}`">
           <span>{{ $t(`qa.${key}.title`) }}</span>
           <IconComponent :class="open ? 'rotate-180 transform' : ''" icon="chevron" />
         </DisclosureButton>
@@ -31,7 +31,7 @@ const keysWithLinks = ['contact', 'studyDetails'];
           leave-from-class="transform h-full opacity-100"
           leave-to-class="transform h-0 opacity-0"
         >
-          <DisclosurePanel class="QA__panel">
+          <DisclosurePanel class="QA__panel" :data-test-id="`qa-panel-${key}`">
             <i18n-t :keypath="`qa.${key}.text`" tag="div" scope="global">
               <a
                 v-if="keysWithLinks.includes(key)"