How to use console.log() to debug a Chrome extension? - google-chrome-extension

I'm trying to debug my Chrome extension using
console.log("message");
My extension works fine (for the most part), I'm clicking buttons that call function which perform something. Every function as a consloe.log() debug line.
If I open the chrome console (ctrl + shift + i) after chrome loads, it remains empty, no matter what I do. Chrome is set to developer mode.

Make sure that you are opening the correct dev console. You need to go to the generated background page for the background page console and right click -> inspect popup for the popup console. There was an answer to a similar question with a nice gif, I will link it if I can find it.

Related

How to keep extension pop up to remain open when new tab is clicked

my extension close when link in the extension is clicked
How to keep extension pop up to remain open when new tab is clicked
In general, that's not possible as stated in Chrome Extensions FAQ:
Can extensions keep popups open after the user clicks away from them?
No, popups automatically close when the user focuses on some portion of the browser outside of the popup. There is no way to keep the popup open after the user has clicked away.
However, if you inspect the popup, it will stay open as long as you don't close the Developer Tools window.
For end users, the only thing you could do is use a tab instead of a popup if that works better for your use case, or just inject your code into a specific tab to show your interface on top of/next to a page, as some extensions like Siteimprove do.

Open Chrome Command line without 1st run new tabs

I am using a command line script to open a particular web page in Chrome and send keypresses to that web page
When Google Chrome opens for the 1st time chrome opens up its own Tab e.g. welcome to chrome/login to chrome and this throws everything off.
I dont want any new tabs generated I want only the web page I asked for
Is there a command line switch or method to force chrome to not generate its own tabs. Perhaps registry entry etc?
I have tried some but no success so far
Thanks
Confuseis
Since your question contains the AutoIt tag, I have to assume you want an AutoIt solution.
The best way to do this would be to use chromes --new-window command line switch. This opens a new instance of Chrome, with a single tab pointing to the URL provided, by executing the chrome executable via ShellExecute.
$sPath = #HomeDrive & "\Program Files (x86)\Google\Chrome\Application"
ShellExecute($sPath & '\chrome.exe', '--new-window "https://www.google.com/"', $sPath, "", #SW_MINIMIZE)

Chrome extension, popup does not display correctly for dynamic popup DOM modification

I am building a chrome extension, a simple feature I want it to have is that when some clicks on the extension icon, it finds some info on the current page that my extension is visiting, and send the message from my content script to my popup, and my popup will add those info to it. now I pretty much finished all the work, there is only one problem left which is the layout of my popup does not display correctly. I have some thought about why it happens, I think it is because since the popup opens when you click on the icon, and then it finds the info on the page, and then it sends the message back to my popup, but the size of popup is already defined and displayed, so it does not rend it correctly, am I right? How should I fix it.
I think your content script should retrieve the info from the current page immediately (on load) and send this information to the background script.
The background script can store this information either in a variable, or in localStorage/Chrome storage. When opening the popup you can retrieve this information and show it immediately. This way you would avoid the racing condition.

Any way to remove X button from chrome tabs?

Is there any way to modify chrome tabs to remove the button that closes the tab?
I've read through chrome develope tab. but I don't see any mention of the close button.
Not possible at the moment without forking the whole chromium project. See bug report #50913 (Status: WontFix).
Possible workarounds:
If you right click on a tab you can Pin Tab. This will remove the close button but you can still close it with ctrl+w. Unfortunately, this will also remove the window title.
The close button is removed if the width of the tab gets very small.
Have a look at the same question on SuperUser: How to disable the close (X) button on Google Chrome tabs?.
Maybe you like to look at the source code of Chromium and fix this? I think you have to start here: tab.cc.
Edit: The fix below only worked between Chrome version 69 and 71.
It IS possible now for inactive tabs!
I have had lots of problems while trying to switch tab while having 10-15 of them opened, accidentally closing some important tab with lots of text typed which isn't recovered by Ctrl+Shift+T
Here how to do that:
1) Open the Google Chrome browser and type the following text into the address bar:
chrome://flags/#close-buttons-inactive-tabs
This will open the flags page directly with the relevant setting.
2) Set the option named Close buttons on inactive tabs. Set it to Disabled using the drop down list next to the flag's name.
3) Restart Google Chrome by closing it manually or you can also use the Relaunch button which will appear at the very bottom of the page.
4) The close buttons will disappear from inactive tabs.
Before:
After:
That's it!
Source - https://winaero.com/blog/remove-close-buttons-inactive-tabs-google-chrome/
There are now Chromium-based alternative browsers which offer this - I really like Vivaldi, where not showing the X button is just one of many customization options. Also, because it is Chromium based you can install and use any Chrome extensions. It is perfect if you have many tabs open and need more of the power-user type options.

