JavaScript Click does not work on Google translate image

Question

I try to code JavaScript extension for translate an image which is in the windows clipboard. Site page web: https://translate.google.fr/?hl=fr&sl=auto&tl=fr&op=images

An image is already in the clipboard. When I execute the code JavaScript on console:

document.querySelector('[aria-label="Coller une image depuis le presse-papiers"]').click();

the button is found by JavaScript selector and click is done but a message says

impossible de coller le contenu du presse-papiers pour le moment. Ressayer de copier l'image" = "impossible to paste clipboard content at this time. Retry to copy the image"

If I click with the mouse on the button in the web page, it works... Why? How to do with JavaScript?

Help please / Thanks

Answer 1

Check if the following steps are done:

1. Do you close the DevTools in the tab of Google Translate web page?
2. Do Chrome focus on the tab of Google Translate when you execute click event?

---

Possible cause

This might be caused by the secure limit of navigator.clipboard API. According to the solution of: DOMException on calling navigator.clipboard.readText(), you have to ensure you are focus on the page view of Google Translate.

However, if you open the DevTools, Chrome detects that you don't focus on the page view.

How to focus page by Chrome Extensions API

To focus on the window:

chrome.windows.update(
  windowId,
  { focused: true }
);

To focus on the tab:

chrome.tabs.update(
  tabId,
  { active: true }
);

---

Here is a demo of auto pasting: Auto Paste Picture to Google Translate