As Mark Zuckerberg was reported to have deleted messages from users’ inboxes, Facebook began developing a feature that would allow Facebook’s daily user to do the same. Last week, Facebook finally released a feature that allows users to delete everyone’s messages in a chat, not just yourself. Since the user has 10 minutes to delete a message, I wanted to see if it is possible to intercept messages before deleting them so that I can read them even after they have been deleted from my chat.
If you recall from my previous article, I was able to temporarily restore a gratitude response by connecting to Facebook’s React components and injecting my code via a Chrome extension. After inspecting and redesigning Messenger’s react components, I was able to capture new messages and recover deleted messages using the same procedures. Meet: Unsend Recall for Messenger. How does it work? In short, it intercepts the new messages you receive and stores them in the local memory of your browser. When someone deletes a message, it is retrieved from local storage and displayed. Simple, right? But how does it technically work? I will explain it below.
Let’s examine the DOM node of the deleted message first and then switch to the React tab in React Dev Tools to see the component.
As you can see in the screenshot above, the React component showing the deleted message (“You have deleted the message” on the left) is called Messenger Removed Message Tombstone. Sounds good .
If you search for “Removed Message Tombstone” in the Resources tab, you will find the source code for the module responsible for displaying the content in a deleted message, as shown in the following screenshot.
The get Tombstone Content method appears to return the text displayed in the Messenger Removed Message Tombstone component. By requesting the Removed Message Tombstone module, we can override the get Tombstone Content method and return what we want instead. If the deleted message is already saved in the local storage, we can simply recover it with this method and it will be displayed in the chat window. But how do we capture and store messages?
If you scroll up in the same source file, you’ll come across a module called Mercury ThreadIn former with a method called inform New Message.
It turns out that the inform New Message method does exactly what it sounds like: it notifies you when you receive a new message. Although the function parameters are hidden like “a” and “b”, you can see that the inform method assigns the thread Id to “a” and the message to “b”, so we know that the second parameter “b” is the target of the new message. We just need to ignore the inform New Message method and write our logic to keep the message in local memory.
Now that we have successfully captured the new messages and saved them to local storage, we can reset the get Tombstone Content hook method and return the message from local storage if it exists. And just like that, we can see the posts that people have deleted by letting our Chrome extension do all the hard work. As long as we have Facebook or Messenger on the browser, if someone sends us a message and then deletes it, we can see what they actually said.
Install Unsend Recall for the Messenger extension
Ready to remember what your Facebook friends’ deleted messages say? You can install the Chrome extension from the Chrome Web Store:
Open source on GitHub
Interested in how it really works? Feel free to check the source code: