From 805d1d8dc16ce3fff596fe285375d8edc4b86d65 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Zolt=C3=A1n=20Leh=C3=B3czky?= <zoltan.lehoczky@lombiq.com>
Date: Fri, 9 Feb 2024 03:05:47 +0100
Subject: [PATCH] Test up to adding the menu item

---
 .../TestCaseUITestContextExtensions.cs        | 19 ++++++++++++++-----
 .../Assets/Scripts/walkthroughs.js            | 10 ++++++----
 2 files changed, 20 insertions(+), 9 deletions(-)

diff --git a/Lombiq.Walkthroughs.Test.UI/Extensions/TestCaseUITestContextExtensions.cs b/Lombiq.Walkthroughs.Test.UI/Extensions/TestCaseUITestContextExtensions.cs
index 0b93f77..7db9047 100644
--- a/Lombiq.Walkthroughs.Test.UI/Extensions/TestCaseUITestContextExtensions.cs
+++ b/Lombiq.Walkthroughs.Test.UI/Extensions/TestCaseUITestContextExtensions.cs
@@ -134,12 +134,21 @@ await context.FillInCodeMirrorEditorWithRetriesAsync(
         await context.ClickReliablyOnByLinkTextAsync("ABOUT");
         await AssertStepAndClickNextAsync("Managing the menu", "As you can see, you can easily access");
         AssertStep("Managing the menu", "Click on the \"Main Menu\" link.");
-        return;
         await context.ClickReliablyOnByLinkTextAsync("Main Menu");
-        await AssertStepAndClickNextAsync("Managing the menu", "");
-        await AssertStepAndClickNextAsync("Managing the menu", "");
-        await AssertStepAndClickNextAsync("Managing the menu", "");
-        await AssertStepAndClickNextAsync("Managing the menu", "");
+        await AssertStepAndClickNextAsync("Managing the menu", "Here you can see the menu's editor");
+        AssertStep("Managing the menu", "Let's add a menu item for the new article we created!");
+        await context.ClickReliablyOnAsync(By.XPath("//button[normalize-space() = 'Add Menu Item']"));
+        // The overlay on the overlay of the menu item type selector is strange, including that its text can't be
+        // highlighted in the browser. Its buttons can't be clicked with ClickReliablyAsync() so we need to do this.
+        AssertStep("Managing the menu", "You can choose between multiple types of menu items.");
+        var originalUri = context.GetCurrentUri();
+        context.Get(By.XPath($"//button[contains(@class, 'shepherd-button-primary') and not(@id)]")).Click();
+        context.DoWithRetriesOrFail(() => context.GetCurrentUri() != originalUri);
+        AssertStep("Managing the menu", "For now, let's go with the Link Menu Item one.");
+
+        // Adding a menu item
+        await context.ClickReliablyOnByLinkTextAsync("Add");
+        return;
         await AssertStepAndClickNextAsync("Managing the menu", "");
         await AssertStepAndClickNextAsync("Managing the menu", "");
         await AssertStepAndClickNextAsync("Managing the menu", "");
diff --git a/Lombiq.Walkthroughs/Assets/Scripts/walkthroughs.js b/Lombiq.Walkthroughs/Assets/Scripts/walkthroughs.js
index 5d63ea6..d8a044c 100644
--- a/Lombiq.Walkthroughs/Assets/Scripts/walkthroughs.js
+++ b/Lombiq.Walkthroughs/Assets/Scripts/walkthroughs.js
@@ -1118,7 +1118,7 @@ jQuery(($) => {
                     },
                     {
                         title: 'Managing the menu',
-                        text: 'Here you can see all the menu items.',
+                        text: 'Here you can see the menu\'s editor, including all the menu items.',
                         attachTo: { element: '.edit-body', on: 'top' },
                         canClickTarget: false,
                         buttons: [
@@ -1135,7 +1135,7 @@ jQuery(($) => {
                     },
                     {
                         title: 'Managing the menu',
-                        text: 'Let\'s add the new article that we created! Click on the <em>"Add Menu Item"</em> button.',
+                        text: 'Let\'s add a menu item for the new article we created! Click on the <em>"Add Menu Item"</em> button.',
                         attachTo: { element: 'button[data-bs-target="#modalMenuItems"]', on: 'top' },
                         buttons: [
                             backButton,
@@ -1145,7 +1145,7 @@ jQuery(($) => {
                     },
                     {
                         title: 'Managing the menu',
-                        text: 'You can choose between multiple menu items. Read the description too see how they ' +
+                        text: 'You can choose between multiple types of menu items. Read the descriptions too see how they ' +
                             'are different.',
                         attachTo: { element: '.modal-body', on: 'top' },
                         canClickTarget: false,
@@ -1176,7 +1176,9 @@ jQuery(($) => {
                     },
                     {
                         title: 'Managing the menu',
-                        text: 'For now let\'s go with the Link Menu Item one. Click on the <em>"Add"</em> button.',
+                        text: '<p>For now, let\'s go with the Link Menu Item one. This can be used to easily add menu ' +
+                            'items for content items.</p>' +
+                            '<p>Click on the <em>"Add"</em> button.</p>',
                         attachTo: { element: 'a[href*="Create/LinkMenuItem"]', on: 'bottom' },
                         buttons: [
                             backButton,