Edit Message

Edit text and custom messages using the CometChat JavaScript SDK.

AI Integration Quick Reference

let receiverID = "UID";
let receiverType = CometChat.RECEIVER_TYPE.USER;
let messageId = "MESSAGE_ID";

// 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 (TypeScript)

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

textMessage.setTags(tags);

Text Message (JavaScript)

let tags = ["pinnedMessage"];

textMessage.setTags(tags);  

Custom Message (TypeScript)

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

customMessage.setTags(tags);

Custom Message (JavaScript)

let tags = ["pinnedMessage"];

customMessage.setTags(tags);

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

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);
  }
);  

JavaScript

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);
}
);

Alternatively, you can use the async/await syntax:

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).

Relevant fields to access on the returned message:

Field	Getter	Return Type	Description
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 users to edit a message.

Message editing in CometChat is controlled by -

User	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.

TypeScript

let listenerID: string = "UNIQUE_LISTENER_ID";

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

JavaScript

let listenerID = "UNIQUE_LISTENER_ID";

CometChat.addMessageListener(
listenerID,
new CometChat.MessageListener({
  onMessageEdited: message => {
    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.

Relevant fields to access on the returned message:

Field	Getter	Return Type	Description
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