Search code examples
javascriptfirefox-addon

Button doesn't work and change the border color

I tried to code a little Firefox Extension but I don't get the Button in the popup working. What should happen when you click the button is that the red border changes into a green one. I couldn't find the mistake.

This is my manifest.json

{

  "manifest_version": 2,
  "name": "Testing",
  "version": "1.0",

  "description": "Testing",

  "icons": {
    "48": "icon.jpg"
  },

  "content_scripts": [
    {
      "matches": ["*://*.allee-abi20.de/*"],
      "js": ["ust.js"]
    }
  ],
    
  "permissions": [
    "activeTab",
    "contextMenus"
  ],
  
  "browser_action": {
        "default_icon": "icon.jpg",
        "default title": "Hallo",
        "default_popup": "view.html"
    }
}

Thats the view.html

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8"/>
        <link rel="stylesheet" href = "style.css" type="text/css"/> 
    </head>
    <body>
        <input type=text id="Kat"></input>
        <input type=text id="Ty"></input>
        <button id= "but">Klicken </button>     
    <script type="text/javascript" src="./popup.js"></script>   
    </body>
</html>

And thats the popup.js

document.body.style.border = "5px solid red";
var myLink = document.getElementById("But");
myLink.onclick = function(){
    document.body.style.border = "20px solid green";
}
Solution

  • Just a tiny syntax issue regarding to uppercase: write but, not But, since But is undefined.