I use the Chrome DevTools to edit my large JavaScript file.
Is there a way to set Bookmarks in the code like in Visual Studio (see the hotkeys on https://stackoverflow.com/a/926065 or even better https://stackoverflow.com/a/38419034)?
Interesting! No, DevTools doesn't have official support for this one. I filed a feature request: https://crbug.com/963682
Update
We don't have official support for this feature, but there is a workaround.
Use a line-of-code breakpoint as your "bookmark".
Disable that breakpoint from the Breakpoints pane.
Click the preview to jump to that line of code.
P.S. I tweeted this workaround idea. Thank you for the inspiration.
Related
I can't find the option to blackbox code anywhere on the chrome developer tools. It also doesn't give me the option when I right-click a file. I am using the latest version.
This link that was posted 3 days ago states the e is simply a "blackbox" tab in settings, but it isn't there for me. https://developers.google.com/web/tools/chrome-devtools/javascript/step-code
There is also no "Manage framework blackboxing" option in general settings as stated in various guides.
Can anyone help? I can't see any posts online saying it has been removed.
Thanks!
Screenshot of my settings menu
"Blackbox script" was removed from Chrome at some point after Feb 2016. This is a bug in Chrome. Please star it.
As a workaround, you can double-click the offending script, then right click on its source code in the code pane, and choose "Blackbox script" from there.
As of this post, Chrome has once again refactored this function. It has been renamed to Framework Ignore List.
Open chrome settings (or press F1)
You will see Blackboxing in the left pane.
It is currently called "Add script to ignore list":
Is there way to highlighting or moving caret to appropriate line of code in sublime when i inspect html using chrome devtools inspector?
No, this kind of functionality isn't possible. I have this answer which explains why this kind of functionality is infeasible.
Is it possible to use the supper handy (hjkl, A, $, vi, etc) inside Chrome DevTools?
More precisely the source panel and console?
I'm using Vimium, which is great, but when doing web dev in the Chrome DevTools I can't use any vi action.
Developer Advocate for DevTools here. This is not currently possible. Open a bug if you want this feature. Please link to the bug if you open one, so that others can star it and comment on it. I'd recommend scoping it to the Sources panel, only. Otherwise it'd probably be too big of an undertaking.
There are still no vim keybindings available in the Chrome Dev Tools settings, in the opposite to the Firefox Developer Tools, where you currently can choose between standard, emacs, vim and sublime text keybindings out of the box.
However, there is some node.js solution, which allows to remote control the Chrome Dev Tools from neovim, see vim-chrome-devtools. It may serve as an alternative until Google perhaps some day provides Vim support.
By the way, I thought, Bram Moolenaar, the Developer of Vim, is still hired by Google? ...
Vimium - The Hacker's Browser. Vimium provides keyboard shortcuts for navigation and control in the spirit of Vim.
here
Checking the list
https://developers.google.com/chrome-developer-tools/docs/shortcuts?csw=1#sources-panel
I cannot find any way to navigate through the source files inside Chrome Dev Tools. Anyone with an idea how to switch source files without using the mouse?
Ctrl-P / Ctrl-O shortcut will bring up a Goto-Source dialog.
To my knowledge there is no keyboard shortcut for doing this. I would know since I have recently updated that page multiple times to add or change some shortcuts.
I'm pretty sure there's no command you can configure either.
I'd suggest opening a ticket for it if you would like to see this added.
I love chrome dev tool, it has been a huge productivity boost for me. I would love to find out if there is any plugin or way to get it to do auto-complete on javascript object (intelisense) and syntax highlighting in live edit mode? In the console you can press tab to complete a javascript object, property or method, but that does not seem to be available in live edit mode.
Thanks!
Auto-completion in the CodeMirror editor (should be enabled in the Settings) was landed yesterday behind a DevTools experiment "Enable text editor autocompletion" and should appear in the next Chrome Canary.
Regarding the syntax highlight, I'm not quite sure what your case is, since we always highlight JavaScript sources.