How to create Windows shortcut for chrome-devtools link? - node.js

Instead of copying and pasting the link for the chrome-devtools inspector (for use with node.js) each time, is it possible to create a shortcut link to access it?
I've tried the normal way to create a shortcut and if I start the url with http://devtools/..., it opens that URL, however when the "http://devtools" is changed to "chrome-devtools://devtools" (which is required for inspector to work), the chrome shortcut just opens up the default page as if it doesn't see this url.
So using this in the target for the shortcut:
"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" chrome-devtools://devtools/remote/serve_file/#521e5b7e2b7cd66e4006a8a56cb9c4e5534a5ef/inspector.html?experiments=true&v8only=true&ws=localhost:9229/node
results in the url being ignored, but changing the:
"chrome-devtools://"
to
"http://"
causes the url to be used although it isn't valid since it has to begin with "chrome-devtools://".
So it looks like shortcuts only use site addresses that are not prefixed with "chrome-devtools://". I've tried putting quotes around the url, but that doesn't solve it.
Does anyone know how to make this work?
I'm switching from using node-inspector for debugging to google-chrome-devtools since node-inspector no longer works with the latest version of node.js and support seems to be dropping in favor of the new --inspect option on node.js.
Environment is Windows 10, node.js v6.3.1, Chrome version 53.0.2785.116 m

Related

Visual Studio Code DDEV and auto reload on Linux

I'm using DDEV with Visual Studio Code and I tried to configure Live Server Extension to automatically auto reload page that I'm working on in Chrome when I hit save in VSC, but it doesn't seem to work with PHP.
Is there a way to configure this to work with DDEV?
I can't seam to find any info on this issue.
Thanks
I've managed to do it another way, with guard and guard-liveguard on linux.
The workflow was:
guard installation
guard-livereload installation
Installation was not quite straightforward, but you can follow the instructions in Terminal and install what's missing if it tells you so.
Guard placed Guardfile inside of /home/user directory so I edited it to contain only this, regarding livereload pard:
guard 'livereload' do
watch(%r{.+\.(css|scss|html|php|js)$})
end
Then I installed Liveguard Google Chrome Browser Extension from here:
http://livereload.com/extensions/
Under settings I had to enable "Allow access to file URLs".
Also, you have to press liveguard extension icon in Chrome in order for it to track changes.
That's about it, now when I edit any of the file types entered in Guardfile (you can edit and add what you need, of course) it automatically reloads my Chrome window whit the edited page opened.

Stop node-debug from opening a new browser window

The command:
node-debug sls offline
opens a new browser window every time it is run.
How do we stop it from opening a new window every time? I want to reuse the existing window!
This is a known issue with node inspector. Take a look here.
Since 0.9.0 we use https://github.com/benderjs/browser-launcher2 to
start the browser, and make sure it's Chrome/Chromium/Opera (i.e. the
browsers that can properly render node inspector; we detect installed
browsers in the system and choose the most appropriate one; earlier we
used opener module which just delegated opening the browser to the OS,
which would open the defaul browser, which could have been e.g.
Firefox) and this could be the reason why the behavior has changed.
browser-launcher2 actually does a bit more than just launching a
browser, for instance it creates a new profile for Chrome in a
subfolder of ~/ - this is probably the issue that #CalvinScott
reported (i.e. Chrome that was opened was the new profile created by
browser-launcher, not your original profile; you should be able to
open your original profile of Chrome normally)
Also, you may consider this:
Since version 6.3, Node.js provides a buit-in DevTools-based debugger
which mostly deprecates Node Inspector, see e.g. this blog post to get
started. The built-in debugger is developed directly by the
V8/Chromium team and provides certain advanced features (e.g.
long/async stack traces) that are too difficult to implement in Node
Inspector.

Reuse/restart the same node inspect session

