Android: Fix ordering of top-bar left-hand button layout (#7848)

wix · Feb 18, 2024 · 4b79301 · 4b79301
1 parent 0be34f9
commit 4b79301
Show file tree

Hide file tree

Showing 5 changed files with 21 additions and 7 deletions.
diff --git a/e2e/Buttons.test.js b/e2e/Buttons.test.js
@@ -1,7 +1,12 @@
 import Utils from './Utils';
 import TestIDs from '../playground/src/testIDs';
 
-const { elementById, elementByLabel } = Utils;
+const {
+  elementById,
+  elementByLabel,
+  elementTopBar,
+  expectImagesToBeEqual,
+} = Utils;
 
 describe('Buttons', () => {
   beforeEach(async () => {
@@ -10,6 +15,12 @@ describe('Buttons', () => {
     await elementById(TestIDs.GOTO_BUTTONS_SCREEN).tap();
   });
 
+  it.e2e('should render top/navigation-bar buttons in the right order', async () => {
+    const snapshottedImagePath = `./e2e/assets/buttons_navbar.${device.getPlatform()}.png`;
+    const actual = await elementTopBar().takeScreenshot('buttons_navbar');
+    expectImagesToBeEqual(actual, snapshottedImagePath)
+  });
+
   it(':android: should not effect left buttons when hiding back button', async () => {
     await elementById(TestIDs.TOGGLE_BACK).tap();
     await expect(elementById(TestIDs.LEFT_BUTTON)).toBeVisible();

diff --git a/e2e/Utils.js b/e2e/Utils.js
@@ -15,11 +15,14 @@ const utils = {
     // return element(by.label(label)).atIndex(0);
     return element(by.text(label));
   },
-  elementById: (id) => {
-    return element(by.id(id));
-  },
-  elementByTraits: (traits) => {
-    return element(by.traits(traits));
+  elementById: (id) => element(by.id(id)),
+  elementByTraits: (traits) => element(by.traits(traits)),
+  elementByType: (type) => element(by.type(type)),
+  elementTopBar: () => {
+    const elementType = (device.getPlatform() === 'ios') ?
+      'UINavigationBar' :
+      'com.reactnativenavigation.views.stack.topbar.TopBar';
+    return utils.elementByType(elementType);
   },
   tapBackIos: () => {
     try {

diff --git a/e2e/assets/buttons_navbar.android.png b/e2e/assets/buttons_navbar.android.png
diff --git a/e2e/assets/buttons_navbar.ios.png b/e2e/assets/buttons_navbar.ios.png
diff --git a/...in/java/com/reactnativenavigation/views/stack/topbar/titlebar/TitleAndButtonsContainer.kt b/...in/java/com/reactnativenavigation/views/stack/topbar/titlebar/TitleAndButtonsContainer.kt
@@ -71,7 +71,7 @@ class TitleAndButtonsContainer(context: Context) : ViewGroup(context) {
         component?.layoutDirection = layoutDirection
         titleSubTitleBar.layoutDirection = layoutDirection
         rightButtonBar.layoutDirection = layoutDirection
-        leftButtonBar.layoutDirection = if(isRTL()) View.LAYOUT_DIRECTION_LTR else View.LAYOUT_DIRECTION_RTL
+        leftButtonBar.layoutDirection = if (isRTL()) View.LAYOUT_DIRECTION_RTL else layoutDirection
     }
 
     fun setSubTitleTextAlignment(alignment: Alignment) = titleSubTitleBar.setSubTitleAlignment(alignment)