Tzvi
Tzvi

Reputation: 343

Using javascript to evoke an event on Facebook.com

Facebook has a TextArea on top of every group page that allows users to post a message to the group, I have created a chrome extension that successfully adds text to that TextArea.

This extension will be used by my company to reduce work times on specific tasks.

On cases when the message contains a link, Facebook automatically adds a preview box that has metadata of the submitted URL, this does not occur when the TextArea is changed via $().value = "my text";

I have been trying to evoke this behavior and force it to create the link for my message using the chrome console / extension in many ways, the only thing that triggers it is actually typing in the TextArea (not using the code / chrome extension)

Using console / chrome extension, the value of the TextArea can be changed with this:

document.getElementsByName("xhpc_message_text")[0].focus();
document.getElementsByName("xhpc_message_text")[0].value = "I love www.stackoverflow.com";
document.getElementsByName("xhpc_message")[0].value      = "I love www.stackoverflow.com";

textarea

Would appreciate any help in simulating a real keypress that invokes the link preview or even directly invoking the link preview to achieve this behavior.

Upvotes: 0

Views: 239

Answers (1)

c.P.u1
c.P.u1

Reputation: 17094

HTMLElements don't have a keyup method. To trigger events programmatically, you'll have to use EventTarget.dispatchEvent. Since all HTMLElements are instances of EventTarget (HTMLElement.prototype instanceof EventTarget), you can do:

var keydown = new Event('keydown');
document.querySelector('[name=xhpc_message_text]').dispatchEvent(keydown);

Also note that Facebook previews a link only if it has more characters after the link.

var messageBox = document.querySelector('[name=xhpc_message_text]');
messageBox.dispatchEvent(new Event('focus'));
messageBox.value = 'www.stackoverflow.com ';
messageBox.dispatchEvent(new Event('keydown'));

Upvotes: 1

Related Questions