2

I am new to chrome extension coding and am currently trying to build a extension as a hobby

Here is my manifest.json

    {
        "manifest_version": 2,
        "name": "LOL",
        "version": "0.1",
        "background": {
            "persistent": false,
            "scripts": ["background.js", "back.js"]
        },
        "browser_action": {
            "default_icon": "icon.png",
            "default_popup": "popup.html"
        },
        "permissions": [
            "downloads", "downloads.open", "downloads.shelf", "activeTab", "background"
        ]
    }

Here I have two radio buttons in popup.html. On click, I am executing background.js and back.js.

However, even though I select second radio button, background.js is being executed.

The strange behaviour that I observed is: if I swap the script order in my manifest.json as back.js, background.js.. whatever radio button I select, only back.js is executing.

I'm not sure what is wrong with my script. Please suggest what the issue might be.

Here is my popup.js

    function hello() {
        chrome.tabs.executeScript({
            file: 'background.js'
        });}

        function hello2() {
            chrome.tabs.executeScript({
                file: 'back.js'
            });
        }


    var radio1 = document.getElementById('option1').value;
    if (radio1 == "folder1") {
        document.getElementById('option1').addEventListener('click', hello);
    }
    if (radio1 == "folder2") {
        document.getElementById('option2').addEventListener('click', hello2);
    }

This is background.js

function alertlol() {

chrome.downloads.onDeterminingFilename.addListener(function(item, suggest) {
suggest({filename: "mysubdirectory/" + item.filename});
});

}
chrome.browserAction.onClicked.addListener(alertlol);
alertlol();

This is back.js

function alertlol1() {

chrome.downloads.onDeterminingFilename.addListener(function(item, suggest) {
suggest({filename: "mydir/" + item.filename});
});

}
chrome.browserAction.onClicked.addListener(alertlol1);
alertlol1();

This is popup.html

<!DOCTYPE html>
<html>
  <body style="width: 300px">
    Select download folder
    </br><input type="radio"  name="option1" onclick="background.js" value="folder1">Download folder one </input>
    <script type="text/javascript" src="popup.js"></script></br>
    <input type="radio"  name="option1" onclick="back.js" value="folder2">Download folder two </input>
    <script type="text/javascript" src="popup.js"></script>
  </body>
</html>

here is the code base

https://github.com/beardlessgenius/DLM

Michael
  • 8,362
  • 6
  • 61
  • 88
  • 1
    What is in background.js and back.js? – punkrockbuddyholly Nov 16 '16 at 09:04
  • It is strange to have the same scripts used as background scripts (manifest) and content scripts (`tabs.executeScript()`) (both *back.js* and *background.js*). Your code has an error which should be appearing the console for your popup (i.e. a reference error that `hello2` is not defined when you attempt to add it as a listener). Please see the [console for the popup](http://stackoverflow.com/a/38920982/3773011). – Makyen Nov 16 '16 at 09:08
  • And your *popup.html* is? Also *back.js* and *background.js*. – Makyen Nov 16 '16 at 09:09
  • popup.html has two radio buttons ` Select download folder Download folder one Download folder two ` – Krishna Chaitanya Nov 16 '16 at 09:27
  • background.js `function alertlol() { chrome.downloads.onDeterminingFilename.addListener(function(item, suggest) { suggest({filename: "mysubdirectory/" + item.filename}); }); } chrome.browserAction.onClicked.addListener(alertlol); alertlol(); ` – Krishna Chaitanya Nov 16 '16 at 09:33
  • back.js `function alertlol1() { chrome.downloads.onDeterminingFilename.addListener(function(item, suggest) { suggest({filename: "mydir/" + item.filename}); }); } chrome.downloads.onCreated.addListener(alertlol1); alertlol1();` – Krishna Chaitanya Nov 16 '16 at 09:33
  • @Makyen: I dont get any error on console. hello2 is added which executes back.js script – Krishna Chaitanya Nov 16 '16 at 09:35
  • 1
    @KrishnaChaitanya, Please [edit] the content into the Question. While information in comments can be helpful, all information that is needed to answer the Question should be in the Question. You can duplicate it in comments, but the Question is primary. – Makyen Nov 16 '16 at 10:02
  • @KrishnaChaitanya, If your code runs the line `document.getElementById('option2').addEventListener('click', hello2);` then there should be a reference error as `hello2` only exists within the `hello` function. As written, it will not be available outside of that function. If you are not seeing such an error in the console for your popup (which is not the console for the web page, nor the console for your background page), then please double check your actual code matches what you put in the Question. – Makyen Nov 16 '16 at 10:07
  • @Makyen I updated the question with github link. Also, corrected the error in popup.js. hello2 is now separate function. – Krishna Chaitanya Nov 16 '16 at 10:18
  • @KrishnaChaitanya, While a GitHub link may be helpful, the code that is need to provide an Answer to the Question needs to actually be in the Question, not at an external resource (just like a link-only Answer is not considered an Answer). While external links can provide additional context, it should not be necessary for people trying to answer the Question to go off-site to get information about the Question. One of the reasons for this is that the Question may become useless/not understandable in the future when/if that external resource changes, or is no longer available. – Makyen Nov 16 '16 at 10:24
  • @Makyen: Added all the info in the question itself. – Krishna Chaitanya Nov 16 '16 at 10:37
  • 1
    Okay, please explain what's happening here. You have two files which you declare as **background scripts**, and from a popup you try to inject them as **content scripts**, all while the code in them is not compatible with content scripts. Are you trying to simply execute code, and not inject a content script? If yes, in which context - the background? – Xan Nov 16 '16 at 11:46
  • @Xan I have two radio buttons, based on the radio button selected, I will download the files into mysubdirectory/(background.js) or mydir/ ( back.js). However based on the order that i mention these scripts in manifest.json, it is executing which ever script is mentioned first and not basing on the radio button selected. Im confused – Krishna Chaitanya Nov 17 '16 at 06:41

1 Answers1

0

One thing that I can suggest is, a) Use the <script type="text/javascript" src="popup.js"></script> only once and in the starting of the HTML, in head or right after body tag. b) in popup.js, use onclick() event, instead of checking for value. This is because it checks for value only once and gets done with it. What if you click later or click the same button twice?

After adding the "onclick" event in html, if the issue still persists, then ping me. This will give you only a start, please get on from here.

Ani
  • 71
  • 1
  • 3