Edit Message

Edit text and custom messages using the CometChat JavaScript SDK.

AI Integration Quick Reference

// Edit a text message
const textMessage = new CometChat.TextMessage(receiverID, "Updated text", receiverType);
textMessage.setId(messageId);
await CometChat.editMessage(textMessage);

// Listen for real-time edits
CometChat.addMessageListener("edits", new CometChat.MessageListener({
  onMessageEdited: (message) => console.log("Edited:", message)
}));

Editing a message is straightforward. Receiving edit events has two parts:

1. Adding a listener for real-time edits when your app is running
2. Fetching missed edits when your app was offline

Edit a Message

Use editMessage() with a TextMessage or CustomMessage object. Set the message ID using setId().

Add/Update Tags

Use setTags() to update tags when editing. New tags replace existing ones.

Text Message

let tags = ["pinnedMessage"];

textMessage.setTags(tags);  

Custom Message

let tags = ["pinnedMessage"];

customMessage.setTags(tags);

Text Message (Typescript)

let tags: Array<String> = ["pinnedMessage"];

textMessage.setTags(tags);

Custom Message (Typescript)

let tags: Array<String> = ["pinnedMessage"];

customMessage.setTags(tags);

Once the message object is ready, call editMessage().

Edit Message

let receiverID = "RECEIVER_UID";
let messageText = "Hello world!";
let receiverType = CometChat.RECEIVER_TYPE.USER;
let messageId = "MESSAGE_ID_OF_THE_MESSAGE_TO_BE_EDITED";
let textMessage = new CometChat.TextMessage(receiverID, messageText, receiverType);

textMessage.setId(messageId);

CometChat.editMessage(textMessage).then(
message => {
  console.log("Message Edited", message);
}, error => {
  console.log("Message editing failed with error:", error);
}
);

TypeScript

let receiverID: string = "RECEIVER_UID";
let messageText: string = "Hello world!";
let receiverType: string = CometChat.RECEIVER_TYPE.USER;
let messageId: number = 1;
let textMessage: CometChat.TextMessage = new CometChat.TextMessage(receiverID, messageText, receiverType);

textMessage.setId(messageId);

CometChat.editMessage(textMessage).then(
  (message: CometChat.TextMessage) => {
      console.log("Message Edited", message);
  }, (error: CometChat.CometChatException) => {
      console.log("Message editing failed with error:", error);
  }
);  

Async/Await

try {
  let receiverID = "RECEIVER_UID";
  let messageText = "Hello world!";
  let receiverType = CometChat.RECEIVER_TYPE.USER;
  let messageId = "MESSAGE_ID_OF_THE_MESSAGE_TO_BE_EDITED";
  let textMessage = new CometChat.TextMessage(receiverID, messageText, receiverType);

  textMessage.setId(messageId);

  const message = await CometChat.editMessage(textMessage);
  console.log("Message Edited", message);
} catch (error) {
  console.log("Message editing failed with error:", error);
}

The edited message object is returned with editedAt (timestamp) and editedBy (UID of editor) fields set.

The editMessage() method returns a BaseMessage object (or a subclass like TextMessage). Access the response data using getter methods:

Field	Getter	Return Type	Description
id	getId()	number	Unique message ID
text	getText()	string	Updated text content (TextMessage only)
sender	getSender()	User	The user who sent the message
editedAt	getEditedAt()	number	Timestamp when the message was edited
editedBy	getEditedBy()	string	UID of the user who edited the message

By default, CometChat allows certain roles to edit a message.

User Role	Conversation Type	Edit Capabilities
Message Sender	One-on-One Conversation	Messages they have sent.
Message Sender	Group Conversation	Messages they have sent.
Group Owner	Group Conversation	All messages in the group.
Group Moderator	Group Conversation	All messages in the group.

Real-time Message Edit Events

Use onMessageEdited in MessageListener to receive real-time edit events.

Message Listener

let listenerID = "UNIQUE_LISTENER_ID";

CometChat.addMessageListener(
listenerID,
new CometChat.MessageListener({
  onMessageEdited: message => {
    console.log("Edited Message", message);
  }
})
);

TypeScript

let listenerID: string = "UNIQUE_LISTENER_ID";

CometChat.addMessageListener(
listenerID,
new CometChat.MessageListener({
  onMessageEdited: (message: CometChat.BaseMessage) => {
    console.log("Edited Message", message);
  }
})
);

Always remove message listeners when they’re no longer needed (e.g., on component unmount or page navigation). Failing to remove listeners can cause memory leaks and duplicate event handling.

CometChat.removeMessageListener("UNIQUE_LISTENER_ID");

The onMessageEdited callback receives a BaseMessage object with the editedAt and editedBy fields set. Access the data using getter methods:

Field	Getter	Return Type	Description
id	getId()	number	Unique message ID
sender	getSender()	User	The user who sent the message
editedAt	getEditedAt()	number	Timestamp when the message was edited
editedBy	getEditedBy()	string	UID of the user who edited the message

Missed Message Edit Events

When fetching message history, edited messages have editedAt and editedBy fields set. Additionally, an Action message is created when a message is edited.

The Action object contains:

• action — edited
• actionOn — Updated message object
• actionBy — User who edited the message
• actionFor — Receiver (User/Group)

You must be the message sender or a group admin/moderator to edit a message.

---

Next Steps

Delete a Message

Remove messages from conversations

Send Messages

Send text, media, and custom messages

Threaded Messages

Organize conversations with message threads

Receive Messages

Listen for incoming messages in real time