[WAITING ON CHECKLIST] [$500] Web - Emoji suggestions is not displayed between "~~" & "__"

[kbecciv]

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

---

Action Performed:

1. Open any report
2. Type ** then :jo in between **
3. Observe emoji suggestions is displayed
4. Type __ or ~~ then :jo in between __ or ~~
5. Observe emoji suggestions is not displayed

Expected Result:

Emoji suggestions should be displayed.

Actual Result:

Emoji suggestions is not displayed.

Workaround:

Unknown

Platforms:

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

• Android / native
• Android / Chrome
• iOS / native
• iOS / Safari
• MacOS / Chrome / Safari
• MacOS / Desktop

Version Number: 1.3.70.5
Reproducible in staging?: y
Reproducible in production?: y
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
Notes/Photos/Videos: Any additional supporting documentation

Monosnap.screencast.2023-09-16.07-26-31.mp4

Recording.4535.mp4

Expensify/Expensify Issue URL:
Issue reported by: @Krishna2323
Slack conversation: https://expensify.slack.com/archives/C049HHMV9SM/p1694829781444709

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~0167ad7e94902ca806
• Upwork Job ID: 1703139355938205696
• Last Price Increase: 2023-09-16

[melvin-bot]

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

[melvin-bot]

Triggered auto assignment to @jliexpensify (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details.

[melvin-bot]

Bug0 Triage Checklist (Main S/O)

• This "bug" occurs on a supported platform (ensure Platforms in OP are ✅)
• This bug is not a duplicate report (check E/App issues and #expensify-bugs)
  • If it is, comment with a link to the original report, close the issue and add any novel details to the original issue instead
• This bug is reproducible using the reproduction steps in the OP. S/O
  • If the reproduction steps are clear and you're unable to reproduce the bug, check with the reporter and QA first, then close the issue.
  • If the reproduction steps aren't clear and you determine the correct steps, please update the OP.
• This issue is filled out as thoroughly and clearly as possible
  • Pay special attention to the title, results, platforms where the bug occurs, and if the bug happens on staging/production.
• I have reviewed and subscribed to the linked Slack conversation to ensure Slack/Github stay in sync

[melvin-bot]

Triggered auto assignment to @sophiepintoraetz (External), see https://stackoverflow.com/c/expensify/questions/8582 for more details.

[melvin-bot]

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

[kbecciv]

Proposal by: @Krishna2323
Slack conversation: https://expensify.slack.com/archives/C049HHMV9SM/p1694829781444709

Proposal

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

Emoji suggestions is not displayed between "~~" & "__"

What is the root cause of that problem?

The function isEmojiCode splits the string based on the regex SPECIAL_CHAR_OR_EMOJI. This regex is designed to split the string on various special characters and emojis, but it didn't include the characters _ and ~.

App/src/pages/home/report/ReportActionCompose/SuggestionEmoji.js

Line 176 in 76c1559

const isCurrentlyShowingEmojiSuggestion = isEmojiCode(value, selectionEnd);

App/src/CONST.ts

Lines 1223 to 1225 in 76c1559

	SPECIAL_CHAR_OR_EMOJI:
	// eslint-disable-next-line no-misleading-character-class
	/[\n\s,/?"{}[\]()&^%\\;`$=#<>!*\p{Extended_Pictographic}\u200d\u{1f1e6}-\u{1f1ff}\u{1f3fb}-\u{1f3ff}\u{e0020}-\u{e007f}\u20E3\uFE0F]|[#*0-9]\uFE0F?\u20E3/gu,

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

By modifying the SPECIAL_CHAR_OR_EMOJI regex to include ~ and _, the function correctly splits the string, and the check for the emoji code works as expected.

Updated Regex:
/[\n\s,/?"{}[]()&^%\;`_~$=#<>!*\p{Extended_Pictographic}\u200d\u{1f1e6}-\u{1f1ff}\u{1f3fb}-\u{1f3ff}\u{e0020}-\u{e007f}\u20E3\uFE0F]|[#*0-9]\uFE0F?\u20E3/gu

We can add "~_" anywhere in between []

Result:

[Krishna2323]

Result:

fixed.mp4

[jliexpensify]

I'm not sure if this is intentional, but for ** (as an example) - you don't need a space:

However, for __ , you need to add a space to make the emoji picker show:

So it does work, it's just a matter of the space.

[Krishna2323]

@jliexpensify, it works for almost everything except "__" & "~~", you can try with "^^", "``", "**", "##", '""', "''".

[jliexpensify]

Yep, so if it's just __ and ~~ that exhibit this behaviour, that seems odd and inconsistent! So we should probably fix it - I was just pointing out that you need to add a space to generate the emoji picker.

[burczu]

I've checked the proposal from @Krishna2323 (posted by @kbecciv) and it fixes the issue so I think we can proceed with it.

🎀 👀 🎀 C+ reviewed

[melvin-bot]

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

[jliexpensify]

Bump @madmax330 for Contributor approval

[melvin-bot]

❌ There was an error making the offer to @Krishna2323 for the Contributor role. The BZ member will need to manually hire the contributor. cc @thienlnam

[melvin-bot]

❌ There was an error making the offer to @Krishna2323 for the Reporter role. The BZ member will need to manually hire the contributor. cc @thienlnam

[jliexpensify]

Hi @Krishna2323 - can you apply for the job here? https://www.upwork.com/jobs/~0167ad7e94902ca806

Also, please edit your GH profile details to reflect the same name in Upworks.

Thanks!

[jliexpensify]

Oh, got it - thanks! I'll remove you (I thought you Invoiced us though?)

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

• fix: Emoji suggestions is not displayed between '~~' & '__'. #27984

If no regressions arise, payment will be issued on 2023-10-09. 🎊

After the hold period is over and BZ checklist items are completed, please complete any of the applicable payments for this issue, and check them off once done.

• External issue reporter
• Contributor that fixed the issue
• Contributor+ that helped on the issue and/or PR

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

• @burczu does not require payment (Contractor)
• @Krishna2323 requires payment
• @Krishna2323 requires payment

As a reminder, here are the bonuses/penalties that should be applied for any External issue:

• Merged PR within 3 business days of assignment - 50% bonus
• Merged PR more than 9 business days after assignment - 50% penalty

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

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

[jliexpensify]

Payment summary

@burczu - bump to complete the checklist!

[jliexpensify]

Paid and job closed! @burczu please complete the checklist!

[melvin-bot]

@madmax330, @burczu, @jliexpensify, @Krishna2323 Uh oh! This issue is overdue by 2 days. Don't forget to update your issues!

[melvin-bot]

@madmax330 @burczu @jliexpensify @Krishna2323 this issue is now 4 weeks old and preventing us from maintaining WAQ, can you:

• Decide whether any proposals currently meet our guidelines and can be approved as-is today
• If no proposals meet that standard, please take this issue internal and treat it as one of your highest priorities
• If you have any questions, don't hesitate to start a discussion in #expensify-open-source

Thanks!

[melvin-bot]

Current assignee @burczu is eligible for the Internal assigner, not assigning anyone new.

[jliexpensify]

Bump @burczu please complete the checklist!

[jliexpensify]

Bump @burczu to complete the checklist please!

[burczu]

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:

• [@burczu] The PR that introduced the bug has been identified. Link to the PR: No regression - it was done this way from the very beginning.
• [@burczu] 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: n/a
• [@burczu] 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
• [@burczu] Determine if we should create a regression test for this bug.
• [@burczu] 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.
• [@jliexpensify] Link the GH issue for creating/updating the regression test once above steps have been agreed upon:

[jliexpensify]

Ok, no regression test needed? Closing!