Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[BUG] [MGT-CHAT] Receiving an emoji causes "a component is contentEditable and contains children managed by React" #3060

Closed
plasne opened this issue Feb 21, 2024 · 3 comments · Fixed by #3071
Closed

[BUG] [MGT-CHAT] Receiving an emoji causes "a component is contentEditable and contains children managed by React" #3060

plasne opened this issue Feb 21, 2024 · 3 comments · Fixed by #3071
Assignees
@gavinbarron
Labels
bug Something isn't working Components: mgt-chat Mgt chat related issues
Milestone
Chat - GA

Comments

@plasne
Copy link

plasne commented Feb 21, 2024

Describe the bug
Receiving an emoji raises an error message in the Chat component...

react-dom.development.js:67  Warning: A component is `contentEditable` and contains `children` managed by React. It is now your responsibility to guarantee that none of those nodes are unexpectedly modified or duplicated. This is probably not intentional.

To Reproduce
Steps to reproduce the behavior:

  1. Open the console in the browser dev tools.
  2. Open a chat in MGT
  3. Send an emoji from Teams
  4. See error

Expected behavior
I expect no errors when receiving content.

Screenshots
image

...results in...

image

Environment (please complete the following information):

  • OS: macOS Monterey 12.7.3
  • Browser: Edge
  • Framework: React
  • Context: Web
  • Version: MGT 4
  • Provider: Msal2Provider

Additional context
I am a MSFT FTE and can be reached at pelasne in Teams.
@plasne plasne added bug Something isn't working Needs: Triage 🔍 labels Feb 21, 2024
@github-project-automation github-project-automation bot moved this to Needs Triage 🔍 in Graph Toolkit Feb 21, 2024
@gavinbarron
Copy link
Member

@musale can you take a little time to investigate here? I'd like to understand what if this is due to the approach of using renderAsString.

@gavinbarron
Copy link
Member

@musale I found that removing the content editable attribute from the html we emit for the emoji seems to fix the problem, this will be in a PR that I'm about to raise.

gavinbarron added a commit that referenced this issue Feb 23, 2024
@gavinbarron
feat: add BotInfoClient and Provider
0929c17 
sets up a proivder model for getting Bot based data
refactor to create a base class for stateful clients
creates a new component for rendering chat avaatars that can handle bots

fix: stop creating two instances of the notification client

closes #3068

fix: remove contenteditable attribute from emjoi html

closes #3060
@gavinbarron gavinbarron mentioned this issue Feb 23, 2024
Merged
6 tasks
@gavinbarron gavinbarron linked a pull request Feb 23, 2024 that will close this issue
feat: bot names and avatars #3071
Merged
6 tasks
@sebastienlevert sebastienlevert moved this from Needs Triage 🔍 to Todo 📃 in Graph Toolkit Feb 27, 2024
@sebastienlevert sebastienlevert moved this from Todo 📃 to In Review 💭 in Graph Toolkit Feb 27, 2024
@gavinbarron gavinbarron self-assigned this Feb 28, 2024
@gavinbarron gavinbarron added this to the Chat - GA milestone Feb 29, 2024
@Mnickii Mnickii added the Components: mgt-chat Mgt chat related issues label Sep 4, 2024
@Mnickii
Copy link
Collaborator

Mnickii commented Sep 4, 2024

Closed in #3071

@Mnickii Mnickii closed this as completed Sep 4, 2024
@github-project-automation github-project-automation bot moved this from In Review 💭 to Done ✔️ in Graph Toolkit Sep 4, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@gavinbarron gavinbarron

Labels
bug Something isn't working Components: mgt-chat Mgt chat related issues
Projects
Graph Toolkit
Archived in project
Milestone
Chat - GA
Development

Successfully merging a pull request may close this issue.

feat: bot names and avatars microsoftgraph/microsoft-graph-toolkit
4 participants
@gavinbarron @sebastienlevert @plasne @Mnickii