iOS Snapshot tests (wix#6081)

Add snapshot tests

package.json

@@ -32,6 +32,7 @@
     "test-js": "node ./scripts/test-js",
     "pod-install": "pod install --project-directory=playground/ios",
     "test-unit-ios": "node ./scripts/test-unit --ios",
+    "test-snapshot-ios": "node ./scripts/test-snapshot --ios",
     "test-unit-android": "node ./scripts/test-unit --android",
     "pretest-e2e-android": "npm run build",
     "test-e2e-android": "node ./scripts/test-e2e --android",

playground/ios/NavigationTests/RNNTestRootViewCreator.m

@@ -3,8 +3,14 @@
 @implementation RNNTestRootViewCreator
 
 - (RNNReactView *)createRootView:(NSString *)name rootViewId:(NSString *)rootViewId ofType:(RNNComponentType)componentType reactViewReadyBlock:(RNNReactViewReadyCompletionBlock)reactViewReadyBlock {
-	UIView *view = [[UIView alloc] init];
+	UIView *view = [[UIView alloc] initWithFrame:UIScreen.mainScreen.bounds];
+	UILabel* label = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 200, 200)];
+	label.textAlignment = NSTextAlignmentCenter;
+	label.center = [view convertPoint:view.center fromView:view.superview];;
+	label.text = rootViewId;
+	[view addSubview:label];
 	view.tag = [rootViewId intValue];
+	view.backgroundColor = UIColor.redColor;
 	return view;
 }
 

playground/ios/Podfile

@@ -54,3 +54,9 @@ target 'NavigationIOS12Tests' do
   pod 'OCMock'
 end
 
+target 'SnapshotTests' do
+  all_pods
+  pod 'OCMock'
+  use_frameworks!
+  pod 'iOSSnapshotTestCase/Core'
+end

playground/ios/Podfile.lock

@@ -19,6 +19,7 @@ PODS:
     - DoubleConversion
     - glog
   - glog (0.3.5)
+  - iOSSnapshotTestCase/Core (6.2.0)
   - OCMock (3.5)
   - RCTRequired (0.61.5)
   - RCTTypeSafety (0.61.5):
@@ -220,7 +221,7 @@ PODS:
     - ReactCommon/jscallinvoker (= 0.61.5)
   - ReactNativeKeyboardTrackingView (5.6.1):
     - React
-  - ReactNativeNavigation (6.0.1):
+  - ReactNativeNavigation (6.3.1):
     - React
     - React-RCTImage
     - React-RCTText
@@ -232,6 +233,7 @@ DEPENDENCIES:
   - FBReactNativeSpec (from `../../node_modules/react-native/Libraries/FBReactNativeSpec`)
   - Folly (from `../../node_modules/react-native/third-party-podspecs/Folly.podspec`)
   - glog (from `../../node_modules/react-native/third-party-podspecs/glog.podspec`)
+  - iOSSnapshotTestCase/Core
   - OCMock
   - RCTRequired (from `../../node_modules/react-native/Libraries/RCTRequired`)
   - RCTTypeSafety (from `../../node_modules/react-native/Libraries/TypeSafety`)
@@ -262,6 +264,7 @@ DEPENDENCIES:
 SPEC REPOS:
   trunk:
     - boost-for-react-native
+    - iOSSnapshotTestCase
     - OCMock
 
 EXTERNAL SOURCES:
@@ -327,6 +330,7 @@ SPEC CHECKSUMS:
   FBReactNativeSpec: 118d0d177724c2d67f08a59136eb29ef5943ec75
   Folly: 30e7936e1c45c08d884aa59369ed951a8e68cf51
   glog: 1f3da668190260b06b429bb211bfbee5cd790c28
+  iOSSnapshotTestCase: 9ab44cb5aa62b84d31847f40680112e15ec579a6
   OCMock: 4ab4577fc941af31f4a0398f6e7e230cf21fc72a
   RCTRequired: b153add4da6e7dbc44aebf93f3cf4fcae392ddf1
   RCTTypeSafety: 9aa1b91d7f9310fc6eadc3cf95126ffe818af320
@@ -348,9 +352,9 @@ SPEC CHECKSUMS:
   React-RCTVibration: a49a1f42bf8f5acf1c3e297097517c6b3af377ad
   ReactCommon: 198c7c8d3591f975e5431bec1b0b3b581aa1c5dd
   ReactNativeKeyboardTrackingView: a240a6a0dba852bb107109a7ec7e98b884055977
