I am building a form filler. In the sidebar I will have a button. When the button is clicked the form in the active tab tab should be filled. This is how my proof of concept extension look:
Based on that it seems that you’re doing everything right, though the code is missing the interesting bits currently, I guess
Generally, you’d want your page to be a http/https page. Which it seems you are using, so you should be fine.
Generally the examples listed on tabs.executeScript() - Mozilla | MDN should apply for you. It doesn’t matter if you do something from a sidebar or the background page in terms of extension APIs.
OK, so it seems I should use tabs.executeScript().
But from where? where does the code belong in the file system? in my sidebar.js, my content-script.js or background.js? Sorry, I am just a bit confused.
So how and where do I place the function that fills the form:
function fillForm( {
document.querySelector('[name="username"]').value="myusername"
}
And how do I execute my function from the sidebar button?
Wherever you handle the click, which would typically be in your sidebar.js
By running the function… Depending on if and how there is extra data that may of course vary. But you can both run JS code you define as a string or code from a js file with executeScript, so you should be able to find a solution that works for you.