I have recently created a beginner's Chrome extension project. The idea behind this project is to simulate an automatic click on the "F1" key and display a confirmation message when I click the extension's execution button.
The issue is that everything seems to be set up correctly, but when I click on the extension's button, the intended action doesn't occur.
The extension is correctly activated.
All other extensions are disabled.
The popup window (popup) displays correctly when I click on the extension icon in the Chrome toolbar.
The Chrome development console does not show any errors.
Chrome is updated
My manifest.json file code is here
{
"manifest_version": 3,
"name": "F1 AutoPress Extension",
"version": "1.0",
"description": "Automatically press the F1 key",
"permissions": ["activeTab"],
"action": {
"default_popup": "popup.html",
"default_icon": {
"16": "images/icon16.png",
"48": "images/icon48.png",
"128": "images/icon128.png"
}
},
"background": {
"service_worker": "background.js"
},
"icons": {
"16": "images/icon16.png",
"48": "images/icon48.png",
"128": "images/icon128.png"
}
}
My popup.js file code is here:
document.addEventListener("DOMContentLoaded", function() {
document.getElementById("pressF1Button").addEventListener("click", function() {
chrome.scripting.executeScript({
target: { tabId: -1 }, // Modify the target tab ID if needed
function: function() {
document.dispatchEvent(new KeyboardEvent("keydown", { key: "F1" }));
document.dispatchEvent(new KeyboardEvent("keyup", { key: "F1" }));
alert("Button clicked"); // Show an alert
}
});
});
});
My popup.html file code is here
<!DOCTYPE html>
<html>
<head>
<title>F1 AutoPress Extension</title>
<script src="popup.js"></script>
</head>
<body>
<button id="pressF1Button">Press F1</button>
</body>
</html>
My background.js file is empty.