How to call script on specific page with my chrome extension? - javascript

Super basic but I can not get it to work.
manifest.json
{
"manifest_version": 2,
"name": "My Extension",
"description": "It's great.",
"version": "1.0.0",
"icons": { "128": "icon_128.png" },
"permissions": [
"activeTab"
],
"content_scripts": [
{
"matches": ["https://*.youtube.com/*"],
"css": ["myStyles.css"],
"js": ["contentScript.js"]
}
]
}
contentScript.js
alert("Hello, world!");
I have done some reading and this does not work. I am just starting and my basic script won't run... I want it to fire on every page reload whenever I visit YouTube.
Adding this to the JSON and having my alert inside the script did work but only when I click the extension icon in the top right corner and that is not what I want.
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
I copied the example right from https://developer.chrome.com/extensions/content_scripts so I don't know what's going on.

Related

how to execute content_script without clicking on the plugin icon in chrome plugin?

I want to execute my content_script without clicking on the plugin icon.
manifest.json
{
"short_name": "my plugin",
"name": "vanilla Chrome Extension",
"manifest_version": 2,
"permissions": ["activeTab", "tabs", "<all_urls>", "webNavigation"],
"version": "0.0.1",
"browser_action": {
"default_popup": "popup.html",
"default_title": "my plugin"
},
"content_scripts": [
{
"matches": ["<all_urls>"],
"css": ["content-script.css"],
" js ": ["content-script.js"],
"run_at": "document_end"
}
]
}
I also try document_idel and document_start
content-script.js
console.log("inside plugin script");
document.querySelectorAll("h1").style.backgroundColor = "#c1c1c1";
I try to find out from docs but can't figure out what to do
as #wOxxOm commented on my question, in my manifest.json content_scripts section I leave space before and after "js" when I remove those spaces it works.

Access HTML-Element-Attributes over Google Chrome-Extension

I am working on a Google Chrome Extension, which should auto-complete a form on a foreign website, for this to work, I need to access the value of the textboxes.
The following code is executed on a button click note that it takes the current open tab to perform its action the text box on this tab should be filled with some data the opening of the tab works but the value change on the textbox doesnt, how could it be done differently?
function autofill() {
chrome.tabs.executeScript(null, {
code: "document.getElementById('txbx_name').value = 'Johnny Bravo';"
});
}
Manifest
{
"name": "CopBot",
"version": "1.0",
"description": "CopBot",
"manifest_version": 2,
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
"permissions": [
"storage",
"tabs",
"<all_urls>"
],
"background":{
"scripts": ["background.js"]
}
}
How can I access and modify the value of an element from my Google Chrome Extension?

What type of method to use for injecting script into page on page load?

So I have a chrome extension that injects some javascript into the current tab when the popup.html page is opened in the extension. I'm trying to make the extension inject the code when the page is loaded, and I'm not sure what path to take.
However, chrome is giving me these errors when I try to run background.js on the background page:
and
I don't know how to resolve these errors. They seem to be related to permission errors not allowing me to run chrome.tabs.executeScript through the background page. I wasn't aware that the background page didn't have access to all urls, or am I mistaken in interpreting this error message? My manifest file:
"background": {
"scripts": ["js/inject.js", "js/background.js"],
"persistent": false
},
"browser_action": {
"default_icon": "images/icon.png",
"default_popup": "popup.html"
},
"icons": {
"16": "images/icon16.png",
"48": "images/icon48.png",
"128": "images/icon128.png"
},
"permissions": [
"contextMenus",
"tabs",
"contextMenus",
"storage",
"webNavigation",
"<all_urls>"
],
"web_accessible_resources": [
"js/jquery-2.1.3.min.js"
],
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": ["js/jquery-2.1.3.min.js", "js/inject.js"]
}
],
Edit: background code:
function cssInject(){
chrome.tabs.executeScript({
code: '$("*").css("font-family", "Courier", "important"); $("*").css("font-size", "18pt", "important"); $("*").css("background-color", "#fbfbfb", "important"); $("*").css("line-height", "1.5", "important")'
});
}
function cssRemove(){
chrome.tabs.executeScript({
code: '$("*").css("font-family", ""); $("*").css("font-size", ""); $("*").css("background-color", ""); $("*").css("line-height", "")'
});
}
This error happens because chrome.tabs.executeScript without the tab ID argument tries to inject the code in the current active tab.
Your error indicates that you had an (undocked) Dev Tools window open and focused when that code executed. It counts as the active tab.
You need to be focused on the tab you want to inject the code to for it to work. Docking your Dev Tools will help with that.

Manifest.json file not working properly in javascript?

i have a chrome extension for creating a button in Gmail webpage.
the button was created successfully in on that page.but after refreshing that page,the button was not created.it gives aa class undefined.
after clearing the cache and cookies,it works.but not all time,sometimes only.
my manifest.json file code here:
{
"manifest_version": 2,
"name": "E-mail Security",
"description": "This extension demonstrates a Email security ",
"version": "1.0",
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
"permissions": [ "notifications", "contentSettings", "cookies", "tabs", "contextMenus", "http://*/*", "https://*/*" ],
"content_scripts": [
{
"matches": ["http://*/*", "https://*/*"],
"js": ["ngContent.js","jquery.js"]
}
]
}
why,that above problem was occured.whether i miss something in manifest.json file?
note:i am using chrome browser.
Create the button when the page loads. Then perhaps define an event for MutationObserver. Every time the button disappears, your code should get triggered to create it once again. Then apply whatever other rules/actions you want to for that button.

Show Visual Events in gmail

I am trying to create a chrome extension for gmail where I want the next/old converstions on certain mouse gestures.
this is my content scripts
{
"name": "DemoApp",
"version": "1.0",
"manifest_version": 2,
"description": "Demo.",
"content_scripts":[
{
"matches":["*://mail.google.com/*"],
"css": ["mystyles.css"],
"js": ["jquery.js", "popup.js"],
"all_frames":true
}
],
"permissions": [
"*://mail.google.com/*"
]
}
I used visual event http://www.sprymedia.co.uk/article/Visual+Event+2 but it doesn't show any event attached to next/old converstion div
plz help me as I am new to chrome extension

Categories