Chrome 扩展程序中的模拟点击

Question

我正在制作一个 chrome 扩展。此扩展的一部分需要能够模拟点击以激活页面上的 onClick 事件。下面是后台脚本的代码：

function checkForValidUrl(tabId, changeInfo, tab) {
  // If the letter 'g' is found in the tab's URL...
  if (tab.url.indexOf('maps') > -1 && tab.url.indexOf('google') > -1) {
    // ... show the page action.
    chrome.pageAction.show(tabId);

  }
};

// Listen for any changes to the URL of any tab.
chrome.tabs.onUpdated.addListener(checkForValidUrl);


chrome.pageAction.onClicked.addListener(function() {
    document.getElementById("paneltoggle2").click();
});

这是我从 chrome 的 java 脚本调试中得到的错误消息：

Error in event handler for 'pageAction.onClicked': Cannot call method 'click' of null TypeError: Cannot call method 'click' of null
    at chrome-extension://deogcaeekneeagffbhdlflichjlodlem/js/main.js:26:42
    at chrome.Event.dispatchToListener (event_bindings:387:21)
    at chrome.Event.dispatch_ (event_bindings:373:27)
    at dispatchArgs (event_bindings:249:22)
    at Object.chromeHidden.Event.dispatchEvent (event_bindings:257:7) event_bindings:377
chrome.Event.dispatch_ event_bindings:377
dispatchArgs event_bindings:249
chromeHidden.Event.dispatchEvent event_bindings:257

我猜这与清单文件中的权限有关...现在我只有“选项卡”的权限。为了模拟点击而不出现错误，我需要激活其他一些权限吗？哦，我正在尝试使用第 2 版清单协议来实现这一点。

谢谢， 莱纳多

Answer 1

扩展和页面的脚本执行环境不同。

使用chrome.tabs.executeScript

例如，将一些文本粘贴到 Google 搜索字段

文件：manifest.json

{
    "name": "My Test",
    "version": "1",
    "manifest_version": 2,
    "background": {
        "scripts": ["background.js"]
    },
    "page_action": {
        "default_icon": "icon.png"
    },
    "permissions": ["tabs", "http://*/*", "https://*/*"]
}

文件：background.js

function checkForValidUrl(tabId, changeInfo, tab) {
    if (tab.url.indexOf("g") > -1) {
        chrome.pageAction.show(tabId);
    }
}

chrome.tabs.onUpdated.addListener(checkForValidUrl);

chrome.pageAction.onClicked.addListener(function(tab) {
    chrome.tabs.executeScript(tab.id, {code: "document.getElementById('gbqfq').value = 'Hello World!';"});
});

在清单文件中需要主机权限 ("http://*/*")。

但如果问题完全是关于 JavaScript 点击事件，请看这里 How to simulate a click with JavaScript?

Answer 2

不确定这是否适用于 Chrome 扩展，但也许您可以使用 document.createEvent 方法，如下所述：

document.createEvent - Document Object Model (DOM) | MDN