From d47de99c189c53da48620dbe65843fe251720940 Mon Sep 17 00:00:00 2001
From: Moshe <shootermv@gmail.com>
Date: Thu, 9 Nov 2023 18:44:49 +0200
Subject: [PATCH] test(e2e): improve tests for about page (#189)

---
 src/pages/About.tsx |  9 ++-------
 tests/about.spec.ts | 25 ++++++++++++++++++-------
 2 files changed, 20 insertions(+), 14 deletions(-)

diff --git a/src/pages/About.tsx b/src/pages/About.tsx
index 3cf36b25..8b79b4c4 100644
--- a/src/pages/About.tsx
+++ b/src/pages/About.tsx
@@ -4,12 +4,9 @@ import SlackIcon from '../resources/slack-icon.svg'
 import { useTranslation } from 'react-i18next'
 
 const About = () => {
-  const { t } = useTranslation()
-
   return (
     <AboutStyle>
       <div className="about-center-container">
-        <h1>{t(TEXT_KEYS.website_name)}</h1>
         <WhatIsWebsite />
         <DiscoveredMistake />
         <Privacy />
@@ -132,10 +129,8 @@ const Funding = () => {
 
 const AboutStyle = styled.div`
   display: flex;
-  justify-content: center;
-  align-items: center;
-  height: 100%;
-
+  flex-direction: column;
+  padding: 1rem;
   & .about-center-container {
     width: 100%;
     max-width: 770px;
diff --git a/tests/about.spec.ts b/tests/about.spec.ts
index c8f647d0..e0585ce2 100644
--- a/tests/about.spec.ts
+++ b/tests/about.spec.ts
@@ -1,8 +1,19 @@
-import { test } from './utils'
-
-test('about page', async ({ page }) => {
-  await page.goto('/')
-  await page.getByText('אודות').click()
-  await page.getByRole('link', { name: 'תרומות קטנות נוספות' }).click()
-  await page.getByRole('heading', { name: 'הסדנא לידע ציבורי פותחת ומנגישה מידע' }).waitFor()
+import { test, expect } from '@playwright/test'
+test.describe('About Page Tests', () => {
+  test('can access about page by clicking `about` menu', async ({ page }) => {
+    await page.goto('/')
+    await page.getByText('אודות').click()
+    await expect(page).toHaveURL('http://localhost:3000/about')
+    const locator = await page.getByText('אודות')
+    await expect(locator).toHaveClass('menu-item active')
+  })
+  test('page display title `מהו אתר “דאטאבוס”?`', async ({ page }) => {
+    await page.goto('/about')
+    await expect(page.getByRole('heading', { name: 'מהו אתר “דאטאבוס”?' })).toBeVisible()
+  })
+  test('clicking dontaions link should lead to sadna site', async ({ page }) => {
+    await page.goto('/about')
+    await page.getByRole('link', { name: 'תרומות קטנות נוספות' }).click()
+    await page.getByRole('heading', { name: 'הסדנא לידע ציבורי פותחת ומנגישה מידע' }).waitFor()
+  })
 })