[HOLD for payment 2024-10-14] [$250] Reopened my laptop and saw Uh oh, something's wrong!

[m-natarajan]

If you haven’t already, check out our contributing guidelines for onboarding and email [email protected] to request to join our Slack channel!

---

Version Number:
Reproducible in staging?: Needs Reproduction
Reproducible in production?: Needs Reproduction
If this was caught during regression testing, add the test name, ID and link from TestRail:
Email or phone of affected tester (no customers):
Logs: https://stackoverflow.com/c/expensify/questions/4856
Expensify/Expensify Issue URL:
Issue reported by: @quinthar
Slack conversation: https://expensify.slack.com/archives/C049HHMV9SM/p1726529947176339

Action Performed:

1. Leave the laptop in sleep/hibernation mode with www.staging.new.expensify.com open
2. Reopen the laptop after it was in sleep/hibernation mode.

Expected Result:

The staging environment should load normally without any error messages.

Actual Result:

The site displays the "Uh oh, something's wrong!" error upon access.

Workaround:

Unknown

Platforms:

Which of our officially supported platforms is this issue occurring on?

• Android: Native
• Android: mWeb Chrome
• iOS: Native
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Logs

Logs 1.txt

Logs 2.txt

Add any screenshot/video evidence

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021838649543194312084
• Upwork Job ID: 1838649543194312084
• Last Price Increase: 2024-10-01

Issue Owner

Current Issue Owner: @Christinadobrzyn

[melvin-bot]

