[HOLD for payment 2024-08-07] [$250] Android - Workspace - WS description with markdown is not shown correctly on opening preview

[lanitochka17]

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: 9.0.8
Reproducible in staging?: Y
Reproducible in production?: Y
If this was caught during regression testing, add the test name, ID and link from TestRail: https://expensify.testrail.io/index.php?/tests/view/4697842
Issue reported by: Applause - Internal Team

Action Performed:

1. Launch app
2. Tap profile icon -- Workspaces -- workspace
3. Tap description
4. Enter fhjj 57
5. Tap Save
6. Tap description again and note markdown shown as it was entered
7. Now change markdown as 😃 57
8. Tap save
9. Tap description again and note markdown

Expected Result:

Workspace description should be shown as 😃 57

Actual Result:

Workspace description should be shown as 😃 57 but displayed as _😃 57_

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

Bug6545580_1721244119403.Screenrecorder-2024-07-18-00-40-34-372_compress_1.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~0183f826d1418b3bc1
• Upwork Job ID: 1815267370451723401
• Last Price Increase: 2024-07-22
• Automatic offers:
• gijoe0295 | Contributor | 103221829

Issue Owner

Current Issue Owner: @VictoriaExpensify

[melvin-bot]

Triggered auto assignment to @VictoriaExpensify (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.

[lanitochka17]

We think that this bug might be related to #vip-vsp

[lanitochka17]

@VictoriaExpensify FYI I haven't added the External label as I wasn't 100% sure about this issue. Please take a look and add the label if you agree it's a bug and can be handled by external contributors

[gijoe0295]

Proposal

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

Workspace description should be shown as 😃 57 but displayed as 😃 57

What is the root cause of that problem?

Current: Input: <del><emoji>👿</emoji></del> <em>abc</em>. Output: ~_👿</emoji>~ abc_.

We see that the opening <emoji> tag is mistaken as <em>.

Let's take a look at the parsing regex taken from here:

/<(em|i)(?:"[^"]*"|'[^']*'|[^'">])*>([\s\S]*?)<\/\1>(?![^<]*(<\/pre>|<\/code>))/gi

• <(em|i) is the opening tag (i.e. <em or <i)
• (?:"[^"]*"|'[^']*'|[^'">])* is any other attributes within the opening tag where the [^'">] accounts for all characters except ^, ', " and >
• > is the closed bracket of the opening tag
• <\/\1> is the closing tag group

So obviously the problem is with the second group above where it covers all the cases where the tag name starts with either em or i as long as the closing tag is </em> or </i>, for example:

<emoji>abc</em>
<img>xyz</i>

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

The regex \bcat\b would therefore match cat in a black cat, but it wouldn't match it in catatonic, tomcat or certificate. Removing one of the boundaries, \bcat would match cat in catfish, and cat\b would match cat in tomcat, but not vice-versa.

Reference: https://www.rexegg.com/regex-boundaries.php#wordboundary

We should append word boundary to the tag names em and i:

<(em|i)\b

We don't need to prepend \b because they are already prepended with <.

We see that this issue can happens with any other tags, we should apply word boundary for them as well.

[melvin-bot]

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

[melvin-bot]

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

[VictoriaExpensify]

Able to recreate. Agree this best fits under vip_vsb

[parasharrajat]

So obviously the problem is with the second group above where it covers all the cases where the tag name starts with either em or i as long as the closing tag is or , for example:

This explanation is wrong as it \1 will only match the exact value captured in the first group. So if em is captured in first group then \1 only matched em not i.

Anyways, I think the main root cause explanation is correct. we can move ahead with this solution.

@gijoe0295 Here is what I want you to do in the PR.

1. Make changes to all possible rules to fix this issue.
2. Add more tests for this case.
3. Make sure all tests pass.
4. Make sure there is no performance impact.

Could you please share results for 3 & 4 before we assign you this issue? Thanks.

[gijoe0295]

@parasharrajat

1, 2 and 3: I added some test cases in Expensify/expensify-common#760 and re-run the test suites.

Note that we could never have those last 2 test cases in App because we always parse bold text by <strong> tag so we could opt in to apply the word boundary constraint for bold rule.

For 4, I tried running perf-test but it failed even on main:

TypeError: A dynamic import callback was invoked without --experimental-vm-modules
  code: 'ERR_VM_DYNAMIC_IMPORT_CALLBACK_MISSING_FLAG'
}

