I'm trying to run an experimental Chrome extension (found here: https://github.com/GoogleChrome/chrome-app-samples/tree/master/serial/ledtoggle ) and can't seem to find the reason for this error in 'launch.js'. The app is setup the exact same way as other apps which run successfully, but this one in particular seems to refuse. The key files are below, and all the others are the same as you'll find in the repo. Experimental APIs & platform apps are enabled. Any help is appreciated, and I will mark the answer!
Error in event handler for 'experimental.app.onLaunched': Cannot call method 'create' of undefined TypeError: Cannot call method 'create' of undefined
at chrome-extension://mkadehbifepfhnemaiighgighppmjgnp/launch.js:2:21
at chrome.Event.dispatch (event_bindings:237:41)
at chromeHidden.registerCustomHook.chrome.experimental.app.onLaunched.dispatch (experimental.app:32:39)
at Object.chromeHidden.Event.dispatchJSON (event_bindings:151:55)
Manifest.json:
{
"name": "Serial Test",
"version": "1",
"manifest_version": 2,
"app": {
"background": {
"scripts": ["launch.js"]
}
},
"icons": {
"16": "icon_16.png",
"128": "icon_128.png"
},
"permissions": ["experimental"]
}
launch.js:
chrome.experimental.app.onLaunched.addListener(function() {
chrome.app.window.create('index.html', {
width: 400,
height: 400
});
});
There is no chrome.app.window property, it is undefined. It seems that the idea is to open a new browser window, the correct code would be:
chrome.windows.create({
url: 'index.html',
width: 400,
height: 400
});
Edit: Apparently the chrome.app.window API will be available in future Chrome versions (I can see it in Canary). It isn't there in Chrome 21 however.
Related
I am working on toggling the icon for a Google Chrome extension, using chrome.action.setIcon().
With Manifest V3.
My manifest.json contains the extension "action" property which sets the icons correctly:
"action": {
"default_icon": {
"16": "/images/ext/icon16.png",
"32": "/images/ext/icon32.png",
"48": "/images/ext/icon48.png",
"128": "/images/ext/icon128.png"
},
}
When running the code to change the extension icon, in the service worker ("background.js"):
FUNCTION-WITH-ICON-TOGGLING(){
chrome.action.setIcon({
path: {
'16': '/images/on/icon16.png',
'32': '/images/on/icon32.png',
'48': '/images/on/icon48.png',
'128': '/images/on/icon128.png'
}
});
}
In a function run when the extension is pressed:
chrome.action.onClicked.addListener((tab) => {
chrome.scripting.executeScript({
target: { tabId: tab.id },
function: FUNCTION-WITH-ICON-TOGGLING }});
I am greeted with a fun error:
Error handling response: TypeError: Cannot read properties of undefined (reading 'setIcon')
I have tried changing syntax to even the original working icons, and the single icon path,
With the same error.
eg.
chrome.action.setIcon({
path: "/images/on/icon16.png"
});
I have searched extensively and not found this error reported. If anybody can point me in the right direction, I would really appreciate the help!
The full work in progress implementation can be found here:
background.js
Testing in Chrome Version 108.0.5359.96 (latest to date).
When trying to use Chrome's WebNavigation.onCompleted to run background.js on a certain url I get the error
"Uncaught TypeError: Could not add listener".
For permissions in my manifest.json I have given the extension access to activetab and webrequest.
I have tried using other listeners like
chrome.browserAction.onClicked.addListener
and it worked perfectly. I am also using the latest version of chrome (v73).
background.js :
chrome.webNavigation.onCompleted.addListener(function(tab) {
var eurl = tab.url.split("/skill/");
if(eurl[0] === "https://www.duolingo.com") {
chrome.tabs.executeScript(tab.ib, {
file: 'jquery-3.3.1.min.js'
});
chrome.tabs.executeScript(tab.ib, {
file: 'duohelperinjector.js'
});}
}, {url: [{urlMatches : '*://duolingo.com/skill/*'}]});
manifest.json :
{
"name": "DuoHelper",
"version": "0.0.1",
"manifest_version": 2,
"description": "A Chrome Extension That Helps With Duolingo",
"homepage_url": "https://github.com/TechHax/DuoHelper",
"background": {
"scripts": [
"background.js"
],
"persistent": true
},
"browser_action": {
"default_title": "DuoHelper"
},
"permissions": [
"webNavigation",
"activeTab"
]
}
The error I'm getting:
Uncaught TypeError: Could not add listener
I would, with the extension working properly, like to have the chrome extension inject the javascript files on the active tab if its url is *://duolingo.com/skill/*.
See the documentation: urlMatches is a RE2 regular expression, not a URL match pattern.
Solution 1.
The correct RE2 expression would be 'https?://(www\\.)?duolingo\\.com/skill/.*'
Solution 2.
A better approach is to do a plain string comparison of the host name and path because it's much faster than using regular expressions and the documentation explicitly advises to use regexps only when absolutely unavoidable:
chrome.webNavigation.onCompleted.addListener(info => {
chrome.tabs.executeScript(info.tabId, {file: 'jquery-3.3.1.min.js'});
chrome.tabs.executeScript(info.tabId, {file: 'duohelperinjector.js'});
}, {
url: [{
hostSuffix: '.duolingo.com',
pathPrefix: '/skill/',
}],
});
Note how hostSuffix utilizes an implicit dot added by the API before the first component to match any subdomain of duolingo.com. Also, the callback parameter is not a tab, but a different object with tabId inside.
Solution 3.
Use declarativeContent API as shown in the documentation, but instead of ShowPageAction specify RequestContentScript, which despite the warning in the documentation actually works in the stable Chrome.
Have searched a ton, can't find a solution. Am making a chrome extension. Here is what I have:
Manifest:
{
"name": "Test",
"description": "T",
"version": "2.0",
"permissions": [
"activeTab"
],
"background": {
"scripts": ["background.js"],
"persistent": false
},
"browser_action": {
"default_title": "Stuff"
},
"manifest_version": 2
}
Background.js:
chrome.browserAction.onClicked.addListener(function(tab) {
chrome.tabs.executeScript(null, {file: "content_script.js"});
});
content_script.js:
console.log(document.getElementById('DERIVED_SSTSNAV_PERSON_NAME'));
document.getElementById('DERIVED_SSTSNAV_PERSON_NAME').textContent = "test";
"Copy Element" off the page I'm working with:
<span class="PALEVEL0PRIMARY" id="DERIVED_SSTSNAV_PERSON_NAME">John Smith</span>
So, when I type both of those content_script.js ^ lines of code into console, I get what I want. I first get the whole <\span class...span>. Then .textContent spits out "John Smith." Fine and dandy.
The second I throw run my chrome script with the. exact. same. lines of code, I get "null" instead of <\span class...span> and then trying to access the .textContent throws me the error in my title.
What the heck? Seriously. I've spent hours redoing my manifest and trying to get that to work, but I can edit the DOM on other pages, just not this one. Would love to chat and get some feedback.
Thank you.
Ok so i am actually interested in building an extension for google chrome and firefox and my friend recommended me KangoFramework since it is cross platform.
So I downloaded ver 1.7.9 of the framework can't actually download ver 1.8.0 due to 404 error on their web or something. So I got to coding my first page with is the login page and I wrote some scripts for it to run and it work! Great !!
And so i wrote another page and I wrote another script and it works on google chrome but in firefox it seems like it didnt load my script at all as the debugger doesn't even show that I have the script file.
so i am confuse by this as how can this happen
here's my extension_info.json
{
"content_scripts": [
"assets/Javascript/LoginPage.js"
],
"description": "Extension description",
"creator": "Annonymous",
"background_scripts": [
"main.js"
],
"homepage_url": "http://kangoextensions.com/",
"version": "0.9.0",
"browser_button": {
"caption": "some Extension",
"icon": "icons/Logo.png",
"tooltipText": "add on"
},
"name": "someExtension"
}
And here's my main.js File
function MyExtension() {
var self = this;
kango.ui.browserButton.addEventListener(kango.ui.browserButton.event.COMMAND, function() {
kango.ui.browserButton.setPopup({url:'Index.html', width: 500, height:500});
});
}
MyExtension.prototype = {
_onCommand: function() {
kango.browser.tabs.create({url: 'http://kangoextensions.com/'});
}
};
var extension = new MyExtension();
and here's my html: http://pastebin.com/REdbhRqu
and here's my HamburgerMenu.js : http://pastebin.com/SvnRkH9Y
and lastly here the PhotoSwipe.js : http://pastebin.com/ykMW13YN
PhotoSipe.js is just to start the plugin
I'm trying to build my first Chrome extension but I found problems with debugging.
I'm able to console.log() but in the Developer Tools console (I'm working on the background.js; no UI) there's no report about syntax errors.
Is that normal? Or it depends on some settings of the page I'm creating the extension for? (www.google.com)
I've read maybe there could be a window.onerror set somewhere but I'm not able to find it. I tried a
window.onerror = null;
at the beginning of the background.js but nothing has changed.
What would you do to get the errors back?
UPDATE (Adding code)
This is the manifest.json:
{
"name": "Name",
"description": "Description",
"version": "0.1",
"manifest_version": 2,
"background": {
"persistent": false,
"scripts": ["js/background.js"]
},
"permissions" : [
"tabs",
"*://www.google.com/*",
"*://www.google.de/*"
],
"commands": {
"changeSearch": {
"suggested_key": {
"default": "Ctrl+Shift+A",
"mac": "Command+Shift+A"
},
"description": "Change."
}
}
}
The background.js start like this:
console.log("Start");
chrome.commands.onCommand.addListener(function(command) {
consTYPOTYPOTYPOTYPOTYPOTYPOle.log("catched");
...
I just discovered that errors are thrown if the TYPO is otuside of function(command) code, if I have TYPOs on the 1st or 2nd line.
The 3rd line is totally silent. No error. It just doesn't work.
That's weird to me!
The problem was a conflicting extension that was overriding mine.
Trying to disable all extensions and then re-enabling them, starting from mine, solved the problem.
Probably I made it to have higher priority respect to the conflicting extension (that has been enabled after).