Find-and-Replace-Browser-Extension
Find-and-Replace-Browser-Extension copied to clipboard
Does not work on Facebook and Messenger
Facebook uses contenteditables and keeps the text content in JavaScript variables (separately). When I insert my markup, and replace text, their JavaScript immediately restores the previous state (switches back to the orginal text). When I detach their JavaScript listeners by cloning the contenteditable DOM node, I'm able to highlight and replace text successfully and the user can continue editing, but when they click the post button, all changes made after the last search & replace operation are lost because the text that is posted is the content of their JavaScript variables, not the actual contenteditable content.
We can use Document.execCommand
but it is very unreliable and often replacing a piece of text ends up accidentally replacing everything (due to the JavaScript monitoring of their editable text area).
Document.execCommand
proved very unreliable, because execCommand
operates on the active cursor selection, which can be programmatically set by manipulating the Selection
object, but since there's no way to tell it to select only the text content itself it ended up deleting whole DOM tags and even after a lot of testing it wasn't reliably able to replace parts of text in a post and pass through all the automatic DOM manipulation that Facebook implements. Therefore, we disable the extension on Facebook and Messenger for now.