[HOLD for payment 2024-10-17] [$250] Book travel - Book travel animation becomes blank while RHP is dismissed

@sakluger

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

Version Number: 9.0.40-0
Reproducible in staging?: Y
Reproducible in production?: N
If this was caught during regression testing, add the test name, ID and link from TestRail: N/A
Email or phone of affected tester (no customers): applausetester+kh230901@applause.expensifail.com
Issue reported by: Applause - Internal Team

Action Performed:

Go to staging.new.expensify.com
Open FAB
Click Book travel
Dismiss the RHP

Expected Result:

Book travel animation will not become blank while RHP is dismissed

Actual Result:

Book travel animation becomes blank while RHP is dismissed

Workaround:

Unknown

Platforms:

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

Screenshots/Videos

Add any screenshot/video evidence

Bug6615160_1727291080522.20240926_020845.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

Upwork Job URL: https://www.upwork.com/jobs/~021840763606281462254
Upwork Job ID: 1840763606281462254
Last Price Increase: 2024-09-30
Automatic offers:

suneox | Reviewer | 104245520

Issue Owner

Current Issue Owner: @

Issue Owner

Current Issue Owner: @sakluger

@MonilBhavsar

Triggered auto assignment to @MonilBhavsar (DeployBlockerCash), see https://stackoverflowteams.com/c/expensify/questions/9980/ for more details.

👋 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:

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

don't know what caused it, but def NOT A BLOCKER

This happens with all the animations, like on the wallet, security, and troubleshoot pages.

let's close 😄

Thanks for looking! Demoting from blocker, but let's try if we can fix it

Proposal

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

Default name in name field displays user/report ID instead of user/report name

What is the root cause of that problem?

This happens as we render an empty view here if the user has navigated away. The issue we set hasNavigatedAway quickly before the RHP animation has been completed. This then shows the user an empty view while RHP is dismissing.

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

We will change the state change here: to run after interactions, which will make it wait for the animation to be completed:

App/src/components/Lottie/index.tsx

Lines 82 to 88 in a4a344b

    
           // If the page navigates to another screen, the image fails to load, app is in background state, animation file isn't ready, or the splash screen isn't hidden yet, 
        
           // we'll just render an empty view as the fallback to prevent 
        
           // 1. memory leak, see issue: https://github.com/Expensify/App/issues/36645 
        
           // 2. heavy rendering, see issues: https://github.com/Expensify/App/issues/34696 and https://github.com/Expensify/App/issues/47273 
        
           // 3. lag on react navigation transitions, see issue: https://github.com/Expensify/App/issues/44812 
        
           if ( 
        
               hasNavigatedAway ||

InteractionManager.runAfterInteractions(() => {
    setHasNavigatedAway(true);
});

Result

Screen.Recording.2024-09-26.at.2.36.22.AM.mov

@MonilBhavsar

@MonilBhavsar @neonbhai the reasons mentioned here suggest that we should do nothing. Or it may cause issues 1, 2, 3

But I guess that is only the case when the image hasn't loaded

App/src/components/Lottie/index.tsx

Lines 82 to 88 in a4a344b

    
           // If the page navigates to another screen, the image fails to load, app is in background state, animation file isn't ready, or the splash screen isn't hidden yet, 
        
           // we'll just render an empty view as the fallback to prevent 
        
           // 1. memory leak, see issue: https://github.com/Expensify/App/issues/36645 
        
           // 2. heavy rendering, see issues: https://github.com/Expensify/App/issues/34696 and https://github.com/Expensify/App/issues/47273 
        
           // 3. lag on react navigation transitions, see issue: https://github.com/Expensify/App/issues/44812 
        
           if ( 
        
               hasNavigatedAway ||

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

@suneox

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

fix: Book travel - Book travel animation becomes blank while RHP is dismissed #50199

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

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

@suneox requires payment automatic offer (Reviewer)
@layacat requires payment (Needs manual offer from BZ)

@suneox

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:

[@suneox] The PR that introduced the bug has been identified. Link to the PR:
[@suneox] 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:
[@suneox] 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:
[@suneox] Determine if we should create a regression test for this bug.
[@suneox] 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.
[@sakluger] Link the GH issue for creating/updating the regression test once above steps have been agreed upon:

@layacat

Summarizing payment on this issue:

Contributor: @layacat $250, please apply to the Upwork job or comment with your Upwork profile
Contributor+: @suneox $250, paid via Upwork

@suneox please complete the BZ checklist.

@sakluger

Hi @sakluger I submitted work on Upwork, please check

@suneox

Checklist

[@suneox] The PR that introduced the bug has been identified. Link to the PR: Prevent Lottie from running in the background after navigating to other pages #47960
[@suneox] 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
[@suneox] 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: N/A
[@suneox] Determine if we should create a regression test for this bug: N/A
[@suneox] 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. N/A

@layacat

@layacat thanks! I didn't realize you had already applied. I sent an offer via Upwork.

I just submitted work for payment on Upwork. Please check

Perfect, thanks! All contracts have been paid out now.

Navigation Menu

Repository navigation

[HOLD for payment 2024-10-17] [$250] Book travel - Book travel animation becomes blank while RHP is dismissed #49744

Action Performed:

Expected Result:

Actual Result:

Workaround:

Platforms:

Screenshots/Videos

Proposal

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

What is the root cause of that problem?

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

Result

47 remaining items

Checklist

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

	// If the page navigates to another screen, the image fails to load, app is in background state, animation file isn't ready, or the splash screen isn't hidden yet,
	// we'll just render an empty view as the fallback to prevent
	// 1. memory leak, see issue: https://github.com/Expensify/App/issues/36645
	// 2. heavy rendering, see issues: https://github.com/Expensify/App/issues/34696 and https://github.com/Expensify/App/issues/47273
	// 3. lag on react navigation transitions, see issue: https://github.com/Expensify/App/issues/44812
	if (
	hasNavigatedAway \|\|

[HOLD for payment 2024-10-17] [$250] Book travel - Book travel animation becomes blank while RHP is dismissed #49744

Description

Action Performed:

Expected Result:

Actual Result:

Workaround:

Platforms:

Screenshots/Videos

Activity

melvin-bot commented on Sep 25, 2024

github-actions commented on Sep 25, 2024

rushatgabhane commented on Sep 25, 2024

Nodebrute commented on Sep 25, 2024

rushatgabhane commented on Sep 25, 2024

MonilBhavsar commented on Sep 25, 2024

neonbhai commented on Sep 25, 2024

Proposal

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

What is the root cause of that problem?

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

Result

rushatgabhane commented on Sep 25, 2024

47 remaining items

melvin-bot commented on Oct 10, 2024

melvin-bot commented on Oct 10, 2024

melvin-bot commented on Oct 10, 2024

sakluger commented on Oct 17, 2024

layacat commented on Oct 18, 2024

suneox commented on Oct 18, 2024

Checklist

sakluger commented on Oct 18, 2024

layacat commented on Oct 21, 2024

sakluger commented on Oct 21, 2024

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions