Bonjour à tous,

Je rencontre le problème suivant pour le développement d'une extension WebExtensions sous Firefox.

Voici un extrait des choses importantes du fichier manifest :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
"permissions": [
        "tabs", "<all_urls>"
    ],
"web_accessible_resources": [
        "interface/main_panel.html"
    ],
"background": {
        "scripts": [
            "background_scripts/background.js"
        ],
        "persistent": true
    },
"content_scripts": [
        {
        "js": [
            "content_scripts/jquery.js", "content_scripts/highlight_elements.js"
        ],
        "css": ["style.css"],
        "run_at": "document_end"
        }
    ]
- via background.js je clique sur un bouton qui lance le script add_main_panel.js, qui place une iframe en bas du navigateur :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// background.js
function add_main_panel() {
    browser.tabs.executeScript({
        file: '/interface/add_main_panel.js'
    }); 
}
browser.browserAction.onClicked.addListener(add_main_panel);
 
// add_main_panel.js
var addonFrame = document.createElement ("iframe");
addonFrame.className = "iframeClass";
var w = window.innerWidth;
addonFrame.style = "overflow: auto; resize: both; position: fixed; bottom: 0; right: 0; width: 100%; height: 300px;";
addonFrame.src = browser.extension.getURL ("interface/main_panel.html");
document.body.appendChild (addonFrame);
- comme on le voit si-dessus, cette iframe contient main_panel.html. Celui-ci contient un bouton <button id="select_element">Select an element</button> :

Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
<html>
<head></head>
<body style="background-color:white;">
    <button id="select_row">Select a row</button>    
    <p>Selected element : </p><p id="selected_element"></p>    
</body>
</html>

Le problème est que je n'arrive pas à récupérer le click sur ce bouton via un script jquery, highlight_elements.js, qui est pourtant dans content_scripts (voir le manifest) :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
$("#select_row").on('click', function( event ) {
    console.log("select row button clicked");
});
Pour résumer, je pense que je n'ai pas bien saisi les différentes articulations entre background / content scripts. Idem pour les scripts locaux, ou jquery ...

Merci de votre aide !

A bientôt.

Didier