[HOLD for payment 2024-04-15] HIGH: [Reliability] Enable console logging with four-finger tap

[quinthar]

Problem:

We've gotten very good at fixing bugs that can be reproduced in our dev environments. However, bugs we can't reproduce in dev are typically ignored -- even if they happen frequently in production. We have added better diagnostics tools via the About > Troubleshooting > Client side logging toggle. However, currently it takes you out of the context in which the bug is actually happening to enable. This means to use it you must:

1. Experience the bug
2. Leave that context to go to About > Troubleshooting > Client side logging
3. Enable client side logging
4. Go back to the original context
5. Try to reproduce the bug
6. Leave that context to go to About > Troubleshooting > Client side logging
7. Open the console
8. Save the file
9. Disable client side logging

In that whole process, the logs are filled with tons and tons of extraneous lines, making it very hard to isolate the problem -- assuming you can even reproduce it.

Solution:

Margelo recently added a "four finger tap" to enable low-level performance logging:

This works great because:

1. You can enable and disable right where you experiencing the problem, without needing to leave that context. This tightens up the focus on the actual problem period, avoiding extraneous sampling.
2. It automatically saves the file to local storage when disabled.

Let's expand that as follows:

1. Allow enabling/disabling the console log directly from the "four finger tap menu"
2. Automatically save the logs to disk when disabled (in either the four-finger menu, or in the About > Troubleshooting menu)
3. Show the filename that it was saved to, along with the platform Share button to share it (this is already being used for the profile traces, so let's use it for logs as well)

[quinthar]

@TMisiukiewicz hoping you can take this?

[TMisiukiewicz]

@quinthar sure, I should be able to work on this later this week 👍

[quinthar]

Great, so ETA Friday?

[TMisiukiewicz]

@quinthar yeah, I am about to start working on that tomorrow 👍 What if the client side logging in Troubleshoot section is enabled while you access the hidden menu, should it be just enabled or both of these features should work independently?

[TMisiukiewicz]

Opened a PR

[quinthar]

What if the client side logging in Troubleshoot section is enabled while you access the hidden menu, should it be just enabled or both of these features should work independently?

They should both control the same console, so if it's enabled in one, it should show as enabled in the other.

[melvin-bot]

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

[s77rt]

@amyevans Can you please assign me here?

[melvin-bot]

Triggered auto assignment to @twisterdotcom (NewFeature), see https://stackoverflowteams.com/c/expensify/questions/14418#:~:text=BugZero%20process%20steps%20for%20feature%20requests 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 1.4.60-13 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• feat: access client side logging from Test Tools Modal #38803

If no regressions arise, payment will be issued on 2024-04-15. 🎊

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

• @TMisiukiewicz does not require payment (Contractor)
• @s77rt requires payment (Needs manual offer from BZ)

[melvin-bot]

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

• [@s77rt] Please propose regression test steps to ensure the new feature will work correctly on production in further releases.
• [@twisterdotcom] Link the GH issue for creating/updating the regression test once above steps have been agreed upon.

[s77rt]

Regression Test Proposal

1. Press anywhere using 4 fingers (four-finger tap)
2. Verify that a debug modal is opened
3. Enable Client side logging
4. Close modal
5. Do any regular activity (e.g. open a report)
6. Open debug modal again (four-finger tap)
7. Disable Client side logging
8. Verify that a file path is displayed and the Share button is visible
9. Press the share button
10. Verify you are able to share the file

(Related https://expensify.testrail.io/index.php?/cases/view/2990265)

[twisterdotcom]

Payment Summary:

• @TMisiukiewicz does not require payment (Contractor)
• @s77rt paid $500 here