Merge pull request #45 from Lombiq/issue/OSOE-650

OSOE-650: Add UI test project in Lombiq.JsonEditor

Lombiq.JsonEditor.Test.UI/Extensions/TestCaseUITestContextExtensions.cs

@@ -0,0 +1,138 @@
+using Atata;
+using Lombiq.Tests.UI.Extensions;
+using Lombiq.Tests.UI.Services;
+using Newtonsoft.Json.Linq;
+using OpenQA.Selenium;
+using Shouldly;
+using System.Threading.Tasks;
+
+namespace Lombiq.JsonEditor.Tests.UI.Extensions;
+
+public static class TestCaseUITestContextExtensions
+{
+    private const string SampleContentItemId = "4xapn6ykttkk6wbbwgg1aaxqda";
+    private const string HelloValue = "hello";
+    private const string WorldValue = "world";
+    private const string TestField = "testField";
+    private const string TestValue = "testValue";
+
+    private static readonly By ObjectByXPath = By.XPath($"//div[@class='jsoneditor-readonly' and contains(text(),'object')]");
+    private static readonly By ObjectCountByXPath = By.XPath($"//div[@class='jsoneditor-value jsoneditor-object' and contains(text(),'{{2}}')]");
+    private static readonly By ArrayByXPath = By.XPath($"//div[@class='jsoneditor-field' and contains(text(),'printThese')]");
+    private static readonly By ArrayCountByXPath = By.XPath($"//div[@class='jsoneditor-value jsoneditor-array' and contains(text(),'[2]')]");
+    private static readonly By FieldByXPath = By.XPath($"//div[@class='jsoneditor-field' and contains(text(), '{TestField}')]");
+
+    public static async Task TestJsonEditorBehaviorAsync(this UITestContext context)
+    {
+        await context.EnableJsonEditorFeatureAsync();
+
+        await context.ExecuteJsonEditorSampleRecipeDirectlyAsync();
+
+        // Checking if the sample item is displayed correctly.
+        await context.GoToContentItemByIdAsync(SampleContentItemId);
+
+        context.Exists(By.XPath($"//div[contains(text(),'These are coming from the JSON field:')]"));
+        context.Exists(By.XPath($"//li[contains(text(),'{HelloValue}')]"));
+        context.Exists(By.XPath($"//li[contains(text(),'{WorldValue}')]"));
+
+        await context.SignInDirectlyAsync();
+        await context.GoToContentItemEditorByIdAsync(SampleContentItemId);
+
+        // Testing if input is saved.
+        await context.ClickReliablyOnAsync(
+            By.XPath($"//tr[contains(@class,'jsoneditor-expandable jsoneditor-collapsed')]" +
+                "/td/button[@class='jsoneditor-button jsoneditor-contextmenu-button']"));
+
+        await context.ClickReliablyOnAsync(By.XPath($"//div[contains(text(),'Append')]"));
+
+        context.Get(By.XPath($"//div[@class='jsoneditor-field jsoneditor-empty']")).FillInWith(TestField);
+        context.Get(By.XPath($"//div[@class='jsoneditor-value jsoneditor-string jsoneditor-empty']")).FillInWith(TestValue);
+        await context.ClickPublishAsync();
+
+        // Checking if the sample item is displayed correctly in all tree style mode.
+        await context.TestTreeStyleModeAsync();
+
+        await context.SwitchToModeAsync("View");
+        await context.TestTreeStyleModeAsync();
+
+        await context.SwitchToModeAsync("Form");
+        await context.TestTreeStyleModeAsync();
+
+        // Checking if the sample item is displayed correctly in all code style mode.
+        await context.SwitchToModeAsync("Code");
+        context.TestCodeStyleMode();
+
+        await context.SwitchToModeAsync("Text");
+        context.TestCodeStyleMode();
+
+        await context.SwitchToModeAsync("Preview");
+        context.TestCodeStyleMode();
+    }
+
+    private static void CheckValueInTreeMode(this UITestContext context, string arrayValue, bool exists = true)
+    {
+        var arrayValueByXPath =
+            By.XPath($"//div[@class='jsoneditor-value jsoneditor-string' and contains(text(),'{arrayValue}')]");
+
+        context.CheckExistence(arrayValueByXPath, exists);
+    }
+
+    private static Task ClickOnExpandAllAsync(this UITestContext context) =>
+        context.ClickReliablyOnAsync(By.XPath($"//button[@class='jsoneditor-expand-all']"));
+
+    private static Task ClickOnCollapseAllAsync(this UITestContext context) =>
+        context.ClickReliablyOnAsync(By.XPath($"//button[@class='jsoneditor-collapse-all']"));
+
+    private static async Task SwitchToModeAsync(this UITestContext context, string editorName)
+    {
+        await context.ClickReliablyOnAsync(By.XPath($"//button[@class='jsoneditor-modes jsoneditor-separator']"));
+        await context.ClickReliablyOnAsync(By.XPath($"//div[@class='jsoneditor-text' and contains(text(),'{editorName}')]"));
+    }
+
+    private static async Task TestTreeStyleModeAsync(this UITestContext context)
+    {
+        await context.ClickOnExpandAllAsync();
+
+        // Checking object {1}.
+        context.Exists(ObjectByXPath);
+        context.Exists(ObjectCountByXPath);
+
+        // Checking printThese [2].
+        context.Exists(ArrayByXPath);
+        context.Exists(ArrayCountByXPath);
+
+        context.Exists(FieldByXPath);
+
+        // Checking "hello" and "word" and "testValue".
+        context.CheckValueInTreeMode(HelloValue);
+        context.CheckValueInTreeMode(WorldValue);
+        context.CheckValueInTreeMode(TestValue);
+
+        // Collapse button should hide things.
+        await context.ClickOnCollapseAllAsync();
+
+        context.Exists(ObjectByXPath);
+        context.Exists(ObjectCountByXPath);
+
+        context.Missing(ArrayByXPath);
+        context.Missing(ArrayCountByXPath);
+
+        context.Missing(FieldByXPath);
+
+        context.CheckValueInTreeMode(HelloValue, exists: false);
+        context.CheckValueInTreeMode(WorldValue, exists: false);
+        context.CheckValueInTreeMode(TestValue, exists: false);
+    }
+
+    private static void TestCodeStyleMode(this UITestContext context)
+    {
+        // This field is hidden, but its content reflects what's in the editor.
+        var editorContent = JObject
+            .Parse(context.Get(By.XPath($"//input[@class='jsonEditor__input']").OfAnyVisibility())
+            .GetValue());
+
+        ((string)editorContent["printThese"][0]).ShouldBe(HelloValue);
+        ((string)editorContent["printThese"][1]).ShouldBe(WorldValue);
+        ((string)editorContent[TestField]).ShouldBe(TestValue);
+    }
+}

