I'm trying to automate the submission of replies to my Steemit posts using plain JS or Jquery.

I used the javascript code below but the button remains disabled and therefore does not allow to post the reply/ment.

How can I correctly trigger keydown / keypress / keyup events on the textarea in order to simulate the user "classic" interaction to send a reply?

Thanks

Target example: /@gaottantacinque/happy-4th-of-july

In the Dev Tools console:

function nap (durationMs) {
  new Promise(resolve => setTimeout(() => resolve(), durationMs))
}

async function replyToPost() {
  var replyBtn = document.getElementsByClassName("PostFull__reply")[0]
    .getElementsByTagName('a')[0];
  replyBtn.click();
  await nap(1000);
  var textarea = document.getElementsByTagName('textarea')[0];
  const msg = 'My programmatically generated ment goes here';
  textarea.focus();
  textarea.click();
  textarea.value = msg; // textarea.innerHTML = msg; textarea.innerText = msg;
  await nap(100);
  var postReplyBtn = document.querySelectorAll('[type=submit]')[1];
  // postReplyBtn.disabled = false;
  postReplyBtn.click();
}

replyToPost();

Notes: This code fills the textarea but the button is still disabled. Simply manually clicking on the textarea and typing anything the button gets enabled instead.

Also, the textarea value inserted programmatically disappears after clicking for instance on the background but it does not when entered normally.

I'm trying to automate the submission of replies to my Steemit posts using plain JS or Jquery.

I used the javascript code below but the button remains disabled and therefore does not allow to post the reply/ment.

How can I correctly trigger keydown / keypress / keyup events on the textarea in order to simulate the user "classic" interaction to send a reply?

Thanks

Target example: https://steemit./usa/@gaottantacinque/happy-4th-of-july

In the Dev Tools console:

function nap (durationMs) {
  new Promise(resolve => setTimeout(() => resolve(), durationMs))
}

async function replyToPost() {
  var replyBtn = document.getElementsByClassName("PostFull__reply")[0]
    .getElementsByTagName('a')[0];
  replyBtn.click();
  await nap(1000);
  var textarea = document.getElementsByTagName('textarea')[0];
  const msg = 'My programmatically generated ment goes here';
  textarea.focus();
  textarea.click();
  textarea.value = msg; // textarea.innerHTML = msg; textarea.innerText = msg;
  await nap(100);
  var postReplyBtn = document.querySelectorAll('[type=submit]')[1];
  // postReplyBtn.disabled = false;
  postReplyBtn.click();
}

replyToPost();

Notes: This code fills the textarea but the button is still disabled. Simply manually clicking on the textarea and typing anything the button gets enabled instead.

Also, the textarea value inserted programmatically disappears after clicking for instance on the background but it does not when entered normally.

• javascript
• html
• reactjs
• automation
• steemit

• You should probably be sure to read the site's Terms of Service to be sure you can use bots; there's likely a reason they made it difficult to do this programmatically... – Heretic Monkey Commented Jul 6, 2018 at 20:39
• I'll double check but I don't think there's any problem with that. There are tons of bots and their use is encouraged by the munity.. – Gabe Commented Jul 6, 2018 at 20:40
• 1 In that case, programmatically triggering an event was asked previously: Triggering a keydown event programmatically in vanilla Javascript see if that works for you. – Heretic Monkey Commented Jul 6, 2018 at 20:41
• Steem bots are OK: steemit./steem/@earthnation/… – Gabe Commented Jul 6, 2018 at 20:42
• @HereticMonkey found the solution. It's a bug in ReactJs. – Gabe Commented Jul 7, 2018 at 4:57

2 Answers 2

After trying everything, I found out that the problem seems to be a bug in React on triggering onchange for textareas.

More info on the bug

There is a workaround..

Solution:

function setNativeValue(element, value) {
  const valueSetter = Object.getOwnPropertyDescriptor(element, 'value').set;
  const prototype = Object.getPrototypeOf(element);
  const prototypeValueSetter = Object.getOwnPropertyDescriptor(prototype, 'value').set;

  if (valueSetter && valueSetter !== prototypeValueSetter) {
    prototypeValueSetter.call(element, value);
  } else {
    valueSetter.call(element, value);
  }
}

var textarea = document.getElementsByTagName('textarea')[0];
setNativeValue(textarea, 'My automated ment here');
textarea.dispatchEvent(new Event('input', { bubbles: true }));

that might not work for some cases as it didn't for me but here's a general solution:

 const textarea = document.getElementsByTagName('textarea')[0]
function setNativeValue(element, value) {
  const { set: valueSetter } = Object.getOwnPropertyDescriptor(element, 'value') || {}
  const prototype = Object.getPrototypeOf(element)
  const { set: prototypeValueSetter } = Object.getOwnPropertyDescriptor(prototype, 'value') || {}

  if (prototypeValueSetter && valueSetter !== prototypeValueSetter) {
    prototypeValueSetter.call(element, value)
  } else if (valueSetter) {
    valueSetter.call(element, value)
  } else {
    throw new Error('The given element does not have a value setter')
  }
}
setNativeValue(textarea, 'some text')
textarea.dispatchEvent(new Event('input', { bubbles: true }))

i also wanna thank the previous person who posted about it ... it really helped a LOT

here is where i found it: