I am trying to debug my angular-cli project but source tab in google chrome developer tools is empty. In the "content script" section is "top" drop down menu visible which you can see on the picture and "google hangouts" which I don't understand why appears here, on the very bottom there is "js" folder which is empty. The same happens to all websites.
what can be the problem?
Thanks in advance.
right click > inspect > setting > preferences >check Enable JavaScript source map checkbox
Related
I created and uploaded a Gmail extension to the Chrome Store and have been trying to test it. I deleted it from my extensions list in Chrome and when I went to go re-download it from the Web Store it said "Added to Chrome" and would not let me re-download it. I found a few solutions that described how to delete cached data on a PC, but I'm using a Mac. Any ideas?
I'm a total newbie at this so any help would be appreciated. Also not a very strong Mac user. Thanks!
Try to restart your Chrome browser, if the extension still not exist, reset the chrome settings to default, you need to do this if apps or extensions you installed changed your settings without your knowledge. Your saved bookmarks and passwords won't be cleared or changed.
Open Chrome.
In the top right, click the icon menu
Click Settings.
At the bottom, click Show advanced settings.
Under the section "Reset settings,” click Reset settings.
In the box that appears, click Reset.
I've made a simple Chrome app that will redirect the user to my website when they run it, but I can't figure out how to put in Chrome. How exactly would I do this?
Note: I only have manifest.json and icon.png files.
You mean you want to install it on your Chrome? If so;
Go to settings/extensions by clicking the menu icon on the top right.
Click on "Load unpacked extension" on the top left of the extensions page.
Select your folder and it should be done.
(Edit: developer mode needs to be on)
Is it possible to open Chrome Developer Tools to inspect a Chrome App ?
All debuggable targets are listed under chrome://inspect/. See the 'Apps' tab.
I managed to do it by following instructions to debug postman chrome app:
Go to chrome://flags/
Search for Debugging for packed apps
Enable this flag
Restart chrome
Then go to your app, right-click anywhere inside of it, and click on the option menu inspect.
To open it by context menu, enable at chrome://flags/#debug-packed-apps
If the app blocks the context menu, find it at chrome://extensions (developer mode) or the Apps and Extensions Developer Tool.
I need to run a web-based app inside Chrome but it must appear as if the app is standalone. I dont want any tools or frames to be visible.
Yes I know I can press F11 but this isnt sufficient as I dont want the tools to appear when I move the mouse to the top of the screen.
Do I need to go to the extents of making a Chrome extension and utilizing a possible fullscreen feature?
From the linux man page:
--app=URL
Runs URL in "app mode": with no browser toolbars.
e.g. invoke it with google-chrome --app=http://example.com
Start Chrome with the --kiosk flag. Then, no borders etc. will be shown. Furthermore, pressing F11 will not exit this mode, so it's the most effective way of running a Kiosk-like app.
chromium --kiosk http://example.com/
Replace chromium with the path of your actual Chrome executable (e.g. chrome.exe).
In the new Chrome (v88) it might be required to add --user-data-dir parameter to remove the title bar, so the line would go like this:
chrome.exe --user-data-dir=c:\temp --kiosk http://google.com
If you open Chrome in app mode, like Trever suggests, then borders will still be visible.
If you want a windowed app with no menus on mac, the steps have changed since #PaulR responded.
The new steps are as follows:
navigate to
chrome://flags
Enable the following two options:
"The new bookmark app system"
"Allow hosted apps to be opened in windows"
Restart Chrome to enable the options.
Then navigate to the page you want to turn into an "app".
In the tools menu (three dots) click More Tools > Add to Applications
Finally, navigate to
chrome://apps
and right click on the icon for the newly added Application. Enable the "Open as window" option.
Go ahead and create the shortcut, then open Chrome Apps chrome://apps. The shortcut icon should be in there. Right click on the app icon and check "Open as window." After that, the shortcut will open as a window.
Credit: Janos_
You can create create shortcuts from Chrome itself....
https://support.google.com/chrome/answer/95710?hl=en-GB
^ this link no longer works.
The feature is called "Create application shortcuts". To enable it in newer versions of Chrome, go to:
chrome://flags/
... using the address bar. Then find "The new bookmark app system" and Disable it. Then click Relaunch Now at the bottom of the screen.
Now, in the "More tools" menu there will be the "Create application shortcuts" menu entry.
There may be another way to do this, but this is just clarifying the method that was supposed to be described in the link.
Like many others have said, --app=<url> should do it for Chrome Version: 83.0.4103.61. The --kiosk option opens a chrome tab, not a borderless "app" window. I'm on macOS Catalina and decided to brew cast install chromium and ran:
chromium --app=https://netflix.com
Unfortunately I could not stream Netflix from Chromium..
I have an extension that has the following files:
content.js, background.js, manifest.json, mystyles.css, jquery-2.0.3.js and icon.png.
I can set breakpoints in the content.js file via the Chrome Debug Tool via the "Sources" tab and via the "Content Scripts" tab. My problem is that I can't find a reference to the "background.js" file, so I can set a breakpoint in it. Can someone tell me what I am overlooking or doing wrong?
References:
I have watched the Chrome Debug Video on YouTube.
I have read the Chrome Tutorial on Debugging.
If you open up a new tab and go to chrome://extensions, you will see a list of installed plugins, including your own. Next to your plugin, there will be a link to "Inspect Views" pointing to a background.html page or a generated one in your case. This will launch a new debug window in Chrome that will allow you to browse to your background.js file and set breakpoints (by clicking on the line number)!