I'm currently working a chrome extension that will notify if the getElementId is not in the page.. and unfortunately the rich notification is not showing in contennt script. Should I use Message Passing for this?
load.js
con = document.getElementById('content');
if (con !=null){
var options = {
type:"basic",
title:"Error",
message:"Error",
iconUrl:"logo1.png"
}
chrome.notifications.create(options, callback);
function callback()
{
console.log('yey');
}
}
manifest.json
{
"manifest_version": 2,
"name": "CRM Online Chrome Extension",
"description": "License authentication key for the clients.",
"version": "1.0",
"background": {
"scripts": [
"background.js"
],
"persistent": true
},
"content_scripts":[
{
"matches":[ "*://*/*",
"*://*/*"
],
"js":["payload.js","load.js"]
}
],
"browser_action": {
"default_title": "Sample",
"default_icon": "logo1.png",
"default_popup": "popup.html"
},
"permissions": [
"notifications",
"tabs",
"*://*/*",
"*://*/*"
]
// "options_page": "option.html"
}
You have to send a message from your content script to the background page and this latter can create the notification upon the reception of the message.
For example:
background.js
chrome.runtime.onMessage.addListener(function(message){
if (message.value == "contentPresent"){ //if the message received is the one we sent from our content script
chrome.notifications.create({ //create notificacion
type:"basic",
title:"Error",
message:"Error",
iconUrl:"logo1.png"
}, function(){
console.log("yey");
});
}
});
content.js
if (document.getElementById("content")) { //if the element with id "content" is found...
chrome.runtime.sendMessage({value:"contentPresent"}); //send a message to the background script
}
Related
I created a js script that goes with my popup.html for a chrome browser extension I'm working on. It listens for a change in a slider value on the HTML and then sends a message to the content.js script with the new data. However, it seems I can't use sendMessage in this script. I'm using manifest v3.
Here's my js:
var slider = document.getElementById("slider");
let value = slider.value;
//function is called when the slider moves
changeSlider = function() {
value = slider.value;
update();
}
update = function() {
chrome.runtime.sendMessage({ message: "update", data: value });
}
Here's my manifest:
{
"manifest_version": 3,
"name": "e",
"version": "0.1",
"author": "e",
"homepage_url": "https://www.example.com",
"permissions": [
"contextMenus",
"activeTab",
"nativeMessaging"
],
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": ["src/content.js"]
}],
"web_accessible_resources": [
{
"resources": ["src/*"],
"matches": ["<all_urls>"],
"use_dynamic_url": true
}],
"background": {
"service_worker": "src/background.js"
},
"action":
{
"default_popup": "src/popup.html",
"default_icon": "src/resources/icon.png"
},
"icons": {
"16": "src/resources/icon-16.png",
"32": "src/resources/icon-32.png",
"48": "src/resources/icon-48.png",
"128": "src/resources/icon-128.png"
}
}
And here's the console error I get whenever I adjust the slider:
additionally, my interpreter doesn't autofill chrome.runtime, so I assume something went wrong there. Help :D
I know there are 3 different contexts : background, popup, web page. I want to capture/intercept a web page's console log in my extension, How can I do that?
Here is my code:
contentScript.js:
console.log('starting>>>>');
var log = console.log;
console.log = function () {
log.call(this, '**** MY Console**** ');
log.apply(this, Array.prototype.slice.call(arguments));
// ...
}
};
manifest.json:
{
"name": "my extension 01",
"version": "1.0",
"description": "----",
"permissions": ["activeTab","storage","declarativeContent"],
"background":{
"scripts":["background.js"],
"persistent":false
},
"page_action": {
"default_popup": "popup.html"
},
"options_page": "options.html",
"content_scripts": [
{
"matches": ["https://MY-WEBSITE/*"],
"run_at":"document_start",
"js": ["contentScript.js"]
}
],
"manifest_version": 2
}
i'm trying to send a message from my content script to my popup script because i need to use popup DOM when a page is loaded, here's what i tried :
contentScript.js
window.addEventListener("load", function() {
chrome.runtime.sendMessage({
"action": "init"
});
})
popup.js
chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {
if (request.action == "init") {
alert('Initialisation demandée...')
} else {
alert('Je n\'ai pas compris')
}
})
manifest.json
{
"manifest_version": 2,
"name": "Youtube color modifier",
"description": "Change youtube colors",
"version": "1.0",
"page_action": {
"default_icon": "icon.png",
"default_title": "Youtube color modifier",
"default_popup": "popup.html"
},
"permissions": [
"activeTab"
],
"content_scripts": [{
"matches": ["<all_urls>"],
"js": ["contentScript.js"]
}]
}
Thank you for helping a noob :))
If you have a content script, it will be run everytime you (re)load the page, assuming that the page you are visiting is registered in the manifest.json.
So instead of this:
window.addEventListener("load", function() {
chrome.runtime.sendMessage({
"action": "init"
});
})
simply try this:
chrome.runtime.sendMessage({
"action": "init"
});
I was looking for without success.
I want to get the status of my requests from my extension but I can not get it.
Manifiest
{
"manifest_version": 2,
"name": "Pixel Checker TT",
"description": "This extension validate your pixels and its requests",
"version": "1.6",
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
"background": {
"persistent": true,
"scripts": ["popup.js"]
},
"content_scripts": [
{
"matches": [
"<all_urls>"
],
"js": ["sources/js/jquery-3.0.0.min.js","content.js"]
}
],
"permissions": [
"tabs",
"activeTab",
"webRequest",
"webRequestBlocking",
"*://*.mydomain.co/",
"*://*.myotherdomain.co/"
]
}
popup.js or background code
chrome.webRequest.onCompleted.addListener(function(details) {
for (var i = 0; i < details.requestHeaders.length; ++i) {
console.log(details.requestHeaders[i].url);
console.log(details.requestHeaders[i].statusCode);
}
},
{urls: ["<all_urls>"]},
['blocking','requestHeaders']);
The problem is that I dont have errors just aren not printed the info. I also tried to put the info in a div with $('#pixelsFound').text(details.requestHeaders[i].url)
but doesn't work too.
I am trying to create a quick Chrome extension (complete beginner) and just want to display an alert whenever the icon is clicked, so I tried the following:
manifest.json
{
"name": "Something",
"version": "1.0",
"manifest_version": 2,
"description": "Woohoo",
"browser_action": {
"default_icon": "icon.png"
},
"content_scripts" : [{
"matches": ["<all_urls>"],
"js" : ["bgscript.js"]
}]
}
bgscript.js
chrome.browserAction.onClicked.addListener(function(tab) {
alert('icon clicked')
});
However when I click on my icon, nothing happens! Looking at the above - can anyone spot why this wouldn't work?
In order to be notified for browser-action's onClicked event, you need a background-page (or better yet event-page), not a content-script.
Change your manifest like this:
// Replace that:
"content_scripts" : [{...}]
// with this:
"background": {
"persistent": false,
"scripts": ["bgscript.js"]
}
If you want the browser-action to invoke something on a content-script, you need to communicate throught the background-page using Message Passing (e.g. Simple one-time requests).
E.g.:
manifest.json
{
"name": "Something",
"version": "1.0",
"manifest_version": 2,
"description": "Woohoo",
"browser_action": {
"default_icon": "icon.png"
},
"background": {
"persistent": false,
"scripts": ["background.js"]
},
"content_scripts" : [{
"matches": ["<all_urls>"],
"js" : ["content.js"]
}]
}
background.js
chrome.browserAction.onClicked.addListener(function (tab) {
/* Send a message to the active tab's content script */
chrome.tabs.sendMessage(tab.id, { action: 'saySomething' });
});
content.js
chrome.runtime.onMessage.addListener(function (msg) {
/* We received a message, let's do as instructed */
if (msg.action === 'saySomething') {
alert('something');
}
});