fixes custom buttons (#3918)

e2e/ScreenStyle.test.js

@@ -124,6 +124,13 @@ describe('screen style', () => {
     await expect(elementByLabel(`Two`)).toExist();
   });
 
+  test('custom button is tapable', async () => {
+    await elementById(testIDs.PUSH_OPTIONS_BUTTON).tap();
+    await expect(elementByLabel(`Two`)).toExist();
+    await elementByLabel(`Two`).tap();
+    await expect(elementByLabel(`Thanks for that :)`)).toExist();
+  });
+
   test('tab bar items visibility', async () => {
     await elementById(testIDs.TAB_BASED_APP_BUTTON).tap();
     await expect(elementById(testIDs.FIRST_TAB_BAR_BUTTON)).toBeVisible();

lib/ios/RNNNavigationButtons.m

@@ -78,7 +78,7 @@
 	
 	RNNUIBarButtonItem *barButtonItem;
 	if (component) {
-		RCTRootView *view = (RCTRootView*)[self.viewController.creator createRootView:component[@"name"] rootViewId:component[@"componentId"]];
+		RCTRootView *view = (RCTRootView*)[self.viewController.creator createCustomReactView:component[@"name"] rootViewId:component[@"componentId"]];
 		barButtonItem = [[RNNUIBarButtonItem alloc] init:buttonId withCustomView:view];
 	} else if (iconImage) {
 		barButtonItem = [[RNNUIBarButtonItem alloc] init:buttonId withIcon:iconImage];

lib/ios/RNNReactRootView.h

@@ -1,11 +1,6 @@
 #import <UIKit/UIKit.h>
-#import <React/RCTRootView.h>
-#import <React/RCTRootViewDelegate.h>
+#import "RNNReactView.h"
 
-@interface RNNReactRootView : RCTRootView <RCTRootViewDelegate>
-
-@property (nonatomic, copy) void (^rootViewDidChangeIntrinsicSize)(CGSize intrinsicSize);
-
-- (void)setAlignment:(NSString*)alignment;
+@interface RNNReactRootView : RNNReactView
 
 @end

lib/ios/RNNReactRootView.m

@@ -2,50 +2,15 @@
 #import "RCTHelpers.h"
 #import <React/RCTUIManager.h>
 
-@implementation RNNReactRootView {
-	RCTBridge* _bridge;
-};
+@implementation RNNReactRootView
 
-- (instancetype)initWithBridge:(RCTBridge *)bridge moduleName:(NSString *)moduleName initialProperties:(NSDictionary *)initialProperties {
-	self = [super initWithBridge:bridge moduleName:moduleName initialProperties:initialProperties];
-	_bridge = bridge;
-	
-#ifdef DEBUG
-	[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(contentDidAppear:) name:RCTContentDidAppearNotification object:nil];
-#endif
-	
-	return self;
+- (void)layoutSubviews {
+	[super layoutSubviews];
+	[self.bridge.uiManager setSize:self.bounds.size forView:self];
 }
 
 - (void)contentDidAppear:(NSNotification *)notification {
-	if ([((RNNReactRootView *)notification.object).moduleName isEqualToString:self.moduleName]) {
-		[RCTHelpers removeYellowBox:self];
-		[[NSNotificationCenter defaultCenter] removeObserver:self];
-	}
-}
-
-- (void)setRootViewDidChangeIntrinsicSize:(void (^)(CGSize))rootViewDidChangeIntrinsicSize {
-	_rootViewDidChangeIntrinsicSize = rootViewDidChangeIntrinsicSize;
-	self.delegate = self;
-}
-
-- (void)rootViewDidChangeIntrinsicSize:(RCTRootView *)rootView {
-	if (_rootViewDidChangeIntrinsicSize) {
-		_rootViewDidChangeIntrinsicSize(rootView.intrinsicContentSize);
-	}
-}
-
-- (void)setAlignment:(NSString *)alignment {
-	if ([alignment isEqualToString:@"fill"]) {
-		self.sizeFlexibility = RCTRootViewSizeFlexibilityNone;
-	} else {
-		self.sizeFlexibility = RCTRootViewSizeFlexibilityWidthAndHeight;
-	}
-}
-
-- (void)layoutSubviews {
-	[super layoutSubviews];
-	[_bridge.uiManager setSize:self.bounds.size forView:self];
+	
 }
 
 @end

lib/ios/RNNReactRootViewCreator.m

@@ -1,6 +1,7 @@
 
 #import "RNNReactRootViewCreator.h"
 #import "RNNReactRootView.h"
+#import "RNNReactView.h"
 
 @implementation RNNReactRootViewCreator {
 	RCTBridge *_bridge;
@@ -26,8 +27,19 @@
 	return view;
 }
 
+- (UIView*)createCustomReactView:(NSString*)name rootViewId:(NSString*)rootViewId {
+	if (!rootViewId) {
+		@throw [NSException exceptionWithName:@"MissingViewId" reason:@"Missing view id" userInfo:nil];
+	}
+	
+	UIView *view = [[RNNReactView alloc] initWithBridge:_bridge
+												 moduleName:name
+										  initialProperties:@{@"componentId": rootViewId}];
+	return view;
+}
+
 -(UIView*)createRootViewFromComponentOptions:(RNNComponentOptions*)componentOptions {
-	return [self createRootView:componentOptions.name rootViewId:componentOptions.componentId];
+	return [self createCustomReactView:componentOptions.name rootViewId:componentOptions.componentId];
 }
 
 @end

lib/ios/RNNReactView.h

@@ -0,0 +1,10 @@
+#import <React/RCTRootView.h>
+#import <React/RCTRootViewDelegate.h>
+
+@interface RNNReactView : RCTRootView <RCTRootViewDelegate>
+
+@property (nonatomic, copy) void (^rootViewDidChangeIntrinsicSize)(CGSize intrinsicSize);
+
+- (void)setAlignment:(NSString *)alignment;
+
+@end

lib/ios/RNNReactView.m

@@ -0,0 +1,42 @@
+#import "RNNReactView.h"
+#import "RCTHelpers.h"
+
+@implementation RNNReactView
+
+- (instancetype)initWithBridge:(RCTBridge *)bridge moduleName:(NSString *)moduleName initialProperties:(NSDictionary *)initialProperties {
+	self = [super initWithBridge:bridge moduleName:moduleName initialProperties:initialProperties];
+	
+#ifdef DEBUG
+	[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(contentDidAppear:) name:RCTContentDidAppearNotification object:nil];
+#endif
+	
+	return self;
+}
+
+- (void)contentDidAppear:(NSNotification *)notification {
+	if ([((RNNReactView *)notification.object).moduleName isEqualToString:self.moduleName]) {
+		[RCTHelpers removeYellowBox:self];
+		[[NSNotificationCenter defaultCenter] removeObserver:self];
+	}
+}
+
+- (void)setRootViewDidChangeIntrinsicSize:(void (^)(CGSize))rootViewDidChangeIntrinsicSize {
+	_rootViewDidChangeIntrinsicSize = rootViewDidChangeIntrinsicSize;
+	self.delegate = self;
+}
+
+- (void)rootViewDidChangeIntrinsicSize:(RCTRootView *)rootView {
+	if (_rootViewDidChangeIntrinsicSize) {
+		_rootViewDidChangeIntrinsicSize(rootView.intrinsicContentSize);
+	}
+}
+
+- (void)setAlignment:(NSString *)alignment {
+	if ([alignment isEqualToString:@"fill"]) {
+		self.sizeFlexibility = RCTRootViewSizeFlexibilityNone;
+	} else {
+		self.sizeFlexibility = RCTRootViewSizeFlexibilityWidthAndHeight;
+	}
+}
+
+@end

lib/ios/RNNRootViewController.m

@@ -1,13 +1,12 @@
-
 #import "RNNRootViewController.h"
 #import <React/RCTConvert.h>
 #import "RNNAnimator.h"
 #import "RNNCustomTitleView.h"
 #import "RNNPushAnimation.h"
-#import "RNNReactRootView.h"
+#import "RNNReactView.h"
 
 @interface RNNRootViewController() {
-	RNNReactRootView* _customTitleView;
+	RNNReactView* _customTitleView;
 	UIView* _customTopBar;
 	UIView* _customTopBarBackground;
 	BOOL _isBeingPresented;
@@ -141,11 +140,11 @@
 - (void)setCustomNavigationTitleView {
 	if (!_customTitleView && _isBeingPresented) {
 		if (self.options.topBar.title.component.name) {
-			_customTitleView = (RNNReactRootView*)[_creator createRootViewFromComponentOptions:self.options.topBar.title.component];
+			_customTitleView = (RNNReactView*)[_creator createRootViewFromComponentOptions:self.options.topBar.title.component];
 			_customTitleView.backgroundColor = UIColor.clearColor;
 			[_customTitleView setAlignment:self.options.topBar.title.component.alignment];
 			BOOL isCenter = [self.options.topBar.title.component.alignment isEqualToString:@"center"];
-			__weak RNNReactRootView *weakTitleView = _customTitleView;
+			__weak RNNReactView *weakTitleView = _customTitleView;
 			CGRect frame = self.navigationController.navigationBar.bounds;
 			[_customTitleView setFrame:frame];
 			[_customTitleView setRootViewDidChangeIntrinsicSize:^(CGSize intrinsicContentSize) {

lib/ios/RNNRootViewCreator.h

@@ -4,9 +4,11 @@
 
 @protocol RNNRootViewCreator
 
--(UIView*)createRootView:(NSString*)name rootViewId:(NSString*)rootViewId;
+- (UIView*)createRootView:(NSString*)name rootViewId:(NSString*)rootViewId;
 
--(UIView*)createRootViewFromComponentOptions:(RNNComponentOptions*)componentOptions;
+- (UIView*)createRootViewFromComponentOptions:(RNNComponentOptions*)componentOptions;
+
+- (UIView*)createCustomReactView:(NSString*)name rootViewId:(NSString*)rootViewId;
 
 @end
 

lib/ios/ReactNativeNavigation.xcodeproj/project.pbxproj

@@ -67,6 +67,8 @@
 		5016E8F020209690009D4F7C /* RNNCustomTitleView.m in Sources */ = {isa = PBXBuildFile; fileRef = 5016E8EE2020968F009D4F7C /* RNNCustomTitleView.m */; };
 		50175CD1207A2AA1004FE91B /* RNNComponentOptions.h in Headers */ = {isa = PBXBuildFile; fileRef = 50175CCF207A2AA1004FE91B /* RNNComponentOptions.h */; };
 		50175CD2207A2AA1004FE91B /* RNNComponentOptions.m in Sources */ = {isa = PBXBuildFile; fileRef = 50175CD0207A2AA1004FE91B /* RNNComponentOptions.m */; };
+		501E0217213E7EA3003365C5 /* RNNReactView.h in Headers */ = {isa = PBXBuildFile; fileRef = 501E0215213E7EA3003365C5 /* RNNReactView.h */; };
+		501E0218213E7EA3003365C5 /* RNNReactView.m in Sources */ = {isa = PBXBuildFile; fileRef = 501E0216213E7EA3003365C5 /* RNNReactView.m */; };
 		50220F48212ABDFD004C2B0A /* RNNReactRootView.h in Headers */ = {isa = PBXBuildFile; fileRef = 50220F46212ABDFD004C2B0A /* RNNReactRootView.h */; };
 		50220F49212ABDFD004C2B0A /* RNNReactRootView.m in Sources */ = {isa = PBXBuildFile; fileRef = 50220F47212ABDFD004C2B0A /* RNNReactRootView.m */; };
 		502CB43A20CBCA180019B2FE /* RNNBridgeManagerDelegate.h in Headers */ = {isa = PBXBuildFile; fileRef = 502CB43920CBCA140019B2FE /* RNNBridgeManagerDelegate.h */; settings = {ATTRIBUTES = (Public, ); }; };
@@ -293,6 +295,8 @@
 		5016E8EE2020968F009D4F7C /* RNNCustomTitleView.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RNNCustomTitleView.m; sourceTree = "<group>"; };
 		50175CCF207A2AA1004FE91B /* RNNComponentOptions.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNComponentOptions.h; sourceTree = "<group>"; };
 		50175CD0207A2AA1004FE91B /* RNNComponentOptions.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNComponentOptions.m; sourceTree = "<group>"; };
+		501E0215213E7EA3003365C5 /* RNNReactView.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNReactView.h; sourceTree = "<group>"; };
+		501E0216213E7EA3003365C5 /* RNNReactView.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNReactView.m; sourceTree = "<group>"; };
 		50220F46212ABDFD004C2B0A /* RNNReactRootView.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNReactRootView.h; sourceTree = "<group>"; };
 		50220F47212ABDFD004C2B0A /* RNNReactRootView.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNReactRootView.m; sourceTree = "<group>"; };
 		502CB43920CBCA140019B2FE /* RNNBridgeManagerDelegate.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNBridgeManagerDelegate.h; sourceTree = "<group>"; };
@@ -648,6 +652,8 @@
 				50570BE82063E09B006A1B5C /* RNNTitleViewHelper.h */,
 				50220F46212ABDFD004C2B0A /* RNNReactRootView.h */,
 				50220F47212ABDFD004C2B0A /* RNNReactRootView.m */,
+				501E0215213E7EA3003365C5 /* RNNReactView.h */,
+				501E0216213E7EA3003365C5 /* RNNReactView.m */,
 				50570BE92063E09B006A1B5C /* RNNTitleViewHelper.m */,
 				26916C941E4B9CCC00D13680 /* RNNRootViewCreator.h */,
 				26916C961E4B9E7700D13680 /* RNNReactRootViewCreator.h */,
@@ -898,6 +904,7 @@
 				50220F48212ABDFD004C2B0A /* RNNReactRootView.h in Headers */,
 				2DCD9195200014A900EDC75D /* RNNBridgeManager.h in Headers */,
 				7B1126A91E2D2B6C00F9B03B /* RNNControllerFactory.h in Headers */,
+				501E0217213E7EA3003365C5 /* RNNReactView.h in Headers */,
 				263905D61E4C94970023D7D3 /* RNNSideMenuController.h in Headers */,
 				263905C81E4C6F440023D7D3 /* SidebarFlipboardAnimation.h in Headers */,
 				7BEF0D1C1E43771B003E96B0 /* RNNLayoutNode.h in Headers */,
@@ -1035,6 +1042,7 @@
 				E8DA24411F97459B00CD552B /* RNNElementFinder.m in Sources */,
 				50570B272061473D006A1B5C /* RNNTitleOptions.m in Sources */,
 				263905BF1E4C6F440023D7D3 /* RCCTheSideBarManagerViewController.m in Sources */,
+				501E0218213E7EA3003365C5 /* RNNReactView.m in Sources */,
 				50BE951220B5A787004F5DF5 /* RNNStatusBarOptions.m in Sources */,
 				7B1126A01E2D263F00F9B03B /* RNNEventEmitter.m in Sources */,
 				A7626BFD1FC2FB2C00492FB8 /* RNNTopBarOptions.m in Sources */,