I am trying to write a chrome plugin,which I defined with the following manifest:
{
"name": "test",
"version": "1.0",
"background": { "scripts": ["background.js"] },
"permissions": [
"tabs", "http://*/*"
],
"browser_action": {
"name": "test",
"icons": ["icon.png"]
},
"manifest_version": 2
}
my background.js file looks like this:
chrome.app.runtime.onLaunched.addListener(function() {
console.log('details', chrome.app.getDetails());
});
When it loads, I see this error on the console:
Uncaught TypeError: Cannot read property 'onLaunched' of undefined
I can't figure out why I am not seeing a properly initialized chrome.app.runtime.
How do I debug this?
Gene
UPDATE:
When I run the following code:
console.log("before connection");
chrome.extension.onConnect.addListener(function(port) {
console.log("connected");
});
I see the first log output (before connection) but not the second; does this mean that it fails to connect to the browser?
chrome.app is undefined because you aren't defining your extension as an app.
Chrome extension can be only one of these in the manifest file:
browser_action, page_action, theme, or app.
In your manifest you're defining an browser action.
So take a deep breath and read the documentation for the manifest file.
Related
I am currently working on a chrome Extension.
My desired workflow : content-script.js sends a message to background.js. Once the message is received by background using eventListener, background starts executing a process which includes an axios.post request as well as localStorage.setItem. Since I have migrated the project's manifest to V3, background.js becomes a service worker. Hence while executing the extension, the background.js console says that "axios is not defined" as well as "localStorage is not defined".
Hence I need a way to use this in background.js (manifest v3).
Note : I also tried using chrome.storage.local, but the set function's callback is getting called, but the get function doesn't get any value.
Do not forget to place the "storage" permission in the manifest file.
manifest.json (v3)
{
"name": "Test extenstion",
"description": "Test Extension!",
"version": "1.0",
"manifest_version": 3,
"background": {
"service_worker": "background.js"
},
"action": {},
"permissions": ["storage", "activeTab", "scripting"]
}
Background.js
chrome.storage.sync.set({key: value}, function() {
console.log('Value is set to ' + value);
});
chrome.storage.sync.get(['key'], function(result) {
console.log('Value currently is ' + result.key);
});
Source:
https://developer.chrome.com/docs/extensions/reference/storage/#usage
I'm trying to use signalr in my chrome extensions but I keep getting
'Uncaught TypeError: Cannot read property 'client' of undefined'
Now I know I need to use a script
<script src="http://localhost:3600/signalr/hubs"></script>
like this, but i can't figure out where and how to use it in chrome extensions.
My manifest file looks like this
"manifest_version": 2,
"name": "Jquery Tests",
"description": "This extension tests jquery.",
"version": "1.0",
"background": {
"scripts": ["jquery-1.9.1.min.js", "jquery.signalR-2.2.1.min.js", "background.js"],
"persistent": true
},
"content_scripts":
[
{
"matches": ["http://*/*", "https://*/*"],
"js": ["jquery-1.9.1.min.js", "jquery.signalR-2.2.1.min.js", "popup.js"]
}
],
"permissions": [
"notifications",
"background",
"tabs", "http://*/*"
],
"browser_action": {
"default_icon": "img/icon.png",
"default_popup": "popup.html"
}
and here is my popup.js where I get the error
$(document).ready(function () {
debugger;
console.log('jquery working in content!');
$.connection.hub.url = "http://localhost:3360/signalr";
$.connection.logging = true;
var ticker = $.connection.notificationHub;
//var ticker = $.connection.tempratureMonitorHub;
//signalr method for push server message to client
ticker.client.notify = function (message) {
console.log("Notification added!");
if (message && message.toLowerCase() == "added") {
updateNotificationCount();
}
}
});
[][1]
In chrome extensions , the dynamically created proxy i.e hubs file is unavailable as files are loaded once per installation.
This file contains information of client and server. To include this information in your extension you need to follow the following steps as mentioned in this link
Install the Microsoft.AspNet.SignalR.Utils NuGet package.
Open a command prompt and browse to the tools folder that contains
the SignalR.exe file. The tools folder is at the following location:
[your solution
folder]\packages\Microsoft.AspNet.SignalR.Utils.2.1.0\tools
Enter the following command:
signalr ghp /path:[path to the .dll that contains your Hub class]
The path to your .dll is typically the bin folder in your project
folder.
This command creates a file named server.js in the same folder as
signalr.exe.
Put the server.js file in an appropriate folder in your project,
rename it as appropriate for your application, and add a reference
to it in place of the "signalr/hubs" reference.
I started building chrome extensions. Initially I started with a simple extension which prints the hello in background console. How can I print that in the active window console.
This is my manifest.json file
{
"manifest_version": 2,
"name": "example",
"version": "0.1",
"description": "My Chrome Extension",
"icons": {
},
"background": {
"scripts": ["js/background.js"]
},
"browser_action": {
"default_title": "My test Environment"
},
"permissions": [
"background",
"storage",
"tabs",
"http://*/*",
"https://*/*"
]
}
This is the content of my background.js file
a simple
console.log("hello");
Take a look at Content Script, you could use manifest.json injection or Programming injection to ensure your code run in the context of current webpage.
The former requires Message Passing or Storage to ensure communications between content script with background page;
while as for the latter, Try the following code in background.js
chrome.tabs.executeScript({code: "console.log('hello');"});
Hopefully this is something simple. I'm testing a simple Chrome Extension script and it appears it'll execute part of the script, but won't complete it. For example, if I add an alert() to the beginning of a script, it will execute the alert. But if I place it after anything calling the chrome DOM object, it won't execute. Here's an example:
Will execute alert
alert("Test");
chrome.webRequest.onCompleted.addListener(function (request) { });
Will not execute alert
chrome.webRequest.onCompleted.addListener(function (request) { });
alert("Test");
Am I missing something?
Here is my manifest:
{
"background": {
"persistent": true,
"scripts": [
"scripts/libs/jquery.1.11.2.min.js",
"scripts/background.js"
]
},
"browser_action": {
"default_icon": "resources/icon.19.png"
},
"icons": {
"48": "resources/icon.48.png"
},
"manifest_version": 2,
"name": "Test",
"permissions": [
"<all_urls>",
"webNavigation",
"webRequest",
"webRequestBlocking"
],
"version": "1.0"
}
You are missing debugging it yourself.
Go to chrome://extensions/ and load the Dev Tools for your background page. You will see an uncaught exception that stops execution.
For webRequest events, you must include a filter argument to the addListener function.
Hi I have found other similiar questions on stackoverflow but none of them solved the purpose.
I want my chrome extension/app to be opened in a full tab like how POSTMAN extension is opened.
My manifest.json
{
"name": "Sample App",
"manifest_version": 2,
"version": "0.0.1",
"app": {
"background": {
"scripts": ["main.js"]
}
},
"icons": { "128": "icon.png" },
"permissions" : ["tabs" ]
}
My main.js (alias for background.js)
chrome.app.runtime.onLaunched.addListener(function() {
chrome.tabs.create({'url': chrome.extension.getURL('index.html')}, function(tab) {
alert("Hi");
});
});
index.html is the file i want to load on opening the new tab.
My first time responding here on stackoverflow, please be gentle...
I discovered that it's much easier to add "launch" : { "local_path" : "index.html" } within the manifest.json file. See my sample manifest file below.
{
"manifest_version" : 2,
"name": "Hello World!",
"description": "My first Chrome App.",
"version": "0.1",
"app": {
"launch" : {
"local_path" : "index.html"
}
},
"icons": { "16": "icon.png" }
}
Keep in mind that this example is very basic, it has been stripped of some unnecessary information such as a background script but it should accomplish what you want.
http://developer.chrome.com/apps/first_app.html
chrome.app.runtime.onLaunched is only for Chrome apps, not extensions. The code for your background page will automatically run when the Chrome browser starts, so you can start directly with chrome.tabs.create(...).
Also, you need to include index.html and any resource included in your extension that the page will use in a web_accesible_resources section in your manifest.