Javascript 来自chrome扩展的自动填充输入不'；行不通

我正在尝试一个简单的Chrome扩展，但遇到了一个障碍。
我正在尝试自动填写登录表单（用户名和密码）。（作为禁用chrome自动填充功能时的备份）
我已经成功地向页面中注入了一个脚本，并且我可以将目标输入记录到console.log中。但它不会设定值

Manifest.json

{
  "manifest_version": 2,
  "name": "Test Extension",
  "description": "Test Extension",
  "version": "1.0",
  "browser_action": {
    "default_icon": "icon.png",
    "default_popup": "index.html"
  },
  "content_scripts": [
    {
        "matches": [ "*://*.domain.net/*" ],
        "js": [ "autofill.js" ]
    }
  ],
  "permissions": [
    "tabs",
    "*://*.domain.net/*"
  ]
}

autofill.js

console.log( "Script properly injected into page" );

let usernameInput = document.querySelector( 'input[name="username"]' );
let passwordInput = document.querySelector( 'input[name="password"]' );

console.log( usernameInput );

usernameInput.value = "test";

---

这里缺少什么？

几乎可以肯定的是，您需要等待document loaded事件。事实上，在将元素加载到页面上之前，脚本已经完成

让您的autofill.js

console.log( "Script properly injected into page" );
document.addEventListener('DOMContentLoaded', function () {
    let usernameInput = document.querySelector( 'input[name="username"]' );
    let passwordInput = document.querySelector( 'input[name="password"]' );

    console.log( usernameInput );

    usernameInput.value = "test";
});

---

显然，问题在于Chrome的自动填充功能。将自动完成属性设置为

关闭

，

错误

或

新密码

，以防密码对我无效。Chrome似乎忽略了这一点。

我的解决方案是在执行代码之前添加一个小的超时。这远非理想，但它确实有效

setTimeout( () => {
    usernameInput.value = "username";
    passwordInput.value = "password"
}, 500 );

---

您是否尝试过使用

.val（）

来设置值。我不想使用jQuery。

console.log（usernameInput）的输出是什么

如果我把它填到控制台中，愚蠢的事情是：

document.querySelector（'input[name=“username”]”）。value=“test”该值为ChangedSonds逻辑值。尝试过，但由于某些原因，eventlistener中的所有内容都无法启动<代码>document.addEventListener（'DOMContentLoaded'，（）=>{console.log（'domFullLoaded and parsed'）；}）

显然我不必等待DOM加载：我还尝试将

run\u at:document\u end

添加到我的manifest.json中，但没有效果。加载DOM后脚本运行的另一个证据是输入元素的console.log，如果它还没有加载，它将返回undefined。公平地说，对于小内容脚本，我通常使用“run_at”：“document_start”，这样我就知道在启动document ready listener之前已经注册了它。也许我错过了一个把戏。