Tests: Fix header test on webkit

Author: lamATnginx

exampleSite/go.mod

@@ -2,6 +2,6 @@ module github.com/nginxinc/docs
 
 go 1.23
 
-require github.com/nginxinc/nginx-hugo-theme v0.41.27 // indirect
+require github.com/nginxinc/nginx-hugo-theme v1.0.4 // indirect
 
 replace github.com/nginxinc/nginx-hugo-theme => ../

tests/src/cards.spec.js

@@ -9,18 +9,18 @@ test.describe('Testing for cards shortcode', () => {
   });
 
   test('basic section', async ({ page }) => {
-    const section = await page.getByTestId('cards-test__basic');
-    const showAsCardCode = await section.getByTestId('card-section-content');
+    const section = page.getByTestId('cards-test__basic');
+    const showAsCardCode = section.getByTestId('card-section-content');
 
     expect(await showAsCardCode.count()).toBe(0);
   });
 
   test('featured section', async ({ page }) => {
-    const section = await page.getByTestId('cards-test__featuredSection');
-    const featuredSection = await section.getByTestId(
+    const section = page.getByTestId('cards-test__featuredSection');
+    const featuredSection = section.getByTestId(
       'card-section__featured-section'
     );
-    const cards = await (await featuredSection.getByTestId('card')).all();
+    const cards = await featuredSection.getByTestId('card').all();
 
     // Test featured section exists AND there are less than or equal to 3 cards.
     expect(await featuredSection.count()).toBeTruthy();

tests/src/header.spec.js

@@ -18,13 +18,13 @@ test.describe('Smoke test for header', () => {
   });
 
   test('header control works', async ({ page }) => {
-    const sidebarButtonClose = await page.getByTestId(
+    const sidebarButtonClose = page.getByTestId(
       'header__control--sidebar--close'
     );
-    const sidebarButtonOpen = await page.getByTestId(
+    const sidebarButtonOpen = page.getByTestId(
       'header__control--sidebar--open'
     );
-    const sidebar = await page.getByTestId('sidebar');
+    const sidebar = page.getByTestId('sidebar');
 
     // Close the sidebar
     await expect(sidebarButtonClose).toBeVisible();
@@ -44,9 +44,11 @@ test.describe('Smoke test for header', () => {
   });
 
   test('F5 Sites button works', async ({ page }) => {
-    const f5SitesButton = await page.getByTestId('header__f5sites_button');
-    await f5SitesButton.click();
-    const f5SitesContent = await page.getByTestId('header__f5sites_content');
-    await expect(f5SitesContent.count()).toBeTruthy();
+    const f5SitesButton = page.getByTestId('header__f5sites_button');
+    await expect(async () => {
+      await f5SitesButton.click();
+      const f5SitesContent = page.getByTestId('header__f5sites_content');
+      await expect(f5SitesContent).toBeVisible();
+    }).toPass();
   });
 });

tests/src/sidebar.spec.js

@@ -35,7 +35,7 @@ async function openPage(page, sidebarPage) {
 
   // Click on the page
   await sidebarPage.click();
-  const content = await page.getByTestId('content');
+  const content = page.getByTestId('content');
   await content.waitFor();
 }
 

tests/src/tabs.spec.js

@@ -9,21 +9,21 @@ test.describe('Testing for tabs shortcode', () => {
   });
 
   test('tabs render', async ({ page }) => {
-    const section = await page.getByTestId('tabs-test__basic');
-    const tabsContainer = await section.getByTestId('tabs-container');
-    const tabLabels = await tabsContainer.getByTestId('tab-labels');
-    const tabContents = await tabsContainer.getByTestId('tab-contents');
+    const section = page.getByTestId('tabs-test__basic');
+    const tabsContainer = section.getByTestId('tabs-container');
+    const tabLabels = tabsContainer.getByTestId('tab-labels');
+    const tabContents = tabsContainer.getByTestId('tab-contents');
 
     expect(await tabsContainer.count()).toBeTruthy();
     expect(await tabLabels.count()).toBeTruthy();
     expect(await tabContents.count()).toBeTruthy();
   });
 
   test('tabs shift content when clicked', async ({ page }) => {
-    const section = await page.getByTestId('tabs-test__basic');
-    const tabsContainer = await section.getByTestId('tabs-container');
-    const tabLabels = await tabsContainer.getByTestId('tab-labels');
-    const tabContents = await tabsContainer.getByTestId('tab-contents');
+    const section = page.getByTestId('tabs-test__basic');
+    const tabsContainer = section.getByTestId('tabs-container');
+    const tabLabels = tabsContainer.getByTestId('tab-labels');
+    const tabContents = tabsContainer.getByTestId('tab-contents');
 
     const tabsList = await tabLabels.locator('li').all();
     for (const tab of tabsList) {