Lombiq.JsonEditor.Test.UI/Extensions/UITestContextExtensions.cs

@@ -0,0 +1,14 @@
+using Lombiq.Tests.UI.Extensions;
+using Lombiq.Tests.UI.Services;
+using System.Threading.Tasks;
+
+namespace Lombiq.JsonEditor.Tests.UI.Extensions;
+
+public static class UITestContextExtensions
+{
+    public static Task ExecuteJsonEditorSampleRecipeDirectlyAsync(this UITestContext context) =>
+        context.ExecuteRecipeDirectlyAsync("Lombiq.JsonEditor.Sample");
+
+    public static Task EnableJsonEditorFeatureAsync(this UITestContext context) =>
+        context.EnableFeatureDirectlyAsync("Lombiq.JsonEditor");
+}

Lombiq.JsonEditor.Test.UI/License.md

@@ -0,0 +1,13 @@
+Copyright © 2021, [Lombiq Technologies Ltd.](https://lombiq.com)
+
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:
+
+- Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.
+
+- Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.
+
+- Neither the name of the copyright holder nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

Lombiq.JsonEditor.Test.UI/Lombiq.JsonEditor.Tests.UI.csproj

@@ -0,0 +1,33 @@
+<Project Sdk="Microsoft.NET.Sdk">
+
+  <PropertyGroup>
+    <TargetFramework>net6.0</TargetFramework>
+  </PropertyGroup>
+
+  <PropertyGroup>
+    <Title>Lombiq JSON Editor for Orchard Core - UI Test Extensions</Title>
+    <Authors>Lombiq Technologies</Authors>
+    <Copyright>Copyright © 2021, Lombiq Technologies Ltd.</Copyright>
+    <Description>Lombiq JSON Editor for Orchard Core - UI Test Extensions: Extensions to aid in UI testing Lombiq JSON Editor for Orchard Core.</Description>
+    <PackageIcon>NuGetIcon.png</PackageIcon>
+    <PackageTags>OrchardCore;Lombiq;AspNetCore;JSONEditor</PackageTags>
+    <RepositoryUrl>https://github.com/Lombiq/Orchard-JSON-Editor</RepositoryUrl>
+    <PackageProjectUrl>https://github.com/Lombiq/Orchard-JSON-Editor/tree/dev/Lombiq.JSONEditor.Tests.UI</PackageProjectUrl>
+    <PackageLicenseFile>License.md</PackageLicenseFile>
+  </PropertyGroup>
+
+  <ItemGroup Condition="'$(NuGetBuild)' != 'true'">
+    <ProjectReference Include="..\..\..\..\test\Lombiq.UITestingToolbox\Lombiq.Tests.UI\Lombiq.Tests.UI.csproj" />
+  </ItemGroup>
+
+  <ItemGroup Condition="'$(NuGetBuild)' == 'true'">
+    <PackageReference Include="Lombiq.Tests.UI" Version="7.1.0" />
+  </ItemGroup>
+
+  <ItemGroup>
+    <None Include="License.md" Pack="true" PackagePath="" />
+    <None Include="NuGetIcon.png" Pack="true" PackagePath="" />
+    <None Include="Readme.md" />
+  </ItemGroup>
+
+</Project>

Lombiq.JsonEditor.Test.UI/Readme.md

@@ -0,0 +1,7 @@
+# Lombiq JSON Editor for Orchard Core - UI Test Extensions
+
+## About
+
+Extension methods that test various features in Lombiq JSON Editor for Orchard Core, with the help of [Lombiq UI Testing Toolbox for Orchard Core](https://github.com/Lombiq/UI-Testing-Toolbox).
+
+Call these from a UI test project to verify the module's basic features; as seen in [Open-Source Orchard Core Extensions](https://github.com/Lombiq/Open-Source-Orchard-Core-Extensions).

Lombiq.JsonEditor.sln

@@ -0,0 +1,31 @@
+
+Microsoft Visual Studio Solution File, Format Version 12.00
+# Visual Studio Version 17
+VisualStudioVersion = 17.6.33815.320
+MinimumVisualStudioVersion = 10.0.40219.1
+Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Lombiq.JsonEditor", "Lombiq.JsonEditor\Lombiq.JsonEditor.csproj", "{3EA5BC81-97A5-4513-9CAC-4DB01B439682}"
+EndProject
+Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Lombiq.JsonEditor.Tests.UI", "Lombiq.JsonEditor.Test.UI\Lombiq.JsonEditor.Tests.UI.csproj", "{19F9AEDF-9D1A-44EC-BAEA-FF050CF7A684}"
+EndProject
+Global
+	GlobalSection(SolutionConfigurationPlatforms) = preSolution
+		Debug|Any CPU = Debug|Any CPU
+		Release|Any CPU = Release|Any CPU
+	EndGlobalSection
+	GlobalSection(ProjectConfigurationPlatforms) = postSolution
+		{3EA5BC81-97A5-4513-9CAC-4DB01B439682}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
+		{3EA5BC81-97A5-4513-9CAC-4DB01B439682}.Debug|Any CPU.Build.0 = Debug|Any CPU
+		{3EA5BC81-97A5-4513-9CAC-4DB01B439682}.Release|Any CPU.ActiveCfg = Release|Any CPU
+		{3EA5BC81-97A5-4513-9CAC-4DB01B439682}.Release|Any CPU.Build.0 = Release|Any CPU
+		{19F9AEDF-9D1A-44EC-BAEA-FF050CF7A684}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
+		{19F9AEDF-9D1A-44EC-BAEA-FF050CF7A684}.Debug|Any CPU.Build.0 = Debug|Any CPU
+		{19F9AEDF-9D1A-44EC-BAEA-FF050CF7A684}.Release|Any CPU.ActiveCfg = Release|Any CPU
+		{19F9AEDF-9D1A-44EC-BAEA-FF050CF7A684}.Release|Any CPU.Build.0 = Release|Any CPU
+	EndGlobalSection
+	GlobalSection(SolutionProperties) = preSolution
+		HideSolutionNode = FALSE
+	EndGlobalSection
+	GlobalSection(ExtensibilityGlobals) = postSolution
+		SolutionGuid = {67F3FCAA-D525-42C7-9743-B8D896F485BA}
+	EndGlobalSection
+EndGlobal

Lombiq.JsonEditor/License.md

@@ -0,0 +1,13 @@
+Copyright © 2021, [Lombiq Technologies Ltd.](https://lombiq.com)
+
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:
+
+- Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.
+
+- Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.
+
+- Neither the name of the copyright holder nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

Lombiq.JsonEditor.csproj → Lombiq.JsonEditor/Lombiq.JsonEditor.csproj

@@ -1,6 +1,6 @@
 <Project Sdk="Microsoft.NET.Sdk.Razor">
 
-  <Import Condition="'$(NuGetBuild)' != 'true'" Project="..\..\Utilities\Lombiq.NodeJs.Extensions\Lombiq.NodeJs.Extensions\Lombiq.NodeJs.Extensions.props" />
+  <Import Condition="'$(NuGetBuild)' != 'true'" Project="..\..\..\Utilities\Lombiq.NodeJs.Extensions\Lombiq.NodeJs.Extensions\Lombiq.NodeJs.Extensions.props" />
 
   <PropertyGroup>
     <TargetFramework>net6.0</TargetFramework>
@@ -22,7 +22,6 @@
 
   <ItemGroup>
     <None Include="License.md" Pack="true" PackagePath="" />
-    <None Include="Readme.md" />
     <None Include="NuGetIcon.png" Pack="true" PackagePath="" />
   </ItemGroup>
 
@@ -44,15 +43,15 @@
   </ItemGroup>
 
   <ItemGroup Condition="'$(NuGetBuild)' != 'true'">
-    <ProjectReference Include="..\..\Libraries\Lombiq.HelpfulLibraries\Lombiq.HelpfulLibraries.OrchardCore\Lombiq.HelpfulLibraries.OrchardCore.csproj" />
-    <ProjectReference Include="..\..\Utilities\Lombiq.NodeJs.Extensions\Lombiq.NodeJs.Extensions\Lombiq.NodeJs.Extensions.csproj" />
+    <ProjectReference Include="..\..\..\Libraries\Lombiq.HelpfulLibraries\Lombiq.HelpfulLibraries.OrchardCore\Lombiq.HelpfulLibraries.OrchardCore.csproj" />
+    <ProjectReference Include="..\..\..\Utilities\Lombiq.NodeJs.Extensions\Lombiq.NodeJs.Extensions\Lombiq.NodeJs.Extensions.csproj" />
   </ItemGroup>
 
   <ItemGroup Condition="'$(NuGetBuild)' == 'true'">
     <PackageReference Include="Lombiq.HelpfulLibraries.OrchardCore" Version="7.0.0" />
     <PackageReference Include="Lombiq.NodeJs.Extensions" Version="1.2.4" />
   </ItemGroup>
 
-  <Import Condition="'$(NuGetBuild)' != 'true'" Project="..\..\Utilities\Lombiq.NodeJs.Extensions\Lombiq.NodeJs.Extensions\Lombiq.NodeJs.Extensions.targets" />
+  <Import Condition="'$(NuGetBuild)' != 'true'" Project="..\..\..\Utilities\Lombiq.NodeJs.Extensions\Lombiq.NodeJs.Extensions\Lombiq.NodeJs.Extensions.targets" />
 
 </Project>

package.json → Lombiq.JsonEditor/package.json

@@ -15,6 +15,10 @@
         "sources": [ "node_modules/jsoneditor/dist" ],
         "target": "wwwroot/vendors/jsoneditor"
       }
-    ]
+    ],
+    "styles": {
+      "source": "Assets/Styles",
+      "target": "wwwroot/css"
+    }
   }
 }

Readme.md

@@ -1,6 +1,6 @@
 # Lombiq JSON Editor for Orchard Core
 
-[![Lombiq.JsonEditor NuGet](https://img.shields.io/nuget/v/Lombiq.JsonEditor?label=Lombiq.JsonEditor)](https://www.nuget.org/packages/Lombiq.JsonEditor/)
+[![Lombiq.JsonEditor NuGet](https://img.shields.io/nuget/v/Lombiq.JsonEditor?label=Lombiq.JsonEditor)](https://www.nuget.org/packages/Lombiq.JsonEditor/) [![Lombiq.JsonEditor.Tests.UI NuGet](https://img.shields.io/nuget/v/Lombiq.JsonEditor.Tests.UI?label=Lombiq.JsonEditor.Tests.UI)](https://www.nuget.org/packages/Lombiq.JsonEditor.Tests.UI/)
 
 ## About