But my observation indicated that everything still work smoothly without any noticeable delay/performance impact.

[parasharrajat]

Great. Let's go then. @gijoe0295's proposal looks good to me.

🎀 👀 🎀 C+ reviewed

[melvin-bot]

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

[melvin-bot]

📣 @gijoe0295 🎉 An offer has been automatically sent to your Upwork account for the Contributor role 🎉 Thanks for contributing to the Expensify app!

Offer link
Upwork job
Please accept the offer and leave a comment on the Github issue letting us know when we can expect a PR to be ready for review 🧑‍💻
Keep in mind: Code of Conduct | Contributing 📖

[gijoe0295]

@parasharrajat PR Expensify/expensify-common#760 was merged. I wonder if I need to create an App PR to manually upgrade expensify-common version, or it would do automatically in the next release cycle.

[melvin-bot]

@cristipaval, @parasharrajat, @VictoriaExpensify, @gijoe0295 Whoops! This issue is 2 days overdue. Let's get this updated quick!

[parasharrajat]

@gijoe0295 Yes please, create a PR here to upgrade to new version

[gijoe0295]

@parasharrajat Should we upgrade to the latest version 2.0.57 or the version from our PR 2.0.56? https://github.com/Expensify/expensify-common/commits/main/

[parasharrajat]

I would say latest.

[melvin-bot]

⚠️ Looks like this issue was linked to a Deploy Blocker here

If you are the assigned CME please investigate whether the linked PR caused a regression and leave a comment with the results.

If a regression has occurred and you are the assigned CM follow the instructions here.

If this regression could have been avoided please consider also proposing a recommendation to the PR checklist so that we can avoid it in the future.

[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.14-6 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• Bump expensify-common to v2.0.57 #46321

If no regressions arise, payment will be issued on 2024-08-07. 🎊

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

• @parasharrajat requires payment through NewDot Manual Requests
• @gijoe0295 requires payment automatic offer (Contributor)

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

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

[parasharrajat]

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:

• [@parasharrajat] The PR that introduced the bug has been identified. Link to the PR: Issue was always present. It came to light after we added new rendering for emojis.
• [@parasharrajat] 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
• [@parasharrajat] 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
• [@parasharrajat] Determine if we should create a regression test for this bug. Yes
• [@parasharrajat] 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 Steps

1. Send this message:

 ~👿~ _abc_

5. Edit the message
6. Verify the message in edit composer matches the original message in step 1
7. Open workspace room
8. Change room description to the message in step 1 and save
9. Open room description page again
10. Verify the room description matches the original description in step 1

Do you agree 👍 or 👎 ?

[VictoriaExpensify]

@parasharrajat - were you able to identify the PR that caused this bug? Are you able to link it here? 🙏

[parasharrajat]

I could not find the PR where this issue starts to show up. Technically, this issue came to light from the new markdown input lib and I am not which version of it created this issue. There are many PRs where we updated the version of this lib so It more hassle than its worth. Also, the issue is caused due to the regex which was present since the start of the ExpensifyParser so I don't see point in finding a 3 years old PR.

[VictoriaExpensify]

No prob, thanks for your help and input @parasharrajat

[VictoriaExpensify]

Created a testrail GH - https://github.com/Expensify/Expensify/issues/418362

[VictoriaExpensify]

Payment Summary

Contributor: @gijoe0295 paid $250 via Upwork
Contributor+: @parasharrajat owed $250 via NewDot

[parasharrajat]

Payment requested as per #45635 (comment)

[JmillsExpensify]

$250 approved for @parasharrajat