Triggered auto assignment to @Christinadobrzyn (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

[MelvinBot]

This has been labelled "Needs Reproduction". Follow the steps here: https://stackoverflowteams.com/c/expensify/questions/16989

[rezkiy37]

Hi, I am Michael (Mykhailo) from Callstack, an expert agency and I can work on this issue.

[Christinadobrzyn]

I'm not going to be able to get to this today - I'll test tomorrow and let you know next steps @rezkiy37!

[rezkiy37]

We are internally discussing a solution to improve the page refresh.

[rezkiy37]

Hello!
I am OOO from 19.09 - 23.09. I will continue to work on this one when I am back.

[Christinadobrzyn]

@rezkiy37 is coming back in a few days - they'll continue the work then

[rezkiy37]

I am back 🙂

[rezkiy37]

I am preparing a proposal.

[Christinadobrzyn]

Thanks @rezkiy37 - I forgot to add a C+ so doing that now.

Side note, I'm going to be ooo until 9/30. I don't think we'll need a BZ teammate on this since we're working/reviewing proposals. So I'm just going to keep myself assigned. If you need someone, please reach out to the team in Slack for a volunteer. TY!

[melvin-bot]

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

[melvin-bot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @DylanDylann (External)

[rezkiy37]

Proposal

Please re-state the problem that we are trying to solve in this issue.

There is a problem with uploading and resolving some chunks from the server. It is a web and desktop issue. A user may have the application open in a browser tab during a new deployment. If so, the required JS file may no longer be available on your server. So they will receive an error when the browser tries to load the file.

What is the root cause of that problem?

The app does not reload the page when the user taps on the Refresh button it just rerenders the current DOM with outdated assets, bundle, etc.

What changes do you think we should make in order to solve the problem?

The app needs to reload the page to solve the problem that occurred due to the ChunkLoadError. Since the problem with the uploading of some chunks, the page needs to be fetched again from the server.

I am proposing to improve the Refresh button for the web and desktop. It will call window.location.reload() as well in a case when the "Something's wrong" view shows twice a minute. It means the first refresh has not helped. It guarantees the fetching of the latest updates and assets.

Video example

Refresh.mp4

What alternative solutions did you explore? (Optional)

1. Keep old files on your server after a deployment. The crucial disadvantage is to need to keep old files around and eventually clean them up after a safe period. Also, it changes the deployment process.

2. Service worker. A service worker can be used to cache your assets. It can then intercept requests to return the cached files rather than fetching them from the server. Disadvantages: the user will be served stale assets for a longer period after a deployment and service workers aren’t supported in older browsers, and it is a platform-specific change.

[DylanDylann]

I need some time to verify the solution. If we don't rush, I will complete in the next week

[Christinadobrzyn]

Update for Melvin- we're working on a solution

[DylanDylann]

I already checked your PR. In this comment #49340 (comment), In the react-error-boundary lib they already exposed onReset props for us to customize the logic. So I think using this prop will be better. Wdyt?

[rezkiy37]

@rezkiy37 are your PR ready?

Yes, almost done.

[rezkiy37]

I already checked your PR. In this comment #49340 (comment), In the react-error-boundary lib they already exposed onReset props for us to customize the logic. So I think using this prop will be better. Wdyt?

Yeah, I got your idea. However, we still need to split it up by platforms. So we will utilize some hook or function and create index.native.ts and index.ts. Moreover, we will apply it implicitly, because the app calls reset explicitly and a rerender is expected, but onReset needs to be declared in another file. I mean the app calls resetBoundary and it reloads the page as well which is weird because the app does not call reloadPage in GenericErrorPage.ts. It sounds like a side effect. That's my opinion. WDYT, @DylanDylann?

[DylanDylann]

Yeah, 2 ways are similar about the implementation. No problem if we continue on your way, let's open PR

[rezkiy37]

Cool, I will do it today 🙂

[rezkiy37]

Cool, I will do it today 🙂

Tomorrow.

[melvin-bot]

Triggered auto assignment to @justinpersaud, see https://stackoverflow.com/c/expensify/questions/7972 for more details.

[melvin-bot]

Reviewing label has been removed, please complete the "BugZero Checklist".

[melvin-bot]

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

• Improve refresh and reload when error occured #49341

If no regressions arise, payment will be issued on 2024-10-14. 🎊

For reference, here are some details about the assignees on this issue:

• @rezkiy37 does not require payment (Contractor)
• @DylanDylann requires payment (Needs manual offer from BZ)

[melvin-bot]

BugZero Checklist: The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed:

• [@DylanDylann] The PR that introduced the bug has been identified. Link to the PR:
• [@DylanDylann] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake. Link to comment:
• [@DylanDylann] A discussion in #expensify-bugs has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner. Link to discussion:
• [@DylanDylann] Determine if we should create a regression test for this bug.
• [@DylanDylann] If we decide to create a regression test for the bug, please propose the regression test steps to ensure the same bug will not reach production again.
• [@Christinadobrzyn] Link the GH issue for creating/updating the regression test once above steps have been agreed upon: https://github.com/Expensify/Expensify/issues/436834

[melvin-bot]

Payment Summary

Upwork Job

• Contributor: @rezkiy37 is from an agency-contributor and not due payment
• ROLE: @DylanDylann paid $250 via Upwork (https://www.upwork.com/nx/wm/offer/104422906)

BugZero Checklist (@Christinadobrzyn)

• I have verified the correct assignees and roles are listed above and updated the neccesary manual offers
• I have verified that there are no duplicate or incorrect contracts on Upwork for this job (https://www.upwork.com/ab/applicants/1838649543194312084/hired)
• I have paid out the Upwork contracts or cancelled the ones that are incorrect
• I have verified the payment summary above is correct

[Christinadobrzyn]

@DylanDylann would you mind accepting the offer - https://www.upwork.com/nx/wm/offer/104422906

Also, do we need a regression test for this?

[Christinadobrzyn]

Paid out based on this payment summary - #49340 (comment)

@DylanDylann can you let us know about a regression test?

[DylanDylann]

@Christinadobrzyn I am on it

[DylanDylann]

BugZero Checklist: The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed:

[@DylanDylann] The PR that introduced the bug has been identified. Link to the PR: This seems like a new improvement
[@DylanDylann] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake. Link to comment: NA
[@DylanDylann] A discussion in #expensify-bugs has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner. Link to discussion: NA
[@DylanDylann] Determine if we should create a regression test for this bug. Yes
[@DylanDylann] If we decide to create a regression test for the bug, please propose the regression test steps to ensure the same bug will not reach production again.

Regression Test Proposal

1. Leave the laptop in sleep/hibernation mode with www.staging.new.expensify.com open
2. Wait until there is a new deployment
3. Reopen the laptop after it was in sleep/hibernation mode.
4. Verify that the App is reloaded when clicking the second time on the refresh button

Do we agree 👍 or 👎

[Christinadobrzyn]

Awesome! Thanks @DylanDylann!

Regression test - https://github.com/Expensify/Expensify/issues/436834

I think we're good to close this!