chore(test): add e2e test for test-tabs-system-item-ios scenario#4147
chore(test): add e2e test for test-tabs-system-item-ios scenario#4147LKuchno wants to merge 23 commits into
Conversation
…mitem, add new tab with systemitem and empty title prop - no title
…efinition to match route_cofig order
…ns into @lkuchno/test-tab-system-item-ios
…ns into @lkuchno/e2e-test-tab-system-item-ios
There was a problem hiding this comment.
Pull request overview
Adds an iOS-only Detox e2e test suite for the test-tabs-system-item-ios single-feature scenario to validate systemItem behavior and runtime overrides (systemItem/title/icon), and updates the scenario + screen to support stable test targeting.
Changes:
- Added a new Detox e2e suite covering static rendering and runtime cycling/combination of
systemItem, title overrides, and icon overrides. - Updated the test screen to expose stable
testIDs for config state labels/section headers and tab bar items. - Updated scenario documentation to explicitly list what is and isn’t automated.
Reviewed changes
Copilot reviewed 3 out of 3 changed files in this pull request and generated 3 comments.
| File | Description |
|---|---|
| FabricExample/e2e/single-feature-tests/tabs/test-tabs-system-item-ios.e2e.ts | New Detox suite for iOS systemItem tab bar behavior and overrides. |
| apps/src/tests/single-feature-tests/tabs/test-tabs-system-item-ios/index.tsx | Adds testIDs for Detox targeting and tab bar item IDs; minor JSX change. |
| apps/src/tests/single-feature-tests/tabs/test-tabs-system-item-ios/scenario.md | Documents current automation coverage and known manual gaps. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| describeIfiOS('Tab Bar System Item', () => { | ||
| beforeAll(async () => { | ||
| await device.reloadReactNative(); | ||
| await selectSingleFeatureTestsScreen('Tabs', 'test-tabs-system-item-ios'); | ||
| }); | ||
|
|
||
| describe('Static System Item tab', () => { | ||
| it('should display the tab bar with system item titles and icons', async () => { | ||
| await expect(element(by.type('UITabBar'))).toBeVisible(); | ||
| await expect(element(by.text('Static System Item'))).toBeVisible(); | ||
| await expect(element(by.id('bookmark-tab-item'))).toHaveLabel( | ||
| 'Bookmarks', | ||
| ); | ||
| await expect(element(by.id('custom-tab-item'))).toHaveLabel('Favorites'); | ||
| await expect( | ||
| element(by.id('book.fill').and(by.label('bookmark'))).atIndex(0), | ||
| ).toExist(); | ||
| await expect( | ||
| element(by.id('star.fill').and(by.label('favorite'))).atIndex(0), | ||
| ).toExist(); | ||
| }); | ||
|
|
||
| it('tab bar item icon and title should remain the same when switching between tabs', async () => { | ||
| await element(by.id('custom-tab-item')).tap(); | ||
| await expect(element(by.text('Runtime Config'))).toBeVisible(); | ||
| await expect( | ||
| element(by.id('book.fill').and(by.label('bookmark'))).atIndex(0), | ||
| ).toExist(); | ||
| await expect(element(by.id('bookmark-tab-item'))).toHaveLabel( | ||
| 'Bookmarks', | ||
| ); | ||
|
|
||
| await element(by.id('bookmark-tab-item')).tap(); | ||
| await expect(element(by.text('Static System Item'))).toBeVisible(); | ||
| await expect( | ||
| element(by.id('book.fill').and(by.label('bookmark'))).atIndex(0), | ||
| ).toExist(); | ||
| await expect(element(by.id('bookmark-tab-item'))).toHaveLabel( | ||
| 'Bookmarks', | ||
| ); | ||
| }); | ||
| }); | ||
| }); | ||
|
|
||
| describe('Runtime Config tab — initial state', () => { | ||
| beforeAll(async () => { | ||
| await element(by.id('custom-tab-item')).tap(); |
| import { | ||
| describeIfiOS, | ||
| forceTapByLabeliOS, | ||
| selectSingleFeatureTestsScreen, | ||
| } from '../../e2e-utils'; |
…g ai review comments" This reverts commit d298452.
| await element(by.text('system')).atIndex(1).tap(); | ||
| } | ||
|
|
||
| describeIfiOS('Tab Bar System Item (iOS 26)', () => { |
There was a problem hiding this comment.
I wonder if we should skip running this e2e completely if iOS < 26 is used but maybe it's not necessary.
| }); | ||
|
|
||
| describe('Runtime Config tab — title override cycling', () => { | ||
| it('should update the tab bar item label after tapping custom title', async () => { |
There was a problem hiding this comment.
| it('should update the tab bar item label after tapping custom title', async () => { | |
| it('should update the tab bar item label after switching to custom title', async () => { |
nit: I think we should focus here on the result/intention of the action, not the literal action of tapping the button
There was a problem hiding this comment.
applies to other places as well
Description
This PR implements the Detox e2e test suite for the
test-tabs-system-item-iosscenario, covering thesystemItemprop on iOS tab bar items.The test covers: static system item rendering, runtime
systemItemcycling (favorites/history/search), title override cycling (custom/hidden/system), icon override cycling (custom SFSymbols vs. system fallback), and combinations of all three overrides. All test blocks are wrapped indescribeIfiOSsince this feature is iOS-only. The scenario.md is updated to reflect what is and isn't automated.The following are explicitly not automated (documented in
scenario.md):searchsystemItem detached-state / label-hiding behaviour on iOS 26Closes https://github.com/software-mansion/react-native-screens-labs/issues/1410
Changes
test-tabs-system-item-ios.e2e.ts- new Detox test suitetestIDattributes to config state display labels and section headers; addtabBarItemTestIDto both tab route configso enable reliable Detox targetingscenario.mdto replace "TBD" with the actual automation status, listing known gaps