Inspect popup for extensions removed; debug console eating extension form element inputs

To debug extensions, Chrome used to have a "Inspect popup" menu option available when right clicking the extension icon (top right in the browser). I believe this options was recently removed (possibly with the latest Chrome version 20, which I am using) .
The debug console can still be activated by right clicking any element in the extension popup and selecting "Inspect element". The problem I am experiencing however is that whenever I now have the debug console open, typing into form elements in the popup does not work. Even though the form element seems to have the focus (it has a blinking cursor active), all input typed goes straight to the debug console.
Update: It seems focus is not specifically to the debug console, but to whichever window is below. It's like the extension window is a "stay on top" window, without capturing any input.
Update: 2012-07-24: Updated to 22.0.1215.0 (Official Build 147830) dev and the bug is still there. But yay, Youtube full screen now suddenly works on my dual screen system!
Update 2012-05-09: Upgraded from 20.0.1123 to 20.0.1130.1 dev on Linux x64 (Ubuntu 12.04). Problem still there, and makes debugging extensions a lot harder than needs be. Also confirmed behaviour on older Chrome release (20.0.1105.0). Oh well, maybe it's just me...
Update 2012-05-09 2: Assuming this is a bug, consider adding a background page to your popup and log to that page's console instead until bug gets fixed. At least that makes my life easier for now.
Update: 2012-10-19: As omri writes (and points to), the Inspect Popup option is on it's way to be put back into Chrome, which will hopefully solve this problem (finally).
Could anybody confirm/deny this behavior, and/or suggest possible workarounds?
Open the popup
Right click the popup window and inspect.
Its going to be re-added to chrome
http://code.google.com/p/chromium/issues/detail?id=143349
Update: Un-accepting answer as another user confirmed this behaviour for OSX, so at least it will appear as unsolved on the radar, although there's probably a bug tracker somewhere where this needs to be posted.
This bug is still present on google-chrome-beta (Version 20.0.1132.34 beta). I'm guessing that this has to do with window and popup handling on X11 generally, and is obviously not a high priority bug since it's remained this way for quite a few releases. Closing question.
I am seeing the missing "Inspect Popup" option on right click but, I can edit/enter text in the form fields.
I am wondering if you are having an unrelated problem? If you are using or updating to the new 2.0 Extension Manifest you can encounter issues where inline javascript in the popup fails to fire any longer because of the addition of the content_security_policy defaults. Basically this prevents script injection but also seems to kill all JS in your popup. There are ways around this by changing the way events are handeled in your popup or by changing the default policy. Here's a link to the doc on this: http://code.google.com/chrome/extensions/contentSecurityPolicy.html
This is just a guess because I don't know what's going on in your code but I saw similar things while upgrading my extension recently.
Just upgraded to 22.0.1221.1 (Official Build 149058) dev and the problem seems to have been solved, albeit with a workaround. The old way of right clicking in the popup window and selecting "Inspect Element" to start up the console still grabs all input as originally reported.
However, it seems by right clicking the popup icon, the old "Inspect Popup" seems to be back, and when this is used it does not seem to grab input from the open popup window itself.

Resources