Request - IOU preview is showing as blank in Scan module and Distance Module

[lanitochka17]

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: 1.4.9-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:
Email or phone of affected tester (no customers):
Logs: https://stackoverflow.com/c/expensify/questions/4856
Expensify/Expensify Issue URL:
Issue reported by: Applause - Internal Team
Slack conversation:

Action Performed:

1. Access staging.new.expensify.com
2. Sign into a valid account
3. Click on + > Request > Scan > Add any receipt/photo > Submit the Request
4. Tap on the IOU

Expected Result:

User expects to be able to see the IOU preview

Actual Result:

IOU preview shows as blank

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

Add any screenshot/video evidence

Bug6303688_1701898021571.Blank_IOU_in_Scan_flow.mp4

View all open jobs on GitHub

[github-actions]

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

[melvin-bot]

Triggered auto assignment to @blimpich (Engineering), see https://stackoverflow.com/c/expensify/questions/4319 for more details.

[ZhenjaHorbach]

Looks like a regression this PR
#13036

[blimpich]

@ZhenjaHorbach Can we confirm that PR is the problem, and if so why it is causing this issue?

[ZhenjaHorbach]

https://github.com/Expensify/App/blob/deda6ae510f1e1ef1599c8c6ee45d91fe58660c5/src/components/Image/BaseImage.js#L6C4-L12

As far as I can tell, the problem is related to the fact that we cannot get the width and height of the image we need

[blimpich]

Ah yeah I see, I'm currently testing locally if reverting that PR fixes the issue.

[ZhenjaHorbach]

This will help)
I already checked)

[situchan]

https://github.com/Expensify/App/blob/deda6ae510f1e1ef1599c8c6ee45d91fe58660c5/src/components/Image/BaseImage.js#L6C4-L12

As far as I can tell, the problem is related to the fact that we cannot get the width and height of the image we need

I got this but after npm install, issue gone

[ZhenjaHorbach]

Oh )
Yeah )
This really helps)
The necessary changes were in the patch))

[situchan]

I am not able to reproduce on main but staging. Seems like CORS issue
cc: @kidroca

[blimpich]

I also can't reproduce this locally. Not on main, and not when I switch to origin/staging (both 1.4.9-0 and 1.4.9-1). Can reproduce on staging.new.expensify.com. +1 to this being a CORS issue.

[blimpich]

@situchan should we wait for @kidroca to respond or is there a path forward to unblocking the deploy? I'm a bit brain-fried and not sure how to unblock this.

[situchan]

I think we can wait for @kidroca until tomorrow. If it won't be fixed by deploy time, we can always do quick solution which is straight revert.

[kidroca]

It seems the endpoint /receipts/{path} isn't configured for CORS the way the endpoint /chat-attachments/{path} was updated in the issue here:

• issue: Allow for preflight requests with OPTIONS method #14991
• see @justinpersaud comments near the end: Allow for preflight requests with OPTIONS method #14991 (comment)

I think whatever was done to make /chat-attachments/{path} comply with CORS should be done for the receipts route as well

[blimpich]

Attempting to solve CORS issue server side right now. Might not be able to move quickly enough though to prevent reverting.

[blimpich]

Making progress on the solution to this. Struggling with testing the solution locally to confirm I have the right solution.

[blimpich]

Getting closer to a solution. Testing it locally is difficult.

[blimpich]

I have a potential solution but I'm not able to successfully test it locally. I'm frustrated because this is definitely possible but I'm not able to move quickly enough to fix this. Going to revert to stop blocking the deploy. Sorry @kidroca. I will try to fix the underlying CORS issue so this can go through soon.

[blimpich]

PR was reverted: #32700. I will work to get the CORS issue fixed and update this thread when I can.

[blimpich]

Closing this issue since the PR was reverted. I will create a new issue for fixing the CORS and post the link to that issue here.

[blimpich]

New issue linked above.