Expensify Avatar Bug: Report Moves Offline

by Sebastian Müller 43 views

Hey guys! 👋 We've got an interesting issue to dive into today regarding how avatars are displayed when moving reports between workspaces while offline in the Expensify app. Let's break down the problem, the steps to reproduce it, and what we expect to see.

Issue Overview

So, the main problem here is that when you move a report from one workspace to another while you're offline, the report preview doesn't update to show the avatar of the new workspace right away. Instead, it stubbornly sticks with the avatar of the previous workspace. It's like the app is holding onto the old information until it gets an internet connection again. Once you're back online, the avatar finally updates to the correct one. This can be confusing for users, as they might not immediately recognize which workspace the report is in if the avatar is incorrect. Think about it: avatars are quick visual cues that help us identify things at a glance. When they're wrong, it throws us off and can lead to mistakes.

This issue was found in version 9.1.89-1 and is reproducible in the staging environment, but not in production. This is a good thing because it means we caught it before it affected our users in the live app. The issue was reported by the Applause Internal Team, so big thanks to them for spotting this! It was found during regression testing. The test case can be found on TestRail, so we have a clear record of the steps that led to the discovery of the bug. The affected tester used a Motorola MotoG60 running Android 12 with Chrome, both on the mWeb and Hybrid app versions, as well as on Windows 10 using Chrome. This gives us a good range of environments to consider when investigating the issue. It seems to affect users of the Money Requests component in Expensify. Money Requests are a crucial part of the app, so ensuring they function correctly is super important. When users create and manage expense reports, they need to trust that the information they're seeing is accurate and up-to-date. An incorrect avatar can erode that trust and make the app feel less reliable.

Steps to Reproduce

Okay, let's get into the nitty-gritty of how to reproduce this bug. This is crucial for developers to understand exactly what's going on and to verify the fix later. Imagine you are one of the developers tasked with fixing this issue. You'll want to follow these steps precisely to see the problem for yourself:

  1. Prerequisite: Make sure your account has at least two workspaces. This is essential because we need to move the report between workspaces to trigger the issue.
  2. Open the Expensify app: Pretty straightforward, right? Launch the app on your device or in your browser.
  3. Open any workspace chat: Navigate to one of your workspaces and open a chat within it. This is where we'll create the expense report.
  4. Submit a manual expense: Create a new expense report within the chat. This is the report we'll be moving later.
  5. Turn off internet connection: This is a key step! We need to simulate an offline environment to trigger the bug. Disable Wi-Fi and mobile data on your device.
  6. Open the just created expense: Find the expense report you just created and open it.
  7. Tap on "More" and select "Change Workspace": This is where we initiate the move to a different workspace.
  8. Select any workspace to send the expense to: Choose a different workspace from the one the report is currently in.
  9. Note that expense report, now shows the avatar of the new workspace.: (This is the expected behavior, but keep going to see the bug.)
  10. Navigate to the workspace where the report was moved: Go to the workspace you just moved the report to.
  11. Note that report preview, still shows the avatar of the previous workspace: Here's the bug! The report preview is displaying the avatar of the old workspace, not the new one.
  12. Turn on internet connection: Re-enable your internet connection.
  13. Note that avatar changes to the correct one now: The avatar should now update to the correct one for the new workspace. This confirms that the issue is related to being offline.

Following these steps meticulously will allow you to reliably reproduce the issue and understand the context in which it occurs.

Expected vs. Actual Result

Let's clearly define what we expect to happen versus what actually happens. This helps to highlight the discrepancy and solidify our understanding of the bug. When moving a report to another workspace, the expected result is that the avatar of the new workspace should be visible on the report preview immediately, regardless of whether the device is online or offline. This ensures a consistent user experience and prevents confusion. However, the actual result is that when moving a report to a different workspace while offline, the report preview stubbornly shows the avatar of the previous workspace. The correct avatar only appears after the device regains an internet connection. This delay in updating the avatar can be jarring for users and lead to misinterpretations about the report's location. We need to make sure the avatar updates correctly even when offline, providing a seamless experience for our users.

Workaround

Unfortunately, there's currently no known workaround for this issue. This means users who encounter this bug while offline will simply have to wait until they regain an internet connection to see the correct avatar. This underscores the importance of fixing this bug promptly, as it can impact user experience and create confusion. Until a fix is implemented, users may need to double-check the workspace name or other details to ensure they're looking at the correct report. This workaround, or lack thereof, highlights the need for a proper solution from the development team.

Platform Affected

This issue seems to be affecting a range of platforms, which means it's not isolated to a specific operating system or browser. It has been confirmed to occur on:

  • [x] Android: App
  • [x] Android: mWeb Chrome
  • [x] Windows: Chrome

It's important to note that the issue hasn't been confirmed on iOS (App, mWeb Safari, mWeb Chrome), MacOS (Chrome/Safari), or the MacOS Desktop app. This information is valuable for developers as they can focus their testing efforts on the platforms where the issue is known to exist. It also helps to prioritize the fix based on the number of affected users and platforms. We need to ensure a consistent experience across all platforms, so addressing this bug on Android and Windows is crucial. Further testing on iOS and MacOS may be necessary to ensure the issue doesn't exist there as well.

Visual Evidence

To further illustrate the issue, a screenshot/video has been provided:

https://github.com/user-attachments/assets/bbcbb299-50c7-42ab-b772-5897d30f0b3b

Visual evidence like this is incredibly helpful for developers. It allows them to see the issue firsthand and understand the user experience. A picture is worth a thousand words, as they say, and in this case, the screenshot clearly demonstrates the incorrect avatar display. This visual aid can speed up the debugging process and ensure that the fix addresses the root cause of the problem. It's a great practice to include screenshots or videos in bug reports whenever possible.

Contributing

If you're interested in contributing to Expensify and helping us fix issues like this, check out our contributing guidelines! We're always looking for talented developers to join our team and help us build the best expense management app out there. You can find our contributing guidelines here. We also encourage you to email [email protected] to request to join our Slack channel, where you can connect with other contributors and get help with your contributions. We're a friendly and welcoming community, and we'd love to have you on board! There are also plenty of open jobs on GitHub if you want to see where else you might be able to contribute: View all open jobs on GitHub

Conclusion

So, there you have it! We've thoroughly investigated the avatar display issue when moving reports offline. We've covered the steps to reproduce it, the expected versus actual results, the affected platforms, and even provided visual evidence. This comprehensive report should give the developers everything they need to tackle this bug head-on. Let's get this fixed and ensure a smooth user experience for everyone, even when they're offline!