update page locators format

Author: devKiratu

e2e/hero-header.spec.ts

@@ -8,19 +8,19 @@ test.describe('Test Hero Header Navigation Links', () => {
   test('About us link should navigate to about us section', async ({
     page,
   }) => {
-    await page.locator('li:has-text("About us")').click();
+    await page.getByRole('link', { name: 'About us' }).click();
     await expect(page).toHaveURL('/#about-us');
   });
 
   test('Events link should navigate to Events section', async ({ page }) => {
-    await page.locator('li:has-text("Events")').click();
+    await page.getByRole('link', { name: 'Events' }).click();
     await expect(page).toHaveURL('/#events');
   });
 
   test('Contact link should navigate to Contact Us section', async ({
     page,
   }) => {
-    await page.locator('li:has-text("Contact")').click();
+    await page.getByRole('link', { name: 'Contact' }).click();
     await expect(page).toHaveURL('/#contact-us');
   });
 
@@ -31,7 +31,7 @@ test.describe('Test Hero Header Navigation Links', () => {
     const [newPage] = await Promise.all([
       context.waitForEvent('page'),
       page.waitForLoadState(),
-      page.locator('text=Join Community').click(),
+      page.getByRole('link', { name: 'Join Community' }).click(),
     ]);
     await expect(newPage).toHaveURL(
       new RegExp(
@@ -47,7 +47,7 @@ test.describe('Test Hero Header Navigation Links', () => {
     const [newPage] = await Promise.all([
       context.waitForEvent('page'),
       page.waitForLoadState(),
-      page.locator('text=Join ReactDevsKe').click(),
+      page.getByRole('link', { name: 'Join ReactDevsKe' }).click(),
     ]);
     await expect(newPage).toHaveURL(
       new RegExp(