Mattermost Mobile

The Maestro E2E test suite is organized into sub-flows, fixtures, and main flows:

• subflows/: Reusable logic for authentication, navigation, calls, waits, and server/browser interactions.
• fixtures/: Node scripts for seeding data (users, channels, files) or polling APIs.
• flows/: The actual test scenarios, categorized by feature (account, calls, channels, multi-device, timezone).
• scripts/: Orchestration scripts for running specific test types (e.g., two-device or timezone tests).

detox/maestro/
  package.json                         # Maestro CLI version pin + npm scripts
  README.md                            # This file
  subflows/
    auth/
      login.yml                        # Reusable: app launch + login
      logout.yml                       # Reusable: logout from app
    navigation/
      navigate_to_channel.yml          # Reusable: tap channel in sidebar
      expand_channels_category.yml
      dismiss_scheduled_post_tooltip.yml
    calls/
      join_channel_call.yml
      wait_for_active_call.yml
    waits/
      wait_for_home_tab.yml
      wait_for_server_connect_complete.yml
    server/
      connect_server.yml
    browser/
      dismiss_chrome_interstitial.yml
      reopen_settings_screen.yml
    timezone/
      assert_timezone_region_label.yml
      assert_timezone_region_local.yml
  lib/
    env.ts                             # Env helpers for fixture scripts
    timezone_region.sh                 # Shell helper for timezone CI
  fixtures/
    seed.ts                            # Node script: create team/channel/user via API
    seed_file_preview.ts               # Node script: seed for file_type_preview flows
    calls_seed.ts                      # Node script: seed calls-specific data
    poll_for_message.ts               # Node script: poll API for SYNC_TOKEN message
  flows/
    account/
      attach_logs.yml                  # MM-T67856 (Zephyr MM-T3261 Report a Problem)
      help_url.yml                     # MM-T3260
    calls/
      call_ui_permission.yml           # MM-T1411 (Android PR CI only)
      leave_call.yml                   # MM-T4833 (Android PR CI only)
      mute_unmute.yml                  # MM-T4832 (Android PR CI only)
      start_call.yml                   # MM-T4829 (nightly/manual — calls_seed.ts)
    channels/
      channel_bookmark_file.yml        # MM-T5603
      channel_bookmark_file_android_picker.yml  # sub-flow (skipped in PR batch)
      channel_bookmark_file_ios_picker.yml     # sub-flow (skipped in PR batch)
      channel_bookmark_link_external.yml       # MM-T5611
      file_type_preview.yml             # MM-T3244 (nightly — seed_file_preview.ts)
    multi_device/
      device_a_start_call.yml          # MM-T4830 (two-device calls)
      device_b_join_call.yml           # MM-T4831 (two-device calls)
      user_a_sends_message.yml         # MM-T3055
      user_b_receives_message.yml      # MM-T3056
    timezone/
      clock_display.yml                 # MM-T1325
  scripts/
    run_two_device.sh                  # Orchestrate two-device tests
    run_timezone_test.sh              # Timezone test with simctl timezone setup

The webhook_server.js serves callbacks for mm_blocks_* and interactive dialog specs on port :3000.

• Local Server: If SITE_1_URL is http://localhost:8065, no tunnel is needed. Run npm run start:webhook in the detox folder.
• Remote/Cloud Server: The server must reach your machine via a public HTTPS origin. Use detox/scripts/start_webhook_sidecar.sh to start the sidecar. It resolves an origin in this priority:
  1. WEBHOOK_PUBLIC_BASE_URL: A provided HTTPS origin (e.g., ngrok).
  2. WEBHOOK_PUBLIC_BASE_URL + CLOUDFLARED_TUNNEL_TOKEN: A Cloudflare tunnel.
  3. Fallback: A trycloudflare.com quick tunnel (not recommended for reliable callbacks).

Environment Variables:

• WEBHOOK_PUBLIC_BASE_URL: The public HTTPS URL.
• TUNNEL_TOKEN: The Cloudflare tunnel token.
• CLOUDFLARED_VERSION: Pin a specific cloudflared version.

# Local setup
cd detox && npm run start:webhook

# Remote setup with custom tunnel
cd detox
SITE_1_URL="https://your-test-server" \
WEBHOOK_PUBLIC_BASE_URL="https://your-tunnel-hostname" \
bash scripts/start_webhook_sidecar.sh

When testing React components and screens:

Rendering

• Use renderWithEverything(ui, { database, serverUrl }) from @test/intl-test-helper if the component requires database or server context.
• Use renderWithIntlAndTheme(ui) if it only requires theme and internationalization.

Mocking

• Mock heavy dependencies like navigation, remote actions, or useServerUrl using jest.mock(...).
• Mocking child components:
  1. Mock the module with a factory returning { __esModule: true, default: jest.fn() }.
  2. Import the child component.
  3. Use jest.mocked(ChildComponent).mockImplementation((props) => React.createElement(View, { testID: '...', ...props })) to ensure the implementation runs in the test scope with access to React and View.

Assertions

• Assert on props: Query the screen for the element (e.g., getByTestId('...')) and use expect(element).toHaveProp('propName', value). Do not inspect jest.mocked(Component).mock.calls directly.
• User interactions: Use fireEvent.press() for buttons/toggles. Wrap async updates in act() or waitFor.