-  ReactNativeNavigation: 33657becf06c9c3a805ecb50dce8010fb887a1bb
+  ReactNativeNavigation: d9bb71088ef37aa6af58f3172f890a1ae08861d6
   Yoga: f2a7cd4280bfe2cca5a7aed98ba0eb3d1310f18b
 
-PODFILE CHECKSUM: 781f49751a12b13af3e83d5dfc4b122aa5770543
+PODFILE CHECKSUM: 480983e790dd4e9f99b1673fbb65606d9fe8ce71
 
-COCOAPODS: 1.8.4
+COCOAPODS: 1.9.1

playground/ios/playgroundTests/Info.plist → playground/ios/SnapshotTests/Info.plist

@@ -13,7 +13,7 @@
 	<key>CFBundleName</key>
 	<string>$(PRODUCT_NAME)</string>
 	<key>CFBundlePackageType</key>
-	<string>BNDL</string>
+	<string>$(PRODUCT_BUNDLE_PACKAGE_TYPE)</string>
 	<key>CFBundleShortVersionString</key>
 	<string>1.0</string>
 	<key>CFBundleVersion</key>

playground/ios/SnapshotTests/StackOptionsTest.m

@@ -0,0 +1,73 @@
+#import <XCTest/XCTest.h>
+#import "LayoutCreator.h"
+#import "CommandsHandlerCreator.h"
+#import <FBSnapshotTestCase/FBSnapshotTestCase.h>
+
+@interface StackOptionsTest : FBSnapshotTestCase
+@property (nonatomic, strong) RNNCommandsHandler* commandsHandler;
+@property (nonatomic, strong) UIWindow* window;
+@end
+
+@implementation StackOptionsTest
+
+- (void)setUp {
+	[super setUp];
+	_window = [[[UIApplication sharedApplication] delegate] window];
+	_commandsHandler = [CommandsHandlerCreator createWithWindow:_window];
+	self.usesDrawViewHierarchyInRect = YES;
+
+//	Uncomment next line to record new snapshots
+//	self.recordMode = YES;
+}
+
+- (void)tearDown {
+	[super tearDown];
+	_window.rootViewController = nil;
+}
+
+#define RNNStackFlow(NAME, FIRST, SECOND, ...)\
+[self setRoot:[LayoutCreator component:@"FirstComponent" options:FIRST] testName:@#NAME]; \
+[self push:[LayoutCreator component:@"SecondComponent" options:SECOND] testName:@#NAME]; \
+[self pop:@"SecondComponent" testName:@#NAME]; \
+
+
+- (void)testStack_topBar {
+	RNNStackFlow(opaque background, @{@"topBar": @{@"background": @{@"color": @(0xFFFF00FF)}}}, @{@"topBar": @{@"background": @{@"color": @(0xFFFF0000)}}});
+	RNNStackFlow(tansparent background, @{@"topBar": @{@"background": @{@"color": @(0x00FFFFFF)}}}, @{@"topBar": @{@"background": @{@"color": @(0xFFFF0000)}}});
+	RNNStackFlow(translucent background, @{@"topBar": @{@"background": @{@"translucent": @(1)}}}, @{@"topBar": @{@"background": @{@"translucent": @(0)}}});
+	RNNStackFlow(title change, @{@"topBar": @{@"title": @{@"text": @"First Component"}}}, @{@"topBar": @{@"title": @{@"text": @"Second Component"}}});
+	RNNStackFlow(visibility, @{@"topBar": @{@"visible": @(0)}}, @{@"topBar": @{@"visible": @(1)}});
+	RNNStackFlow(title font, @{@"topBar": @{@"title": @{@"text": @"First Component"}}}, (@{@"topBar": @{@"title": @{@"text": @"Second Component", @"fontFamily": @"Arial", @"color": @(0xFFFF00FF), @"fontSize": @(15)}}}));
+}
+
+- (void)setRoot:(NSDictionary *)firstComponent testName:(NSString *)testName {
+	NSDictionary* root = [LayoutCreator stack:@{} children:@[firstComponent]];
+	NSString* rootTestName = [NSString stringWithFormat:@"%@_root", testName];
+	[_commandsHandler setRoot:@{@"root": root}
+					commandId:@"SetRoot"
+				   completion:^{}];
+	FBSnapshotVerifyView(_window, rootTestName);
+}
+
+- (void)push:(NSDictionary *)secondComponent testName:(NSString *)testName {
+	NSString* pushTestName = [NSString stringWithFormat:@"%@_push", testName];
+	[_commandsHandler push:@"FirstComponent"
+				 commandId:@"push"
+					layout:secondComponent
+				completion:^{}
+				 rejection:^(NSString *code, NSString *message, NSError *error) {}];
+	FBSnapshotVerifyView(_window, pushTestName);
+}
+
+- (void)pop:(NSString *)componentId testName:(NSString *)testName {
+	NSString* popTestName = [NSString stringWithFormat:@"%@_pop", testName];
+	[_commandsHandler pop:componentId
+				commandId:@"pop"
+			 mergeOptions:@{}
+			   completion:^{}
+				rejection:^(NSString *code, NSString *message, NSError *error) {}];
+	FBSnapshotVerifyView(_window, popTestName);
+}
+
+
+@end

playground/ios/SnapshotTests/Utils/CommandsHandlerCreator.h

@@ -0,0 +1,8 @@
+#import <Foundation/Foundation.h>
+#import <ReactNativeNavigation/RNNCommandsHandler.h>
+
+@interface CommandsHandlerCreator : NSObject
+
++ (RNNCommandsHandler *)createWithWindow:(UIWindow *)window;
+
+@end

playground/ios/SnapshotTests/Utils/CommandsHandlerCreator.m

@@ -0,0 +1,38 @@
+#import "CommandsHandlerCreator.h"
+#import "RNNTestRootViewCreator.h"
+#import <ReactNativeNavigation/RNNEventEmitter.h>
+#import <ReactNativeNavigation/RNNOverlayManager.h>
+#import <ReactNativeNavigation/RNNModalManager.h>
+#import <ReactNativeNavigation/RNNControllerFactory.h>
+
+@implementation CommandsHandlerCreator
+
++ (RNNCommandsHandler *)createWithWindow:(UIWindow *)window {
+	RNNTestRootViewCreator* creator = [RNNTestRootViewCreator new];
+	RNNEventEmitter* eventEmmiter = [RNNEventEmitter new];
+	RNNOverlayManager* overlayManager = [RNNOverlayManager new];
+	RNNModalManager* modalManager = [RNNModalManager new];
+	RNNControllerFactory* controllerFactory = [[RNNControllerFactory alloc] initWithRootViewCreator:creator eventEmitter:eventEmmiter store:nil componentRegistry:nil andBridge:nil bottomTabsAttachModeFactory:[BottomTabsAttachModeFactory new]];
+	RNNCommandsHandler* commandsHandler = [[RNNCommandsHandler alloc] initWithControllerFactory:controllerFactory eventEmitter:eventEmmiter modalManager:modalManager overlayManager:overlayManager mainWindow:window];
+	[commandsHandler setReadyToReceiveCommands:YES];
+	[commandsHandler setDefaultOptions:@{
+		@"animations": @{
+				@"push": @{
+						@"enabled": @(0)
+				},
+				@"pop": @{
+						@"enabled": @(0)
+				}
+		},
+		@"topBar": @{
+				@"drawBehind": @(1)
+		},
+		@"layout": @{
+				@"componentBackgroundColor": @(0xFF00FF00)
+		}
+	} completion:^{}];
+
+	return commandsHandler;
+}
+
+@end

playground/ios/SnapshotTests/Utils/LayoutCreator.h

@@ -0,0 +1,11 @@
+#import <Foundation/Foundation.h>
+
+@interface LayoutCreator : NSObject
+
++ (NSDictionary *)component:(NSString *)componentId options:(NSDictionary *)options;
+
++ (NSDictionary *)parentWithID:(NSString *)componentId type:(NSString *)type options:(NSDictionary *)options children:(NSArray<NSDictionary *> *)children;
+
++ (NSDictionary *)stack:(NSDictionary *)options children:(NSArray<NSDictionary *> *)children;
+
+@end

playground/ios/SnapshotTests/Utils/LayoutCreator.m

@@ -0,0 +1,37 @@
+#import "LayoutCreator.h"
+
+@implementation LayoutCreator
+
++ (NSDictionary *)component:(NSString *)componentId options:(NSDictionary *)options {
+	return @{
+		@"type": @"Component",
+		@"id": componentId,
+		@"data": @{
+				@"options": options
+		}
+	};
+}
+
++ (NSDictionary *)parentWithID:(NSString *)componentId type:(NSString *)type options:(NSDictionary *)options children:(NSArray<NSDictionary *> *)children {
+	return @{
+		@"type": type,
+		@"id": componentId,
+		@"data": @{
+				@"options": options
+		},
+		@"children": children
+	};
+}
+
++ (NSDictionary *)stack:(NSDictionary *)options children:(NSArray<NSDictionary *> *)children {
+	return @{
+		@"type": @"Stack",
+		@"id": @"StackID",
+		@"data": @{
+				@"options": options
+		},
+		@"children": children
+	};
+}
+
+@end