Once a node.js program has run to completion in the context of an --inspect session (i.e. via the Chrome dev tools debugger) is it possible to re-start it without having to re-issue the --inspect command from the command-line?
The issue with re-issuing an --inspect command is that it generates a different chrome url every time and one has to then copy-paste this into Chrome each time. Ideally I want to be able to push F5 to re-start the chrome debug session.
So two issues:
I cannot restart the debug session without killing the current (i.e. no way to just refresh).
I have to copy paste the url into chrome each time I start a new session. (not as bad as issue 1.)
Here's a couple of options for you, though neither will provide you with a simple F5 refresh, both are significantly better than copy/pasting the new URL generated by the --inspect flag.
The most optimal solution is installing this extension for Chrome or Opera: https://chrome.google.com/webstore/detail/nim-node-inspector-manage/gnhhdgbaldcilmgcpfddgdbkhjohddkj
This will manage the node inspector for you. Just click the resulting toolbar icon and select "Auto" from the toggle switch. Your browser will then open the Chrome DevTools in inspection mode whenever your node server generates an inspection URL.
If you want to go the low-tech (and more manual) route, or don't want to install a Chrome extension, just open your Chrome to "chrome://inspect", wait a moment, and you'll get a list under Remote Target that will include your Node server. Just click the "inspect" link there, and the DevTools will open with the current URL. The downside of this method is you'll need to reclick that "inspect" link every time your server restarts. It avoids copy/pasting URLs, but still involves manual labor.
It's also significant to note that if you simply update the url of your inspector with the new ID, it will also work.
When you restart node, you'll get something like this:
Debugger listening on ws://127.0.0.1:9222/72c791b7-178f-47e8-93b1-d1be4d5ffe1e
The bit after the port/ is what you want. Replace that code in your inspector's url and it will connect to the latest session.

LiveReload on Sublime Text 3

LiveReload seems not to be working on sublime text 3 when I download it from the package control.
I found this link (https://github.com/dz0ny/LiveReload-sublimetext2/tree/devel) on github, but there's no info on how to do it on windows (I'm on W7). Is it possible, and if so, how can I do it?
Thanks!
After a lot of trial and error I've managed to get LiveReload working on Windows 8 + Sublime Text 3!
Get the files from the devel branch with the link.
Put those files in your Packages directory: C:\Users\[YOUR USER NAME]\AppData\Roaming\Sublime Text 3\Packages
Restart Sublime Text 3
Enable the 'Simple reload' plugin. You have to repeat this step every time you restart Sublime Text. To do this:
Open the command palette with Ctrl+Shift+P
Type LiveReload
When 'enable/disable plugins' is highlighted, hit Enter.
If you have the browser plugin installed, changes to your files should now immediately be shown upon save. You may also decided to insert the JS snippet, which you can do very easily through the command palette!
I've seen comments about Windows Firewall blocking the localhost with LiveReload. I haven't really had this issue, but I disabled the Firewall the first time, just to be sure. When I re-enabled it and restarted LiveReload, Windows Firewall showed a dialog asking me to refuse or allow the plugin to make connections. So now everything works fine even with the firewall up.
It's actually pretty simple.
The answer given by kslstn and NEKEY are right, but are missing a crucial step if you are working on a local project.
So, after installing LiveReload on sublime text and installing the chrome extension and enabling both of them, make sure, in the chrome extensions page, to enable access to file URLs.
You cannot use Package Control to install LiveReload for Sublime Text 3, it doesn't work correctly.
This method works though:
Navigate to https://github.com/dz0ny/LiveReload-sublimetext2/tree/devel and download the whole devel branch by clicking on "Download ZIP".
Extract contents of the archive to: "%APPDATA%\Sublime Text 3\Packages" and open that Packages folder.
Rename "LiveReload-sublimetext2-devel" folder to "LiveReload", this is an important step to make it work (name has to match).
Restart Sublime Text 3, Ctrl+Shift+P, "LiveReload: Enable/Disable Plugins", enable SimpleReload, ENJOY the amount of time saved by not switching to browser every time you change a line of code.
P.S. You do need to get the LiveReload Google Chrome plugin, just search for it on Google Chrome Extensions Web Store.
You have to download extension for your browser I've found these:
Safari : http://download.livereload.com/2.0.9/LiveReload-2.0.9.safariextz
Firefox : http://download.livereload.com/2.0.8/LiveReload-2.0.8.xpi
Chrome : https://chrome.google.com/webstore/detail/livereload/jnihajbhpnppcggbcgedagnkighmdlei
More info Here https://sublime.wbond.net/packages/LiveReload.
If I understand it correctly, it works via Sockets, so you can't do anything without browser extension.

Launching a web page in a different process

I want to launch the browser in a different process when a particular link is clicked on the page. When I checked the net I found the following tip: http://www.dslreports.com/faq/3849 . But there we have to change the registry. Is there any simple way of doing this without touching the registry?
If you use the Google Chrome browser, each new window or tab runs in a separate process. Internet Explorer version 8 will do the same (it's currently in the second beta round).
Earlier versions of IE will run a new window in a separate process if it is launched from, say, the Start menu or the command line, or a link in an email (but not by clicking a link within IE). I imagine you could create a proxy that the client would run through, which would intercept the links you care about and launch them by running a command line request. That seems like more trouble than mucking with the registry though (assuming that registry change still works -- looks like your link is from 2002).
I don't believe this is possible unless you change the client computer setup or software it's running.
Why do you want to do this?

Resources