I am not able to debug my Karma unit tests in WebStorm. How can I fix it?
I see this message when I click the debug button:
I checked How do I know what's wrong. chrome://extensions shows:
Clicking 'background page' shows:
This SO question showed answers which helped me realize the solution.
The problem was that the JetBrains plugin was trying to debug on port 63343 (not sure why). I noticed Webstorm was serving on port 63342.
To fix the port mismatch, I opened the chrome://extensions tab, found JetBrains IDE plugin, clicked "Options". This opened a new tab where I could adjust the port that the JetBrains IDE plugin was using. I set the port to be the same value that Webstorm was using, then I clicked Apply.
Related
The Network tab in the Google Chrome Developer Tools window shows almost all http requests made, but does not seem to capture anything when the http request results in a file being downloaded.
How can I capture download requests in Google Chrome?
I am sure that your file download is happening by opening a new window. Network tab of developer tools only captures the request of current tab.
For example, following link will download the file but it will not appear in the network tab.
Click Here to Download file
Similar type of things can be done using javascript using (window.open, dynamic hyperlink/iframe), which will not appear in the network tab.
Various Javascript approach you can check here
I have observed similar behaviour in my past.
You cane check the chrome://net-internals in older version of chrome and chrome://net-export/ in the newer version of chrome to monitor any type of request being made by any instance/tab of chrome.
Note: You can check the internal events of chrome by typing chrome://net-export/ in the url box of chrome.
I have faced similar issue, and here's how I solved it.
Issue:
Debug an anchor link that download file upon clicking it.
Debugging Process:
Steps
Go to chrome://settings/content/automaticDownloads?search=download and disable auto download
Open chrome dev tools, Settings -> Global -> Auto-open DevTools for popup
Open chrome dev tools, Settings -> Console -> Preserve log upon navigation
I hope that helps.
This works without changing any settings of Chrome for a single download-request. It however does not automatically display all download-requests triggered in a different tab or window.
Trigger the download in the GUI.
Open Chrome's download history (chrome://downloads/).
Right-click your download and Copy link address.
Open DevTools, paste the link into the address bar of the corresopnding Chrome tab and execute it.
The download-request shows in the DevTools.
You can use Fiddler for a more grainy look into your network traffic:
https://www.telerik.com/fiddler
*I don't work for fiddler
What do you mean by capture?
If you meant that nothing showed up in preview tab or in response tab, it's because the response is the actual file being downloaded.
I've recently tried downloading Oracle JDK 11 with dev-tools open in network tab and here is what I got:
I have no particular configuration in this version of Chrome (Versione 71.0.3578.98 (Build ufficiale) (a 64 bit))
As #jlvaquero said, if you're trying to get as much details as possibile, try WireShark on your own local pc.
I can see it in my case by downloading a document from google drive and limit download speed to 3G.
First step : Open with f12 the programmer toolbar.
Step Two : Go to the networking tab and locate the video in question. To help filter by clicking on media.
Step Three : If the video has no protection you can right click, click open on a new tab and download with crtl + s. If this does not work is because the video has parameters to prevent it from doing so. In that case right click again, go to the COPY session and then click copy as cURL.
Step Four : Go to your linux terminal (If you use windows turn around), if you don't have curl installed type sudo apt install curl and then paste the copied CURL command from the developer bar.
Step 5 : Before executing the command you need to add at the end of it --output video.mp4 --insecure as it is a binary. The insecure parameter is if you have problem with certificate. Wait for the download to complete and be happy!
Obs: This link can help you: https://www.hanselman.com/blog/HowToDownloadEmbeddedVideosWithF12ToolsInYourBrowser.aspx
Google Chrome has been updated to support downloads in the Network Tab
This question was asked in February of 2018, and at the time Google Chrome did not support downloads in the Network tab.
I have verified this by downloading the 64.0.3282.140 build of Google Chrome.
And then attempted to download Spotify as an example and found no event appear in the network tab.
Any Google Chrome version released in 2019 or later will capture all download requests in the Network tab.
JetBrains IntelliJ IDEA sometimes loses its own JetBrains IDE Support plugin in Chrome. Upon debugging in IDEA, Chrome complains that:
hmhgeddbohgjknpmjagkdomcpobmllji is blocked
Requests to the server have been blocked by an extension
and stays on this page:
chrome-extension://hmhgeddbohgjknpmjagkdomcpobmllji/loading.html?__QUERY__
Where hmhgeddbohgjknpmjagkdomcpobmllji is JetBrains' plugin ID.
Instead of redirecting to the target page of the form:
http://localhost:63342/__PROJECT__/__PATH__/index.html
Restarting Google Chrome or disabling-and-enabling IDE Support plugin helps. IDEA "finds" Chrome again and Debug workflow works as intended.
Another possible problem is a failed authorization.
To debug a URL like this:
http://localhost:63342/__PROJECT__/__PATH__/index.html
Open it in the browser before starting to debug. It'll give 404 Not Found. Then switch back to IDEA and it will offer you to Copy authorization URL to clipboard:
http://localhost:63342/__PROJECT__/__PATH__/index.html?_ijt=__KEY__
Open this URL.
After this manual authentication is complete, IntelliJ IDEA should be able to debug index.html in Chrome.
IDEA always opens index.html for debugging in the browser window where the latest authentication happened. E.g., in a Chrome Incognito window, instead of a Chrome "normal" window, if you've just authorized IDEA in Incognito.
Going incognito may require an additional setup:
https://intellij-support.jetbrains.com/hc/en-us/community/posts/206201319-launching-chrome-incognito-in-intellij-12
i did follow all the answers on
here
and nothing worked for me... nothing at all.
I'm on windows 10, using chrome version 54.0.2840.99 m
trying to access my QNAP TS-453a on local on a static ip address (10.1.1.1)
https://10.1.1.1/cgi-bin/
I tried using imported certificates, self signed, export and import the default one, etc nothing works
Some help would be really really appreciated
Valid as of Chrome v58.0.3029:
Visit the site in Chrome.
Open Developer Tools (F12)
Navigate to Security tab
Click "View certificate"
Click Details > Copy to file
Choose a save location on your local machine
Open Chrome settings
Toggle "Show Advanced Settings" (bottom of screen)
Navigate to HTTPS/SSL > Manage certificates
Click "Trusted Root Certification Authorities"
Click Import
Navigate to the cert you just stored
Quit Chrome (Ctrl+Shift+Q) and re-visit your site
NOTE:
Chrome recently (as of 05/15/17) began to require that the cert's subjectAltName parameter be filled. This question received an answer that tells you how to do so.
In general, to troubleshoot this kind of problem, open Developer Tools, go to Security tab, and you will see what Chrome deems wrong with that certificate.
It is likely that it doesn't include a subjectAltName extension, and the solution for adding one is here: https://stackoverflow.com/a/56530824/2873507
After googling for answers and trying everything that was suggested, I still can't resolve this issue.
What I tried:
Downloaded/installed/enabled Live Edit plugin
Configured a JavaScript Debug configuration
Changed Update to Auto in (ms) and checked Restart if hotswap fails
Specified the same port I use in JetBrains IDE Support in Debugger and checked Can accept external connections
Tried Updating Application (CTRL+F10)
Now the thing is, after I save the CSS file and open the Development tools panel in Chrome, I can see the change applied in Styles tab, but the browser doesn't render it. I tried checking Enable continuous page repainting, but it didn't change anything.
HTML, PHP and inline CSS changes do update.
Software versions:
PhpStorm 8.0.3
Chrome 42.0.2311.135
JetBrains IDE Support 2.0.8
I found the new change that you can't install Chrome extensions/userscripts without saving them and dragging them into Chrome quite annoying. As such I have set forth to revert this to the old way it was.
I read the documentation here: http://www.chromium.org/administrators/policy-list-3#ExtensionInstallSources that says to add a registry key and so I have done, as shown below. However when attempting to install an extension I still get an error that they can only be installed from the Chrome webstore. Did I add the registry entries wrong or something?
[HKEY_LOCAL_MACHINE\SOFTWARE\Policies\Google\Chrome\ExtensionInstallSources]
"1"="http://*"
"2"="https://*"
This answer is obsolete as of Chrome 36
Instead of editing the registry, you can also make Chrome to behave in the old way via the --enable-easy-off-store-extension-install flag.
Under Windows, create a shortcut to your Chrome executable. Then edit the shortcut, and append --enable-easy-off-store-extension-install to "Target". See the screenshot below:
Some observations:
I've added the --enable-easy-off-store-extension-install flag after chrome.exe.
After starting Chrome, I visited a website that links to a .crx file that is not hosted in the Chrome web store.
Because of the flag, Chrome 20 doesn't show the "Extensions, apps, and user scripts can only be added from the Chrome Web Store" message any more. Instead (see bottom), Chrome asks me whether it's OK to install the extension - exactely as before.
This command line switch also works for Chromium/Chrome, under Linux and OSX.
If you ever find yourself in the situation where the --enable-easy-off-store-extension-install flag doesn't work (e.g. future version?) or you don't want to use it, then there is an alternative method.
You can install extensions with a plain vanilla install of Chrome by dragging .CRX extension files onto the Extensions panel in Settings.