Skip to content

chore(test, iOS): add e2e test for Stack Header Icons#4343

Open
LKuchno wants to merge 5 commits into
mainfrom
@lkuchno/e2e-test-stack-header-icon-ios
Open

chore(test, iOS): add e2e test for Stack Header Icons#4343
LKuchno wants to merge 5 commits into
mainfrom
@lkuchno/e2e-test-stack-header-icon-ios

Conversation

@LKuchno

@LKuchno LKuchno commented Jul 16, 2026

Copy link
Copy Markdown
Collaborator

Description

Adds an end-to-end (Detox) test for the Stack Header Icons (iOS) single-feature test screen (test-stack-header-icon-ios), covering the automatable subset of its manual scenario. Also wires the test screen with the testIDs the e2e test relies on and documents the coverage in scenario.md.

Closes: https://github.com/software-mansion/react-native-screens-labs/issues/1663

Changes

  • New e2e spec: FabricExample/e2e/single-feature-tests/stack-v5/test-stack-header-icon-ios.e2e.ts.
    • Asserts the trailing header item renders the sfSymbol icon (matched via its native favorite accessibility label on _UIModernBarButton).
    • Verifies bar-button icon cycling (sfSymbol → xcasset → imageSource → templateSource → sfSymbol) indirectly: the sfSymbol icon must be absent while a non-sfSymbol variant is selected, anchored on the on-screen current-item-icon text.
    • Opens the header item menu on long press, asserts its items become visible, and verifies the in-menu "Cycle icons" action advances the menu icon variant through all four values and back.
    • Matches native views through shared constants from the native-class-names registry rather than inline string literals.
  • native-class-names.ts: registered the native classes this spec queries — _UIModernBarButton, _UIContextMenuCellContentView, _UIContextMenuSubmenuTitleView and UILabel — so a native symbol rename only has to be applied in one place.
  • apps/.../test-stack-header-icon-ios/index.tsx: added testIDs (cycle-item-icon-button, cycle-menu-icons-button, current-item-icon, …) needed for stable Detox matching; Prettier formatting.
  • scenario-description.ts: updated e2eCoverage.
  • scenario.md: documented what the e2e covers and what remains manual-only.

Coverage notes

Only the sfSymbol variant exposes a native label; xcasset, imageSource and templateSource render as plain images with no id/label/text, so their rendered appearance can't be asserted — cycling is verified indirectly via absence of the sfSymbol icon plus the on-screen variant text. Not covered (manual only): exact rendered image of non-SF-Symbol icons, crossfade, per-item icon positioning inside the menu, nested submenu icons, and menu layout shifts.

@LKuchno LKuchno changed the title test(Stack v5, iOS): add e2e test for Stack Header Icons chore(test, iOS): add e2e test for Stack Header Icons Jul 16, 2026
@LKuchno LKuchno added platform:ios Issue related to iOS part of the library type:e2e Actions related to e2e maintenance and development, especially automation. area:stack-v5 Issues related to Native Stack v5 implementation labels Jul 16, 2026
@LKuchno
LKuchno requested a review from Copilot July 16, 2026 11:42

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Adds a new iOS-only Detox end-to-end test for the Stack v5 “Header Icons” single-feature scenario in the FabricExample app, plus the supporting testIDs and scenario coverage documentation to make the test stable and discoverable.

Changes:

  • Added a new Detox spec that validates the SF Symbol icon presence and verifies icon-variant cycling (indirectly for non-SF-Symbol variants) and context-menu behavior.
  • Wired the scenario screen with additional testIDs for stable Detox matching.
  • Updated scenario metadata and docs to reflect partial (incomplete) e2e coverage and what remains manual-only.

Reviewed changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated 7 comments.

File Description
FabricExample/e2e/single-feature-tests/stack-v5/test-stack-header-icon-ios.e2e.ts New iOS Detox spec covering header icon + context menu behaviors.
apps/src/tests/single-feature-tests/stack-v5/test-stack-header-icon-ios/index.tsx Adds testIDs on UI elements used by Detox (and minor formatting).
apps/src/tests/single-feature-tests/stack-v5/test-stack-header-icon-ios/scenario-description.ts Marks e2eCoverage as incomplete.
apps/src/tests/single-feature-tests/stack-v5/test-stack-header-icon-ios/scenario.md Documents what the new e2e test covers vs. what remains manual.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread FabricExample/e2e/single-feature-tests/stack-v5/test-stack-header-icon-ios.e2e.ts Outdated
Comment thread FabricExample/e2e/single-feature-tests/stack-v5/test-stack-header-icon-ios.e2e.ts Outdated
@LKuchno
LKuchno requested a review from kmichalikk July 16, 2026 12:52

@kmichalikk kmichalikk left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good. We could add some comment about the indirect checking when cycling directly in the e2e code, there would be less confusion when looking at only the code in the future, but up to you.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

area:stack-v5 Issues related to Native Stack v5 implementation platform:ios Issue related to iOS part of the library type:e2e Actions related to e2e maintenance and development, especially automation.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants