user3417825
user3417825

Reputation: 3

Javascript for chrome extension

I'm trying to create a button on a page

My manifest.json has content script inject.js and inject.js is like this

var botao_comunidades = document.querySelector('a[href="#Communities"]');

var botao_teste = document.createElement('p');
botao_teste.innerHTML = '<a href="#">Test</a>';
botao_teste.className = "themeLightTransparency NSC";
botao_comunidades.insertAdjacentElement('afterend',p);

manifest.json

{
"name": "Teste",
"version": "0.0.1",
"manifest_version": 2,
"description": "Teste",
"icons": {
"16": "icons/icon16.png",
"48": "icons/icon48.png",
"128": "icons/icon128.png"
},
"default_locale": "en",
"permissions": [
"<all_urls>"
],
"content_scripts": [
{
  "matches": [
    "https://www.orkut.com.br/*"
  ],
  "js": [
    "src/inject/inject.js"
  ]
  ]
 }
]
}

and it does nothing :(

Upvotes: 0

Views: 89

Answers (1)

Teepeemm
Teepeemm

Reputation: 4508

From your manifest, delete the extra ] that closes content_scripts.js (if you want to make this exact code work, there are a few other steps mentioned at the end). Then when I load your script, the console at the website says Uncaught ReferenceError: p is not defined on line 6. Change the last line to botao_comunidades.insertAdjacentElement('afterend',botao_teste); and everything works.

Other steps to make this exact code work:

  • Delete “icons” and “default_locale” from the manifest
  • Change content_script.matches to “http://www.orkut.com.br/*”
  • Change the first line of inject.js to use querySelector('#signUpViewport’);

Here's the finished product:

manifest.json:

{
    "name": "Teste",
    "version": "0.0.1",
    "manifest_version": 2,
    "description": "Teste",
    "permissions": [
    "<all_urls>"
    ],
    "content_scripts": [
    {
        "matches": [
        "http://www.orkut.com.br/*"
        ],
        "js": [
        "src/inject/inject.js"
        ]
    }
    ]
}

src/inject/inject.js:

var botao_comunidades = document.querySelector('#signUpViewport');

var botao_teste = document.createElement('p');
botao_teste.innerHTML = '<a href="#">Test</a>';
botao_teste.className = "themeLightTransparency NSC";
botao_comunidades.insertAdjacentElement('afterend',botao_teste);

And a screen shot ("Test" is in the bottom left):

Screen shot


Now it's your turn to be a little more descriptive in how it's not working.

Upvotes: 1

Related Questions