Skip to content

[Due for payment 2026-11-05] [$175] Expense - Report table in the background moves when pressing left or right arrow #105332

New issue
New issue
Closed
Closed
[Due for payment 2026-11-05] [$175] Expense - Report table in the background moves when pressing left or right arrow#105332
Assignees
arosiclairPujan92
Labels
BugSomething is broken. Auto assigns a BugZero manager.DailyKSv2EngineeringSkip PaymentSkips all the payment process steps for an issue. Use it for fixed-price projects.

Description

@applause-bot
applause-bot
bot
opened on Oct 29, 2026

If you haven’t already, check out our contributing guidelines for onboarding. To join our Slack channel, fill out this form.

Version Number: 9.5.25.0
Reproducible in staging?: Yes
Reproducible in production?: N/A - new feature, doesn't exist in prod
If this was caught during regression testing, add the test name, ID and link from BrowserStack: #104836
Email or phone of affected tester (no customers): jsdjnosjdiojsjio@gmail.com
Issue reported by: Applause Internal Team
Bug source: Exploratory - Significant User Experience Deterioration
Device used: Mac 26.5 / Chrome
App Component: Money Requests

Action Performed:

Precondition:

  • Enable Rules,
  • Enable Billable expenses in Rules.
  • Enable Tags.
  • Have at least one tag.
  1. Go to staging.new.expensify.com
  2. Go to workspace chat.
  3. Create two non-reimbursable expenses with tag in foreign curency.
  4. Open the report.
  5. Open any expense.
  6. Press left or right arrow a few times.

Expected Result:

Report table in the background will not move when pressing left or right arrow.

Actual Result:

Report table in the background moves when pressing left or right arrow.

Workaround:

Unknown

Platforms:

  • Android: App
  • Android: mWeb Chrome
  • iOS: App
  • iOS: mWeb Safari
  • iOS: mWeb Chrome
  • Windows: Chrome
  • MacOS: Chrome Safari

Screenshots/Videos

Bug7299359_1793243593243.6.mp4

View all open jobs on GitHub

Applause Internal Information
Exported by: Mita Rachim
Bug ID: 7299359

Upwork Automation - Do Not Edit
Issue OwnerCurrent Issue Owner: @Pujan92

