Migrate Elevation UI Tests #1245

src/SamplesApp/SamplesApp.UITests/Toolkit/UnoSamples_Tests.Elevation.cs

@@ -0,0 +1,70 @@
+using System;
+using System.Collections.Generic;
+using System.Drawing;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using NUnit.Framework;
+using Uno.UITest.Helpers;
+using Uno.UITest.Helpers.Queries;
+using SamplesApp.UITests.TestFramework;
+
+namespace SamplesApp.UITests.Toolkit
+{
+
+	[TestFixture]
+	partial class UnoSamples_Tests : SampleControlUITestBase
+	{
+
+		[Test]
+		[ActivePlatforms(Platform.Android, Platform.iOS)]
+		public void Elevation_Validation()
+		{
+			Run("UITests.Shared.Toolkit.Elevation");
+
+			_app.WaitForElement(_app.Marked("TurnElevation_ON_Button"));
+
+			var turnElevation_ON_Button = _app.Marked("TurnElevation_ON_Button");
+
+			// Take ScreenShot with no elevation
+			var screenshot_NoElevation = _app.Screenshot("Elevation - No Elevation");
+
+			turnElevation_ON_Button.Tap();
+
+			// Take ScreenShot of with elevation
+			var screenshot_WithElevation = _app.Screenshot("Elevation - With Elevation");
+
+			Bitmap img1 = new Bitmap(screenshot_NoElevation.ToString());
+			Bitmap img2 = new Bitmap(screenshot_WithElevation.ToString());
+
+			float diffPercentage = 0;
+			float diff = 0;
+
+			if (img1.Size != img2.Size)
+			{
+				throw new Exception("Images are of different sizes");
+			}
+			else
+			{
+				for (int x = 0; x < img1.Width; x++)
+				{
+					for (int y = 0; y < img1.Height; y++)
+					{
+						Color img1P = img1.GetPixel(x, y);
+						Color img2P = img2.GetPixel(x, y);
+
+						diff += Math.Abs(img1P.R - img2P.R);
+						diff += Math.Abs(img1P.G - img2P.G);
+						diff += Math.Abs(img1P.B - img2P.B);
+					}
+				}
+
+				diffPercentage = 100 * (diff / 255) / (img1.Width * img1.Height * 3);
+				if (diffPercentage < 0.5)
+				{
+					Assert.Fail("Images are the same");
+				}
+			}
+		}
+	}
+}

src/SamplesApp/UITests.Shared/Toolkit/Elevation.xaml

@@ -13,11 +13,10 @@
 				<!-- Message -->
 				<TextBlock Text="Elevation is only supported on Android and iOS."
 						   HorizontalAlignment="Center"
-						   Margin="10"/>
+						   Margin="10" />
 
 				<!-- Dialog No Elevation -->
 				<Grid x:Name="MyDialog_NoElevation"
-					  Visibility="Collapsed"
 					  Background="White"
 					  Height="125"
 					  Width="300"
@@ -29,11 +28,11 @@
 					  Height="125"
 					  Width="300"
 					  toolkit:UIElementExtensions.Elevation="24"
+					  Visibility="Collapsed"
 					  Margin="10" />
 
 				<!-- Floating Action Button No Elevation -->
 				<Border x:Name="MyButton_NoElevation"
-						Visibility="Collapsed"
 						Background="Red"
 						Height="56"
 						Width="56"
@@ -45,13 +44,13 @@
 						Background="Red"
 						Height="56"
 						Width="56"
-						toolkit:UIElementExtensions.Elevation="16"
+						toolkit:UIElementExtensions.Elevation="6"
+						Visibility="Collapsed"
 						CornerRadius="28"
 						Margin="10" />
 
 				<!-- Complex Corner Radius Outline Test No Elevation -->
 				<Border x:Name="MyComplexRadius_NoElevation"
-						Visibility="Collapsed"
 						Background="Orange"
 						Height="56"
 						Width="56"
@@ -63,13 +62,13 @@
 						Background="Orange"
 						Height="56"
 						Width="56"
-						toolkit:UIElementExtensions.Elevation="16"
+						toolkit:UIElementExtensions.Elevation="6"
 						CornerRadius="4,8,12,16"
+						Visibility="Collapsed"
 						Margin="10" />
 
 				<!-- App Bar No Elevation -->
 				<CommandBar x:Name="MyAppBar_NoElevation"
-							Visibility="Collapsed"
 							Content="Title"
 							Background="RoyalBlue"
 							Foreground="White"
@@ -82,12 +81,12 @@
 							Background="RoyalBlue"
 							Foreground="White"
 							Width="200"
-							toolkit:UIElementExtensions.Elevation="10"
+							toolkit:UIElementExtensions.Elevation="4"
+							Visibility="Collapsed"
 							Margin="10" />
 
 				<!-- Card No Elevation -->
 				<Border x:Name="MyCard_NoElevation"
-						Visibility="Collapsed"
 						Background="White"
 						Height="100"
 						Width="75"
@@ -99,29 +98,30 @@
 						Height="100"
 						Width="75"
 						toolkit:UIElementExtensions.Elevation="2"
+						Visibility="Collapsed"
 						Margin="10" />
 			</StackPanel>
 		</ScrollViewer>
-		
+
 		<StackPanel VerticalAlignment="Bottom">
 
 			<!-- Label -->
 			<TextBlock Text="Elevation"
-					   Margin="5"/>
-			
+					   Margin="5" />
+
 			<!-- TurnElevation ON Button -->
 			<Button x:Name="TurnElevation_ON_Button"
 					Content="ON"
 					Click="TurnElevation_ON"
 					HorizontalAlignment="Left"
-					Margin="5"/>
+					Margin="5" />
 
 			<!-- TurnElevation OFF Button -->
 			<Button x:Name="TurnElevation_OFF_Button"
 					Content="OFF"
 					Click="TurnElevation_OFF"
 					HorizontalAlignment="Left"
-					Margin="5"/>
+					Margin="5" />
 		</StackPanel>
 	</Grid>
 </UserControl>