regression: custom emojis with mixed skin-tone names missing from search - #41553
regression: custom emojis with mixed skin-tone names missing from search#41553ricardogarim wants to merge 1 commit into
Conversation
|
Looks like this PR is not ready to merge, because of the following issues:
Please fix the issues and try again If you have any trouble, please check the PR guidelines |
WalkthroughEmoji search now applies mixed-tone filtering only to native emojis, while composer emoji popups share tone-aware matching logic. Unit coverage verifies custom emoji names containing mixed-tone suffixes remain searchable. ChangesEmoji tone filtering
Estimated code review effort: 3 (Moderate) | ~20 minutes Possibly related PRs
Suggested labels: 🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
Warning Review ran into problems🔥 ProblemsErrors were encountered while retrieving linked issues. Errors (2)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
|
There was a problem hiding this comment.
🧹 Nitpick comments (1)
apps/meteor/tests/end-to-end/api/emoji-custom.ts (1)
71-86: 🎯 Functional Correctness | 🔵 Trivial | ⚡ Quick winAdd an integration test for alias collisions.
This case only verifies
name: 'smile'. Add a request with a non-default name andaliases: 'smile'to cover the new[name, ...aliases]validation path end to end.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@apps/meteor/tests/end-to-end/api/emoji-custom.ts` around lines 71 - 86, Add a separate integration test alongside the existing default-name conflict case in the emoji custom API tests, posting a non-default emoji name with aliases set to “smile”. Assert the request returns HTTP 400 with success false and the existing Custom_Emoji_Error_Name_Or_Alias_Already_In_Use errorType, covering alias collision validation end to end.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Nitpick comments:
In `@apps/meteor/tests/end-to-end/api/emoji-custom.ts`:
- Around line 71-86: Add a separate integration test alongside the existing
default-name conflict case in the emoji custom API tests, posting a non-default
emoji name with aliases set to “smile”. Assert the request returns HTTP 400 with
success false and the existing Custom_Emoji_Error_Name_Or_Alias_Already_In_Use
errorType, covering alias collision validation end to end.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro Plus
Run ID: b08a0cbb-100c-496f-a30e-4f6da85af0e3
📒 Files selected for processing (4)
apps/meteor/app/emoji-native/lib/isDefaultEmoji.spec.tsapps/meteor/app/emoji-native/lib/isDefaultEmoji.tsapps/meteor/server/lib/media/emoji-custom/lib/insertOrUpdateEmoji.tsapps/meteor/tests/end-to-end/api/emoji-custom.ts
📜 Review details
⏰ Context from checks skipped due to timeout. (2)
- GitHub Check: 📦 Build Packages
- GitHub Check: CodeQL-Build
🧰 Additional context used
📓 Path-based instructions (2)
**/*.{ts,tsx,js}
📄 CodeRabbit inference engine (.cursor/rules/playwright.mdc)
**/*.{ts,tsx,js}: Write concise, technical TypeScript/JavaScript with accurate typing in Playwright tests
Avoid code comments in the implementation
Files:
apps/meteor/app/emoji-native/lib/isDefaultEmoji.spec.tsapps/meteor/app/emoji-native/lib/isDefaultEmoji.tsapps/meteor/tests/end-to-end/api/emoji-custom.tsapps/meteor/server/lib/media/emoji-custom/lib/insertOrUpdateEmoji.ts
**/*.spec.ts
📄 CodeRabbit inference engine (.cursor/rules/playwright.mdc)
**/*.spec.ts: Use descriptive test names that clearly communicate expected behavior in Playwright tests
Use.spec.tsextension for test files (e.g.,login.spec.ts)
Files:
apps/meteor/app/emoji-native/lib/isDefaultEmoji.spec.ts
🧠 Learnings (6)
📚 Learning: 2026-02-24T19:22:48.358Z
Learnt from: juliajforesti
Repo: RocketChat/Rocket.Chat PR: 38493
File: apps/meteor/tests/e2e/omnichannel/omnichannel-send-pdf-transcript.spec.ts:66-67
Timestamp: 2026-02-24T19:22:48.358Z
Learning: In Playwright end-to-end tests (e.g., under apps/meteor/tests/e2e/...), prefer locating elements by translated text (getByText) and ARIA roles (getByRole) over data-qa attributes. If translation values change, update the corresponding test locators accordingly. Never use data-qa locators. This guideline applies to all Playwright e2e test specs in the repository and helps keep tests robust to UI text changes and accessible semantics.
Applied to files:
apps/meteor/app/emoji-native/lib/isDefaultEmoji.spec.ts
📚 Learning: 2026-02-26T19:25:44.063Z
Learnt from: gabriellsh
Repo: RocketChat/Rocket.Chat PR: 38778
File: packages/ui-voip/src/providers/useMediaSession.ts:192-192
Timestamp: 2026-02-26T19:25:44.063Z
Learning: In the Rocket.Chat repository, do not reference Biome lint rules in code review feedback. Biome is not used even if biome.json exists; only reference Biome rules if there is explicit, project-wide usage documented. For TypeScript files, review lint implications without Biome guidance unless the project enables Biome rules.
Applied to files:
apps/meteor/app/emoji-native/lib/isDefaultEmoji.spec.tsapps/meteor/app/emoji-native/lib/isDefaultEmoji.tsapps/meteor/tests/end-to-end/api/emoji-custom.tsapps/meteor/server/lib/media/emoji-custom/lib/insertOrUpdateEmoji.ts
📚 Learning: 2026-02-26T19:25:44.063Z
Learnt from: gabriellsh
Repo: RocketChat/Rocket.Chat PR: 38778
File: packages/ui-voip/src/providers/useMediaSession.ts:192-192
Timestamp: 2026-02-26T19:25:44.063Z
Learning: In this repository (RocketChat/Rocket.Chat), Biome lint rules are not used even if a biome.json exists. When reviewing TypeScript files (e.g., packages/ui-voip/src/providers/useMediaSession.ts), ensure lint suggestions do not reference Biome-specific rules. Rely on general ESLint/TypeScript lint rules and project conventions instead.
Applied to files:
apps/meteor/app/emoji-native/lib/isDefaultEmoji.spec.tsapps/meteor/app/emoji-native/lib/isDefaultEmoji.tsapps/meteor/tests/end-to-end/api/emoji-custom.tsapps/meteor/server/lib/media/emoji-custom/lib/insertOrUpdateEmoji.ts
📚 Learning: 2026-03-06T18:10:15.268Z
Learnt from: tassoevan
Repo: RocketChat/Rocket.Chat PR: 39397
File: packages/gazzodown/src/code/CodeBlock.spec.tsx:47-68
Timestamp: 2026-03-06T18:10:15.268Z
Learning: In tests (especially those using testing-library/dom/jsdom) for Rocket.Chat components, the HTML <code> element has an implicit ARIA role of 'code'. Therefore, screen.getByRole('code') or screen.findByRole('code') will locate <code> elements even without a role attribute. Do not flag findByRole('code') as invalid in reviews; prefer using the implicit role instead of adding role="code" unless necessary for accessibility.
Applied to files:
apps/meteor/app/emoji-native/lib/isDefaultEmoji.spec.ts
📚 Learning: 2026-05-06T12:21:44.083Z
Learnt from: juliajforesti
Repo: RocketChat/Rocket.Chat PR: 40256
File: apps/meteor/client/components/CreateDiscussion/CreateDiscussion.tsx:121-149
Timestamp: 2026-05-06T12:21:44.083Z
Learning: Field wrappers in rocket.chat/fuselage-forms (Field, FieldLabel, FieldRow, FieldError, FieldHint) auto-create htmlFor/id associations, aria-describedby, and role="alert" for errors. Do not manually set htmlFor, id, aria-describedby, or role attributes when using these wrappers. This automatic wiring does not apply to plain rocket.chat/fuselage components, which require explicit ID wiring per the accessibility docs. In code reviews, prefer using fuselage-forms wrappers for form fields and verify there is no unnecessary manual ID/aria wiring in files that use these wrappers. If a component uses plain fuselage components, ensure proper id wiring as per docs.
Applied to files:
apps/meteor/app/emoji-native/lib/isDefaultEmoji.spec.tsapps/meteor/app/emoji-native/lib/isDefaultEmoji.tsapps/meteor/tests/end-to-end/api/emoji-custom.tsapps/meteor/server/lib/media/emoji-custom/lib/insertOrUpdateEmoji.ts
📚 Learning: 2026-07-22T19:03:06.706Z
Learnt from: KevLehman
Repo: RocketChat/Rocket.Chat PR: 41520
File: apps/meteor/app/emoji-native/lib/getEmojiConfig.ts:59-62
Timestamp: 2026-07-22T19:03:06.706Z
Learning: In Rocket.Chat’s native emoji pipeline, keep the legacy-parity behavior for ASCII emoticons that appear inside `<code>`/`<pre>`: `apps/meteor/app/emoji-native/lib/getEmojiConfig.ts` may convert matching ASCII emoticons into emoji-span nodes, but the downstream DOM pass in `apps/meteor/app/emoji/client/emojiParser.ts` must restore the emoji span’s literal `title` text when the span’s parent is a `CODE` element. When changing emoji config or parsing, ensure this `<code>` protection behavior is preserved; the planned structural HTML protection should be handled by the post-release message-parser/gazzodown migration rather than by removing/altering this restore logic ad-hoc.
Applied to files:
apps/meteor/app/emoji-native/lib/isDefaultEmoji.spec.tsapps/meteor/app/emoji-native/lib/isDefaultEmoji.ts
🔇 Additional comments (3)
apps/meteor/app/emoji-native/lib/isDefaultEmoji.spec.ts (1)
1-24: LGTM!apps/meteor/server/lib/media/emoji-custom/lib/insertOrUpdateEmoji.ts (1)
6-6: LGTM!Also applies to: 72-79
apps/meteor/app/emoji-native/lib/isDefaultEmoji.ts (1)
4-12: 🎯 Functional CorrectnessNo change needed.
Codecov Report❌ Patch coverage is Additional details and impacted files@@ Coverage Diff @@
## release-8.7.0 #41553 +/- ##
=================================================
- Coverage 68.62% 68.61% -0.01%
=================================================
Files 4138 4138
Lines 159417 159429 +12
Branches 28197 28235 +38
=================================================
+ Hits 109392 109399 +7
- Misses 44885 44888 +3
- Partials 5140 5142 +2
Flags with carried forward coverage won't be shown. Click here to find out more. 🚀 New features to boost your workflow:
|
de41c64 to
1a28031
Compare
1a28031 to
dc1bb21
Compare
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
apps/meteor/client/views/room/providers/ComposerPopupProvider.tsx (1)
41-51: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winAdd direct coverage for the shared composer matcher.
The new regression test exercises
getEmojisBySearchTerm, butmatchesEmojiSuggestionnow controls both composer popup paths. Add cases for custom mixed-tone IDs and native mixed-tone IDs with no, matching, and mismatching tones.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@apps/meteor/client/views/room/providers/ComposerPopupProvider.tsx` around lines 41 - 51, Add direct tests for matchesEmojiSuggestion covering custom mixed-tone IDs and native mixed-tone IDs with no tone, matching tone, and mismatching tone, including the expected boolean result for each case. Keep the existing getEmojisBySearchTerm regression coverage and exercise the matcher’s custom-package and tone-filter branches directly.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@apps/meteor/tests/unit/app/emoji/helpers.spec.ts`:
- Around line 32-44: Update the test setup around registerCustomEmoji to restore
the shared emoji registry after each test, including the added emoji.list entry
and any newly created or modified emojiCustom category/package state. Use the
existing test lifecycle hooks or snapshot/restore approach, preserving the
registry exactly as it was before the test.
---
Nitpick comments:
In `@apps/meteor/client/views/room/providers/ComposerPopupProvider.tsx`:
- Around line 41-51: Add direct tests for matchesEmojiSuggestion covering custom
mixed-tone IDs and native mixed-tone IDs with no tone, matching tone, and
mismatching tone, including the expected boolean result for each case. Keep the
existing getEmojisBySearchTerm regression coverage and exercise the matcher’s
custom-package and tone-filter branches directly.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro Plus
Run ID: 0943c7b6-7a24-4e51-965b-29695f592a86
📒 Files selected for processing (3)
apps/meteor/app/emoji/client/helpers.tsapps/meteor/client/views/room/providers/ComposerPopupProvider.tsxapps/meteor/tests/unit/app/emoji/helpers.spec.ts
📜 Review details
⏰ Context from checks skipped due to timeout. (8)
- GitHub Check: cubic · AI code reviewer
- GitHub Check: Hacktron Security Check
- GitHub Check: 🔎 Code Check / Code Lint
- GitHub Check: 🔨 Test Unit / Unit Tests
- GitHub Check: 🔎 Code Check / TypeScript
- GitHub Check: 📦 Meteor Build (coverage)
- GitHub Check: CodeQL-Build
- GitHub Check: CodeQL-Build
⚠️ CI failures not shown inline (4)
GitHub Check: Dionisio QA: Some checks did not pass
Conclusion: failure
**Conclusion:** failure
### Steps
- ✅ **No merge conflicts**
- ❌ **QA assured** — This PR is missing the 'stat: QA assured' label
- ✅ **Mergeable**
- ✅ **Has milestone or project**
- ✅ **Valid PR title**
- ✅ **Correct target version**
GitHub Check: Dionisio QA: Some checks did not pass
Conclusion: failure
**Conclusion:** failure
### Steps
- ✅ **No merge conflicts**
- ❌ **QA assured** — This PR is missing the 'stat: QA assured' label
- ✅ **Mergeable**
- ✅ **Has milestone or project**
- ✅ **Valid PR title**
- ✅ **Correct target version**
GitHub Check: Dionisio QA: Some checks did not pass
Conclusion: failure
**Conclusion:** failure
### Steps
- ✅ **No merge conflicts**
- ❌ **QA assured** — This PR is missing the 'stat: QA assured' label
- ✅ **Mergeable**
- ✅ **Has milestone or project**
- ✅ **Valid PR title**
- ✅ **Correct target version**
GitHub Check: Dionisio QA: Some checks did not pass
Conclusion: failure
**Conclusion:** failure
### Steps
- ✅ **No merge conflicts**
- ❌ **QA assured** — This PR is missing the 'stat: QA assured' label
- ✅ **Mergeable**
- ✅ **Has milestone or project**
- ✅ **Valid PR title**
- ✅ **Correct target version**
🧰 Additional context used
📓 Path-based instructions (2)
**/*.{ts,tsx,js}
📄 CodeRabbit inference engine (.cursor/rules/playwright.mdc)
**/*.{ts,tsx,js}: Write concise, technical TypeScript/JavaScript with accurate typing in Playwright tests
Avoid code comments in the implementation
Files:
apps/meteor/tests/unit/app/emoji/helpers.spec.tsapps/meteor/app/emoji/client/helpers.tsapps/meteor/client/views/room/providers/ComposerPopupProvider.tsx
**/*.spec.ts
📄 CodeRabbit inference engine (.cursor/rules/playwright.mdc)
**/*.spec.ts: Use descriptive test names that clearly communicate expected behavior in Playwright tests
Use.spec.tsextension for test files (e.g.,login.spec.ts)
Files:
apps/meteor/tests/unit/app/emoji/helpers.spec.ts
🧠 Learnings (7)
📚 Learning: 2026-02-24T19:22:48.358Z
Learnt from: juliajforesti
Repo: RocketChat/Rocket.Chat PR: 38493
File: apps/meteor/tests/e2e/omnichannel/omnichannel-send-pdf-transcript.spec.ts:66-67
Timestamp: 2026-02-24T19:22:48.358Z
Learning: In Playwright end-to-end tests (e.g., under apps/meteor/tests/e2e/...), prefer locating elements by translated text (getByText) and ARIA roles (getByRole) over data-qa attributes. If translation values change, update the corresponding test locators accordingly. Never use data-qa locators. This guideline applies to all Playwright e2e test specs in the repository and helps keep tests robust to UI text changes and accessible semantics.
Applied to files:
apps/meteor/tests/unit/app/emoji/helpers.spec.ts
📚 Learning: 2026-02-26T19:25:44.063Z
Learnt from: gabriellsh
Repo: RocketChat/Rocket.Chat PR: 38778
File: packages/ui-voip/src/providers/useMediaSession.ts:192-192
Timestamp: 2026-02-26T19:25:44.063Z
Learning: In the Rocket.Chat repository, do not reference Biome lint rules in code review feedback. Biome is not used even if biome.json exists; only reference Biome rules if there is explicit, project-wide usage documented. For TypeScript files, review lint implications without Biome guidance unless the project enables Biome rules.
Applied to files:
apps/meteor/tests/unit/app/emoji/helpers.spec.tsapps/meteor/app/emoji/client/helpers.ts
📚 Learning: 2026-02-26T19:25:44.063Z
Learnt from: gabriellsh
Repo: RocketChat/Rocket.Chat PR: 38778
File: packages/ui-voip/src/providers/useMediaSession.ts:192-192
Timestamp: 2026-02-26T19:25:44.063Z
Learning: In this repository (RocketChat/Rocket.Chat), Biome lint rules are not used even if a biome.json exists. When reviewing TypeScript files (e.g., packages/ui-voip/src/providers/useMediaSession.ts), ensure lint suggestions do not reference Biome-specific rules. Rely on general ESLint/TypeScript lint rules and project conventions instead.
Applied to files:
apps/meteor/tests/unit/app/emoji/helpers.spec.tsapps/meteor/app/emoji/client/helpers.ts
📚 Learning: 2026-03-06T18:10:15.268Z
Learnt from: tassoevan
Repo: RocketChat/Rocket.Chat PR: 39397
File: packages/gazzodown/src/code/CodeBlock.spec.tsx:47-68
Timestamp: 2026-03-06T18:10:15.268Z
Learning: In tests (especially those using testing-library/dom/jsdom) for Rocket.Chat components, the HTML <code> element has an implicit ARIA role of 'code'. Therefore, screen.getByRole('code') or screen.findByRole('code') will locate <code> elements even without a role attribute. Do not flag findByRole('code') as invalid in reviews; prefer using the implicit role instead of adding role="code" unless necessary for accessibility.
Applied to files:
apps/meteor/tests/unit/app/emoji/helpers.spec.ts
📚 Learning: 2026-05-06T12:21:44.083Z
Learnt from: juliajforesti
Repo: RocketChat/Rocket.Chat PR: 40256
File: apps/meteor/client/components/CreateDiscussion/CreateDiscussion.tsx:121-149
Timestamp: 2026-05-06T12:21:44.083Z
Learning: Field wrappers in rocket.chat/fuselage-forms (Field, FieldLabel, FieldRow, FieldError, FieldHint) auto-create htmlFor/id associations, aria-describedby, and role="alert" for errors. Do not manually set htmlFor, id, aria-describedby, or role attributes when using these wrappers. This automatic wiring does not apply to plain rocket.chat/fuselage components, which require explicit ID wiring per the accessibility docs. In code reviews, prefer using fuselage-forms wrappers for form fields and verify there is no unnecessary manual ID/aria wiring in files that use these wrappers. If a component uses plain fuselage components, ensure proper id wiring as per docs.
Applied to files:
apps/meteor/tests/unit/app/emoji/helpers.spec.tsapps/meteor/app/emoji/client/helpers.tsapps/meteor/client/views/room/providers/ComposerPopupProvider.tsx
📚 Learning: 2026-07-22T19:03:06.706Z
Learnt from: KevLehman
Repo: RocketChat/Rocket.Chat PR: 41520
File: apps/meteor/app/emoji-native/lib/getEmojiConfig.ts:59-62
Timestamp: 2026-07-22T19:03:06.706Z
Learning: In Rocket.Chat’s native emoji pipeline, keep the legacy-parity behavior for ASCII emoticons that appear inside `<code>`/`<pre>`: `apps/meteor/app/emoji-native/lib/getEmojiConfig.ts` may convert matching ASCII emoticons into emoji-span nodes, but the downstream DOM pass in `apps/meteor/app/emoji/client/emojiParser.ts` must restore the emoji span’s literal `title` text when the span’s parent is a `CODE` element. When changing emoji config or parsing, ensure this `<code>` protection behavior is preserved; the planned structural HTML protection should be handled by the post-release message-parser/gazzodown migration rather than by removing/altering this restore logic ad-hoc.
Applied to files:
apps/meteor/app/emoji/client/helpers.ts
📚 Learning: 2026-03-27T14:52:56.865Z
Learnt from: dougfabris
Repo: RocketChat/Rocket.Chat PR: 39892
File: apps/meteor/client/views/room/contextualBar/Threads/Thread.tsx:150-155
Timestamp: 2026-03-27T14:52:56.865Z
Learning: In Rocket.Chat, there are two different `ModalBackdrop` components with different prop APIs. During review, confirm the import source: (1) `rocket.chat/fuselage` `ModalBackdrop` uses `ModalBackdropProps` based on `BoxProps` (so it supports `onClick` and other Box/DOM props) and does not have an `onDismiss` prop; (2) `rocket.chat/ui-client` `ModalBackdrop` uses a narrower props interface like `{ children?: ReactNode; onDismiss?: () => void }` and handles Escape keypress and outside mouse-up, and it does not forward arbitrary DOM props such as `onClick`. Flag mismatched props (e.g., `onDismiss` passed to the fuselage component or `onClick` passed to the ui-client component) and ensure the usage matches the correct component being imported.
Applied to files:
apps/meteor/client/views/room/providers/ComposerPopupProvider.tsx
🔇 Additional comments (3)
apps/meteor/app/emoji/client/helpers.ts (1)
183-192: LGTM!apps/meteor/tests/unit/app/emoji/helpers.spec.ts (1)
91-94: LGTM!apps/meteor/client/views/room/providers/ComposerPopupProvider.tsx (1)
224-224: LGTM!Also applies to: 262-262, 282-282, 317-317
There was a problem hiding this comment.
All reported issues were addressed across 3 files
Reply with feedback, questions, or to request a fix.
Re-trigger cubic
Proposed changes (including videos or screenshots)
Custom emojis whose name ends in a mixed skin-tone suffix (
_tone[1-5]-[1-5], e.g.myemoji_tone1-2) are created fine and show when browsing the custom category, but never appear in emoji search — neither in the picker search nor the composer:autocomplete.Root cause: the search/autocomplete code detects native skin-tone variants by pattern-matching the emoji name, and hides them unless the matching tone is selected. Custom emoji names are literal, so a custom name shaped like a tone variant was wrongly filtered out. Fixed by scoping that tone handling to native emojis only.
getEmojisBySearchTerm): the mixed-tone skip and the category-name stripping now apply only when the emoji belongs to thenativepackage. Custom emojis keep their full literal name, so they resolve in their category and surface in results.ComposerPopupProvider): the duplicated filter in the:and+:popups was extracted into a singlematchesEmojiSuggestionpredicate that skips the native skin-tone filtering for custom emojis.Native emojis are unaffected — the existing "excludes skin-tone variants from search" behavior is unchanged.
Issue(s)
CORE-2473
Steps to test or reproduce
myemoji_tone1-2(or any name ending in_tone[1-5]-[1-5]).myemoji_tone1-2→ it now appears and is selectable.:myemoji_tone1-2→ it now appears in the autocomplete.+1) still does not list its_tonevariants.Further comments
Summary by CodeRabbit