Is there any way to debug chrome extension using debugger ( break points and step in/out)
beside console.log ?
Chrome 70.x debugging of chrome background scripts is broken, especially when you dynamically load them and they are not in the manifest. Have a ticket open to get it fixed; however they have not been very helpful; however found a work around...
Put a console.log("yourvariablenamehere") in your background.js script.
Hit F12 to open the dev tools, anchored to the bottom of the web page.
Load the background script via a button in your popup.html. Something like this from a button event...
var guid = CreateGuid();
chrome.tabs.executeScript(null, { file: "script/jquery-3.3.1.js" }, function () {
$.get("script/scrollPage.js?ver=" + guid, function (sScriptBody, textStatus, jsXHR) {
chrome.tabs.executeScript(null, { code: sScriptBody });
}, "text");
});
In the dev tools console you should see your logged variable. On the same line as the logged message is a VM with a number tacked onto it, a virtual script page. Select that VM page and then you get to the background script! Now put a breakpoint in the virtual script page, click the same button in your popup.html and it gets hit. And when you reload the popup and execute the background script that breakpoint is hit!
Hope this helps.
If you want to inspecting content scripts, a great method I found is using Console by selecting your extension in javascript context:
By selecting the extension you will have access to the global objects within that extension.
Reference:
Using the Developer tools to debug your extension
Related
I have a MV2 Chrome extension that on the popup page I added a "Shortcut" link so that user can access chrome://extensions/shortcuts by clicking it.
However, after upgrading to MV3, the link doesn't work.
Should I simply remove this feature?
You can resolve this issue by opening the page programmatically.
add some suitable selector to the link (popup html):
Configure Commands
add an event listener to open the shortcuts page (in popup script):
// get the DOM node
const link = document.getElementById("commands-link");
// add click event handler that opens the shortcuts page
link.addEventListener('click', () => chrome.tabs.create({
url: "chrome://extensions/configureCommands"
}));
I have a devtools.html file that has a script.js which contains:
console.log('started...')
In manifest.json, I have:
"devtools_page": "devtools.html"
However, when I run my extension and open a DevTools window, I don't see the log. If I throw an error in script.js, I can see that the error occurred in the chrome://extensions page, so I know that this script is loaded. However, that log doesn't appear anywhere. Aren't a devtools page's logs supposed to appear in the DevTools window?
View console.log() messages
Undock devtools into a separate window (in devtools toolbar, the three-dot menu)
Focus devtools window
Press CtrlShifti or CmdShifti to open devtools-on-devtools where you'll see the output
Output in the web page console using chrome.devtools.inspectedWindow.eval:
const foo = {bar: 123};
chrome.devtools.inspectedWindow.eval(`console.log(${JSON.stringify(foo)})`);
I am developing a chrome extension to suppress a prompt box.
The access is protected in server side and user is triggered with prompt box for username/password as shown below,
I am injecting a content_script in the url at document_start and trying to detect the presence of this prompt, if present "cancel" button need to be clicked.
Here is a test link to get the login prompt,
http://128.199.223.179/testing/test.php
You technically can't close the prompt only using the javascript api... You might need to use an NPAPI plugin or other external software such as Selenium to emulate a click on the close button.
But, what you can do is prevent that dialog from popping up in the first place by intercepting an authentication request.
First add "webRequest" permission in your manifest. Then try this code:
// to listen to all urls use { urls: ["<all_urls>"] }
chrome.webRequest.onAuthRequired.addListener(function(details) {
return {cancel: true};
}, {urls: ["http://128.199.223.179/testing/test.php"]}, ["blocking"]);
For better documentation, visit https://developer.chrome.com/extensions/webRequest#event-onAuthRequired
I am a 'Chrome for Business and Education' admin for a fleet of chromebooks which I have configured to run in Single App Kiosk mode. The kiosk app in question is really simple. All I did was take the example code from this page that uses the 'webview tag' (without controls, as we need all the whole screen for the app in question) and change the URL. The app has installed perfectly in all managed devices.
The problem now is that there are times when we want to be able to exit the kiosk app and return to the chromebook login screen. Right now the only way of doing this is to shut the machine down, start it and exit from the kiosk app boot screen by pressing Ctrl+Alt+S. The whole process takes 30 seconds plus per machine (the fleet contains 50). So we really need to be able to just quit out of the kiosk app and go back to the login screen (which would take about 5 seconds or less).
Now, I could just add a quit button to the screen (as per the second example app with navigation controls from the page referenced above) but this means we lose screen space for the app. The preferred solution is to close the app with keystrokes (e.g. Ctrl+Shift+L). But how do you do this in this context? I have tried adding conventional onkeydown javascript to the page containing the webview tag and this seems to be ignored. I have also tried using the 'chrome commands API', and whilst I can see that the shortcut had been registered against the extension (by clicking 'Keyboard shortcuts' on the chrome://extensions tab) it has no effect. The kiosk app window remains stubbornly open.
Does anyone know if this is possible and if so how?
Cheers,
Miles
In your manifest.json file add this entry to create the command for the app.
"commands": {
"exit-app": {
"suggested_key": {
"default": "Ctrl+Shift+L"
},
"description": "Exit the app"
}
}
Then you need to add code to your background script file to listen for the command. This code will close all windows in the app when it receives the exit-app command you created in the manifest.
chrome.commands.onCommand.addListener(function(command) {
switch(command) {
case 'exit-app':
exitApp();
break;
}
});
function exitApp() {
chrome.app.window.getAll().forEach(function(win) {
win.close();
});
}
Note that the key combination is only suggested, and might be ignored if another app or Chrome keyboard shortcut already uses that combination. You do still need to go to the Keyboard shortcuts link on the chrome://extensions page and verify that the key combination has actually been set for your app.
(Cross posted here)
Hi,
I have a sandboxed page (specified in my manifest) which is loaded into an iframe in my extension's background page. From within my sandboxed page, I'd like to open a new window and write to it, i.e.:
var win = window.open(); win.document.write('<p>Hello!</p>');
This works from my extension's background page and from regular web pages, but when invoked from either content scripts or my sandboxed page, the window opens, but I cannot access the win object (it's defined, but empty---console.log outputs "Window {}").
I assume this is due to same-origin policies (with every window being given a uinque-origin within the sandboxed environment). However, since the window opens an about:blank page, I'm confused why this would matter.
Is this a feature? Is there a parameter I can add to my manifest to avoid this? And does anyone know of work-arounds that don't involve using postMessage back to my background page? My ideal solution is to have my sandboxed script open a new window and interact with it directly, not with message passing.
I can provide a full example if necessary, but I'm hoping someone might just know off the top of their head. I'm running Chrome 24.0.1312.57 on Mac and 24.0.1312.68 on Ubuntu if that helps.
Thanks,
Hank
Content scripts, by definition, are part of external regular web pages you load so I'm not really sure how your script could work on a "regular web page" but not the content script. Do you mean the code works when you embed it in your own pages, but not in other pages via the content script?
Regardless, if the script is working properly from your background page, you could always try messaging. (more here: http://developer.chrome.com/extensions/messaging.html)
Script for your sandbox/contentscript:
//send message to background page
chrome.extension.sendMessage({todo: "newWindow"});
In background page:
//create a listener
chrome.extension.onMessage.addListener(
function(request, sender) {
if (request.todo === "newWindow") {
//do your stuff here
var win = window.open(); win.document.write('<p>Hello!</p>');
}
});
Per the cross-post here, the issue is indeed that the opened window is given a unique origin. This was intentional as the members of the standards working group (SWG) felt that it would be more secure to not make an exception for about:blank pages where they inherit the sandbox's origin.
However, to get around this issue, at least for my purposes, I can use the following method. First, forget sandboxing. This workaround uses an iframe embedded in a background page with the src url set to data:text/html,.... This gives a unique origin to the iframe so it's no longer in extension space. That means eval can be used and chrome apis cannot be accessed. Unlike in a sandbox, windows opened from the iframe share that same origin as the iframe, allowing created windows to be accessed. For example:
In a background html page:
<html>
<head>
...
<script src="background.js"></script>
...
</head>
<body>
...
<iframe id="myframe"></iframe>
...
</body>
</html>
In background.js:
...
document.getElementById('myframe').setAttribute('src', 'data:text/html,'+
encodeURI('<html><head>'+
'<script src='+chrome.extension.getURL('jquery.js')+'></script>'+
'<script src='+chrome.extension.getURL('myscript.js')+'></script>'+
...
'</head><body></body></html>'
));
...
In myscript.js
jQuery(document).ready(function(){
...
// To receive messages from background.js.
window.addEventListener('message', function(e){ ... } );
// To send messages to background.js.
parent.postMessage({...}, '*');
// To open AND ACCESS a window.
var win = window.open();
win.document.write('Hello'); // Fails in sandbox, works here.
// Eval code, if you want. Can't do this from an extension
// page loaded normally unless you allow eval in your manifest.
// Here, it's okay!
eval( 'var x = window.open(); x.document.write("Hi!")' );
// No chrome apis.
chrome.log( chrome.extension ); // -> undefined
chrome.log( chrome.windows ); // -> undefined
// No direct access to background page (e.g., parent).
chrome.log( parent ); // -> Window with no properties.
...
});