Activity

  1. applause-bot commented on Oct 29, 2026

    @applause-bot
    applause-botBot
    on Oct 29, 2026
    Author

    While Applause doesn't embed attachments for this bug, here are the links for quick view:
    https://platform.applause.com/services/links/v1/external/975a236320f8cc1fb913be06a0c5300537b456e540dcd0ba73108caf046f6d6f

  2. applause-bot
    added
    DeployBlockerCashThis issue or pull request should block deployment
    BugSomething is broken. Auto assigns a BugZero manager.
    on Oct 29, 2026
  3. gleitebr
    added this to #expensify-bugson Oct 29, 2026

  4. melvin-bot commented on Oct 29, 2026

    @melvin-bot
    melvin-botBot
    on Oct 29, 2026 – with Melvin Bot

    You have been assigned to this deploy blocker because you recently merged this PR: #104836

  5. melvin-bot
    assigned
    arosiclair
    on Oct 29, 2026

  6. melvin-bot commented on Oct 29, 2026

    @melvin-bot
    melvin-botBot
    on Oct 29, 2026 – with Melvin Bot

    @arosiclair @Pujan92 you have been assigned to this deploy blocker because you reviewed the offending PR: #104836

  7. melvin-bot
    assigned
    Pujan92
    on Oct 29, 2026

  8. melvin-bot commented on Oct 29, 2026

    @melvin-bot
    melvin-botBot
    on Oct 29, 2026 – with Melvin Bot

    💬 A slack conversation has been started in #expensify-open-source

  9. github-actions
    added
    Engineering
    HourlyKSv2
    on Oct 29, 2026

  10. github-actions commented on Oct 29, 2026

    @github-actions
    github-actionsBot
    on Oct 29, 2026 – with GitHub Actions
    Contributor

    👋 Friendly reminder that deploy blockers are time-sensitive ⏱ issues! Check out the open `StagingDeployCash` deploy checklist to see the list of PRs included in this release, then work quickly to do one of the following:

    1. Identify the pull request that introduced this issue and revert it.
    2. Find someone who can quickly fix the issue.
    3. Fix the issue yourself.

  11. MelvinBot commented on Oct 29, 2026

    @MelvinBot
    MelvinBot
    on Oct 29, 2026
    Contributor

    Deploy Blocker Analysis

    Causing PR: Use the left and right arrow keys to move between expenses on a report (Expensify/App#104836). The auto-assignment is correct.

    Recommendation: Revert it. It is a self-contained, 7-file new feature that isn't in production, so the revert should be clean.

    Root cause: The new arrow-key shortcuts only register when a move is possible in that direction (MoneyRequestReportTransactionsNavigation.tsx:445-465). At the first or last expense, one shortcut is inactive, so that key press is not handled. The browser's default arrow-key scrolling then reaches the background report table.

    Confidence: high on the causing PR, medium on the exact mechanism. I read the code but did not reproduce the bug in the app.

    Investigation details

    Why the background table scrolls

    1. The test preconditions add billable, tag, and foreign-currency columns. These push the report table wider than the window, so it renders inside a horizontal ScrollView (useMoneyRequestReportColumns.ts:91-92, ExternalScrollFlashListTable.tsx:220-221). Without these columns, the table doesn't overflow and nothing moves.
    2. The PR stops the composer from auto-focusing in the expense view on web when the report has more than one expense (useShouldSkipComposerAutoFocus.ts:32). Before the PR, the focused composer absorbed arrow keys. Now nothing in the RHP has focus, so arrow keys reach the page.
    3. The shortcuts use isActive: isArrowKeyNavigationActive && canNavigateToPrevious and isActive: isArrowKeyNavigationActive && canNavigateToNext. With only two expenses, one direction is always inactive. Pressing that key, or pressing any arrow while isActive flips during navigation, falls through to the browser's default scroll.

    Other PRs checked: The investigator reviewed all 52 PRs on the deploy checklist for changes to the report table, keyboard shortcuts, or composer focus. Two touch nearby code, but neither handles arrow keys or navigation between expenses:

    Fix for the re-land

    • Register both shortcuts with isActive: isArrowKeyNavigationActive, without the canNavigateTo* condition.
    • Inside each callback, call event?.preventDefault() and return early when there is no previous or next expense.
    • Add a test that pressing an arrow at the first or last expense still blocks the browser default. The current test only checks that no navigation happens.

    Next Steps: Revert #104836, or reply with @MelvinBot <your feedback> to refine this analysis.

    view run

  12. Pujan92 commented on Oct 29, 2026

    @Pujan92
    Pujan92
    on Oct 29, 2026
    Contributor

    @MelvinBot As now we are not auto-focusing the composer input, the focus remains in the previous RHP screen, so when we are on edges and can't navigate to the sibling, the shortcut turns off and seems to cause the issue.

    For a fix, keep the shortcuts always on while navigation is active. At an edge, just do nothing inside the callback with using conditions canNavigateToPrevious and canNavigateToPrevious.

    Raise a PR and mark it ready for review

  13. melvin-bot
    added
    ReviewingHas a PR in review
    on Oct 29, 2026

  14. 2 remaining items

  15. melvin-bot commented on Oct 29, 2026

    @melvin-bot
    melvin-botBot
    on Oct 29, 2026 – with Melvin Bot

    Job added to Upwork: https://www.upwork.com/jobs/~022115680174066237125

  16. arosiclair commented on Oct 29, 2026

    @arosiclair
    arosiclair
    on Oct 29, 2026
    Contributor

    Merged the PR and requested a CP here

  17. m-natarajan commented on Oct 29, 2026

    @m-natarajan
    m-natarajan
    on Oct 29, 2026

    Not repro on Windows 10/Chrome/Build 9.5.25-2

    2026-10-29.19-16-20.mp4
  18. jasperhuangg
    closed this as completedon Oct 29, 2026
  19. github-project-automation
    moved this to Done in #expensify-bugson Oct 29, 2026
  20. github-actions
    removed
    DeployBlockerCashThis issue or pull request should block deployment
    on Oct 29, 2026
  21. melvin-bot
    added
    DailyKSv2
    and removed
    ReviewingHas a PR in review
    HourlyKSv2
    on Oct 29, 2026
  22. melvin-bot
    changed the title [-][$175] Expense - Report table in the background moves when pressing left or right arrow[/-] [+][Due for payment 2026-11-05] [$175] Expense - Report table in the background moves when pressing left or right arrow[/+] on Oct 29, 2026

  23. melvin-bot commented on Oct 29, 2026

    @melvin-bot
    melvin-botBot
    on Oct 29, 2026 – with Melvin Bot

    @Pujan92

    The solution for this issue has been 🚀 deployed to production 🚀 in version 9.5.25-2 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

    If no regressions arise, payment will be issued on 2026-11-05. 🎊

    The following checklist (instructions) will need to be completed before the issue can be closed. Please copy/paste the Contributor+ Checklist from here into a new comment on this GH and complete it. If you have the K2 extension, you can simply click: [this button]. If no checklist is needed for this issue, you can click: [no checklist button]

  24. arosiclair
    added
    Skip PaymentSkips all the payment process steps for an issue. Use it for fixed-price projects.
    on Oct 29, 2026

  25. kula-star commented on Oct 30, 2026

    @kula-star
    kula-star
    on Oct 30, 2026

    🛠️ Proposal: Keep expense arrow-key shortcuts active at structural boundaries

    Technical Analysis & Root Cause

    The bug is introduced because the left and right arrow key keyboard shortcuts are conditionally registered using boundary checks (isActive: isArrowKeyNavigationActive && canNavigateToPrevious / canNavigateToNext).
    When a user lands on the very first or very last expense item of a report, one of these directions naturally flags as false, immediately unbinding that shortcut instance. Because the text composer input is no longer holding active auto-focus, the unhandled arrow key event falls right through to the application container. The default browser behavior takes over, shifting focus and scrolling the wide background report table horizontally.

    Proposed Implementation Plan

    To fix this layout shifting behavior, we will keep the keyboard shortcuts continually bound throughout the entire lifecycle of the navigation context, but handle boundary restrictions internal to the event callbacks.

    1. Modify Shortcut Configurations: Keep both arrow navigation listeners continually registered under useKeyboardShortcut as long as isArrowKeyNavigationActive evaluates to true, removing the canNavigateTo... conditional from the activation rule object.
    2. Intercept Browser Execution Layers: Inside the respective navigation callback handlers, explicitly ingest the native UI KeyboardEvent.
    3. Short-Circuit Navigation Safe Boundaries: Invoke event?.preventDefault() immediately at the start of the execution step to explicitly swallow the keystroke and block default viewport scroll mechanisms. We will then check boundary flags (canNavigateToPrevious / canNavigateToNext) internally and early-return if a step in that direction is out of bounds.
      This isolates and neutralizes standard arrow-key navigation events cleanly at report boundaries, ensuring the background horizontal view remains completely stable.

  26. melvin-bot commented on Oct 30, 2026

    @melvin-bot
    melvin-botBot
    on Oct 30, 2026 – with Melvin Bot

    📣 @kula-star! 📣
    Hey, it seems we don’t have your contributor details yet! You'll only have to do this once, and this is how we'll hire you on Upwork.
    Please follow these steps:

    1. Make sure you've read and understood the contributing guidelines.
    2. Get the email address used to login to your Expensify account. If you don't already have an Expensify account, create one here. If you have multiple accounts (e.g. one for testing), please use your main account email.
    3. Get the link to your Upwork profile. It's necessary because we only pay via Upwork. You can access it by logging in, and then clicking on your name. It'll look like this. If you don't already have an account, sign up for one here.
    4. Copy the format below and paste it in a comment on this issue. Replace the placeholder text with your actual details.
      Screen Shot 2022-11-16 at 4 42 54 PM
      Format:
    Contributor details
Your Expensify account email: <REPLACE EMAIL HERE>
Upwork Profile Link: <REPLACE LINK HERE>

  27. kula-star commented on Oct 30, 2026

    @kula-star
    kula-star
    on Oct 30, 2026

    Expensify account email: greendream60606@gmail.com
    Upwork Profile Link: https://www.upwork.com/freelancers/~01887481b4bbe5e8fa

    Question: I stumbled across this project by accident. It looked interesting, so I left a comment with my thoughts on it. Since I’m a developer, I just focused on sharing my technical opinion rather than submitting a formal proposal. Do I still need to send an official proposal on Upwork? If that is necessary, I will send an official proposal message on Upwork.
    Thanks

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

Metadata

Metadata

Assignees

Labels

BugSomething is broken. Auto assigns a BugZero manager.DailyKSv2EngineeringSkip PaymentSkips all the payment process steps for an issue. Use it for fixed-price projects.

Type

No type

Projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions