From 44a38d2601a989f857c9f80a3b10740276446849 Mon Sep 17 00:00:00 2001
From: Maud Leray <maudleray035@gmail.com>
Date: Thu, 27 Jul 2023 11:04:15 +0200
Subject: [PATCH] PLANET-6646 Write an e2e test for the navigation bar

This is to increase our test coverage
---
 package-lock.json                | 16 ++++++------
 package.json                     |  2 +-
 tests/e2e/navigation-bar.spec.js | 42 ++++++++++++++++++++++++++++++++
 3 files changed, 51 insertions(+), 9 deletions(-)
 create mode 100644 tests/e2e/navigation-bar.spec.js

diff --git a/package-lock.json b/package-lock.json
index 6b293d151c..d90588cecb 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -15,7 +15,7 @@
       "devDependencies": {
         "@commitlint/cli": "^12.1.1",
         "@greenpeace/dashdash": "^1.2.1",
-        "@playwright/test": "^1.35.1",
+        "@playwright/test": "^1.36.2",
         "@wordpress/components": "^8.5.0",
         "@wordpress/e2e-test-utils-playwright": "^0.5.0",
         "@wordpress/eslint-plugin": "^2.3.0",
@@ -2752,13 +2752,13 @@
       }
     },
     "node_modules/@playwright/test": {
-      "version": "1.35.1",
-      "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.35.1.tgz",
-      "integrity": "sha512-b5YoFe6J9exsMYg0pQAobNDR85T1nLumUYgUTtKm4d21iX2L7WqKq9dW8NGJ+2vX0etZd+Y7UeuqsxDXm9+5ZA==",
+      "version": "1.36.2",
+      "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.36.2.tgz",
+      "integrity": "sha512-2rVZeyPRjxfPH6J0oGJqE8YxiM1IBRyM8hyrXYK7eSiAqmbNhxwcLa7dZ7fy9Kj26V7FYia5fh9XJRq4Dqme+g==",
       "dev": true,
       "dependencies": {
         "@types/node": "*",
-        "playwright-core": "1.35.1"
+        "playwright-core": "1.36.2"
       },
       "bin": {
         "playwright": "cli.js"
@@ -17762,9 +17762,9 @@
       }
     },
     "node_modules/playwright-core": {
-      "version": "1.35.1",
-      "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.35.1.tgz",
-      "integrity": "sha512-pNXb6CQ7OqmGDRspEjlxE49w+4YtR6a3X6mT1hZXeJHWmsEz7SunmvZeiG/+y1yyMZdHnnn73WKYdtV1er0Xyg==",
+      "version": "1.36.2",
+      "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.36.2.tgz",
+      "integrity": "sha512-sQYZt31dwkqxOrP7xy2ggDfEzUxM1lodjhsQ3NMMv5uGTRDsLxU0e4xf4wwMkF2gplIxf17QMBCodSFgm6bFVQ==",
       "dev": true,
       "bin": {
         "playwright-core": "cli.js"
diff --git a/package.json b/package.json
index a7cee678b3..8f3159d539 100644
--- a/package.json
+++ b/package.json
@@ -12,7 +12,7 @@
   "devDependencies": {
     "@commitlint/cli": "^12.1.1",
     "@greenpeace/dashdash": "^1.2.1",
-    "@playwright/test": "^1.35.1",
+    "@playwright/test": "^1.36.2",
     "@wordpress/components": "^8.5.0",
     "@wordpress/e2e-test-utils-playwright": "^0.5.0",
     "@wordpress/eslint-plugin": "^2.3.0",
diff --git a/tests/e2e/navigation-bar.spec.js b/tests/e2e/navigation-bar.spec.js
new file mode 100644
index 0000000000..a965c78f1d
--- /dev/null
+++ b/tests/e2e/navigation-bar.spec.js
@@ -0,0 +1,42 @@
+import {test, expect} from './tools/lib/test-utils.js';
+
+test.useAdminLoggedIn();
+
+test('Test navigation bar menu', async ({page, admin, requestUtils}) => {
+  const testId = Math.floor(Math.random() * 10000); // NOSONAR
+  const testPageTitle = `Navbar test ${testId}`;
+
+  // Create a new page
+  await requestUtils.createPage({
+    title: testPageTitle,
+    content: `
+      <!-- wp:paragraph -->
+        <p>The new page for the navigation bar test</p>
+      <!-- /wp:paragraph -->
+    `,
+    status: 'publish',
+  });
+
+  // Go to Appearance > Menus
+  await admin.visitAdminPage('nav-menus.php');
+
+  // Select the Navigation bar menu
+  await page.waitForSelector('#select-menu-to-edit');
+  await page.selectOption('#select-menu-to-edit', {label: 'Navigation Bar Menu (Navigation Bar Menu)'});
+  await page.getByText('Select', {exact: true}).click();
+
+  // Add the newly created page to the menu
+  const pageOptions = page.locator('#add-post-type-page');
+  await pageOptions.getByRole('checkbox', {name: testPageTitle}).first().check();
+  await pageOptions.getByRole('button', {name: 'Add to Menu'}).click();
+  const newMenuItem = page.locator('.menu-item-depth-0', {hasText: testPageTitle});
+  await expect(newMenuItem).toBeVisible();
+  const newMenuItemLink = await newMenuItem.locator('.link-to-original a').getAttribute('href');
+  await page.getByRole('button', {name: 'Save Menu'}).click();
+  await expect(page.locator('.updated.notice')).toBeVisible();
+
+  // Check in the frontend that the new menu item is correctly added
+  await page.goto('./');
+  await expect(page.getByRole('link', {name: testPageTitle})).toBeVisible();
+  await expect(page.getByRole('link', {name: testPageTitle})).toHaveAttribute('href', newMenuItemLink);
+});