Using Chrome Dev Tools Code Folding Shortcuts - google-chrome-devtools

On the Settings > Preferences > Source we can enable Code Folding on the Chrome Dev. But I didn't find a way to use keyboard shortcuts to, eg. collapse all, etc. Did look for in the Shortcuts section window and in the Full Listings also, but no success. I'm assuming we can't do it on the current version. In case someone knows about it, I'll be very happy to know it too.

There's no such hotkey so try suggesting this feature on https://crbug.com.
Meanwhile you can add it manually:
make sure "code folding" is enabled in devtools settings (in the "Sources" group)
run this code in devtools-on-devtools (see the instruction below)
[
['Shift-Ctrl-[', 'fold'],
['Shift-Ctrl-]', 'unfold'],
['Shift-Ctrl--', 'foldAll'],
['Shift-Ctrl-=', 'unfoldAll'],
].forEach(([key, cmd]) => {
CodeMirror.keyMap['devtools-common'][key] = CodeMirror.commands[cmd];
});
close devtools-on-devtools
This will last only for the current devtools instance.
For convenience you can save the code in snippets and run it later from there or by typing the snippet name in the commands palette (Ctrl-P or Cmd-P hotkey).
How to open devtools-on-devtools:
Open devtools first and switch its Dock side in the menu to a detached (floating) window
in the now detached devtools press CtrlShifti or ⌘⌥i on MacOS,
which will open devtools-on-devtools in a new window

The top answer is great, but chrome devtools has been updated since to use CodeMirror 6, which requires a codeMirror instance to be passed to the functions:
CodeMirror.commands.foldAll();
Uncaught TypeError: Cannot read properties of undefined (reading 'operation')
at CodeMirror.commands.foldAll (foldcode.js:105:8)
at <anonymous>:1:21
line 104-109 from foldcode.js:
CodeMirror.commands.foldAll = function(cm) {
cm.operation(function() {
for (var i = cm.firstLine(), e = cm.lastLine(); i <= e; i++)
cm.foldCode(CodeMirror.Pos(i, 0), null, "fold");
});
};
I could solve it by debugging a codemirror event to save the cm instance as a global variable (temp1), but I would appreciate if someone could have a better solution to this that can be automated.
Edit: I found the codeMirror instance at document.getElementsByClassName("CodeMirror")[1].CodeMirror, so a working solution is:
CodeMirror.commands.foldAll(document.getElementsByClassName("CodeMirror")[1].CodeMirror)
the shortcut setting still doesn't seem to work though.
(with
CodeMirror.keyMap["devtools-common"]["Ctrl-k"]=function()
{let {CodeMirror:instance}=
document.getElementsByClassName("CodeMirror")[1];
CodeMirror.commands.foldAll(instance);
};
)
Edit 2: oh, it just needed capital K, so "Ctrl-K". Now the shortcut works too. hurrah
btw i've commented on the folding feature's thread on chromium bugtracker to include this, because it is incredibly useful for skimming files while editing/reading. No response yet, idk if anyone's even paying attention to comments there anymore:
https://bugs.chromium.org/p/chromium/issues/detail?id=328431

CodeMirror 6 supports the folding shortcuts natively (per foldKeymap):
Ctrl-Shift-[ (Cmd-Alt-[ on macOS): Fold the lines that are selected, if possible.
Ctrl-Shift-] (Cmd-Alt-] on macOS): Unfold folded ranges on selected lines.
Ctrl-Alt-[: Fold all top-level foldable ranges.
Ctrl-Alt-]: Unfold all folded code.

Related

CTRL + hover doesn't show definition for my vscode extension?

I write a VSCode extension to support a new language. It uses registerDefinitionProvider() to register a definition provider. And it works when pressing F12, ctrl + click the symbol, or right-clicks and choosing the "Go to Definition".
But VSCode shows nothing when I use ctrl + hover on the symbol since VSCode 1.67. It works well before 1.67.
It shows nothing since VSCode 1.67
It works well if the VSCode version lower than 1.67
The ts code:
context.subscriptions.push(vscode.languages.registerDefinitionProvider(['test'], {provideDefinition(doc, position, token) {
var word = doc.getText(doc.getWordRangeAtPosition(position));
var rst:vscode.Location[]|undefined = macroManager.getPositionByMacro(word);
return rst;
}}));
I know how to fix this.
constructor Location(uri: Uri, rangeOrPosition: vscode.Range | vscode.Position): vscode.Location
The second parameter of the Location constructor can be Range or Position. Ctrl+ hover shows nothing if it's a Position.
So the code should be:
let range_begin = new vscode.Position(lineNum, 0);
let range_end = new vscode.Position(endLineNum, 0);
let position_range = new vscode.Range(range_begin, range_end);
positionLink.push(new vscode.Location(value.resourceUri, position_range));
check your extensions. it happens when the VS Code built in extensions are disabled.
search #builtin in the extensions search bar and make sure every extension is enabled

Is there anyway to check inactive terminalEditors in when arg in keybindings.json in VScode?

I want to createTerminalEditor if there is no terminalEditor opened yet.
Note: I'm talking about terminalEditor and not terminal.
So, I'm looking for a when arg which says something like editorAlreadyExists != terminalEditor, just like there is activeEditor which aceepts string of terminalEditor.
Is there anyway to achieve this?
Here is activeEditor example for reference, but I want to check if terminalEditor exists in all the already opened editors, not just a activeEditor.
{
"key": "ctrl+`",
"command": "workbench.action.createTerminalEditor",
"when": "activeEditor != terminalEditor"
},
I see that there is a when clause for:
terminalEditorFocus: true/false
which doesn't look like it would help except for the fact that it isn't in the list (via Developer: Inspect Context Keys) at all when there is no terminal editor open. So I thought maybe there was a keybinding when clause that could exploit this. But I tried all kinds of thing, like whether it was null or undefined or the empty string or neither true nor false, etc. but nothing worked. I think if the key terminalEditorFocus doesn't exist, then nothing at all is delivered to the keybinding resolver and it always fails.
You could file an issue asking for a specific terminalEditorExists sort of when clause.
There will be another way. There is a presently experimental api to access all the open tabs. See proposed api. So you could write an extension that checks all the open tabs and fires the workbench.action.createTerminalEditor command if none are a terminalEditor. It works right now in the Insiders Build, but when it will go final I don't know - it seems pretty solid now. Issue: Tab Model API.
const tabs = vscode.window.tabs;
const openTerminalEditor = tabs.some(tab => tab.viewId === 'terminalEditor'); // true/false
Then you could either set your own context key with setContext or run the command.

How to trigger activation of the vscode markdown extension

In my VS Code extension I have some code that uses the built in Markdown extension. I capture a reference to it by registering as a markdown plugin and putting the following code at the end of my extension's activate method.
return {
extendMarkdownIt(mdparam: any) {
return md = mdparam;
}
};
Markdown calls this when it activates.
Generally this is not a problem. Most of the use cases for my extension involve a markdown file already loaded into the active editor, and the loading of this file triggers activation of the markdown extension.
However there are some legitimate use cases in which this is not so.
I need to programmatically trigger activation of the markdown extension. Some of these cases involve having a different kind of file open in the active editor so loading a markdown file into it is not an acceptable option.
Some potential strategies:
Change the language mode. There is a command workbench.action.editor.changeLanguageMode but no documentation. I tried
vscode.commands.executeCommand('workbench.action.editor.changeLanguageMode', 'md');
but this triggers the UI
so I tried a pattern I've seen in the parameters of other commands and added , true. This suppressed the UI but doesn't seem to work.
Load a markdown file into a new editor then close it again. This should work, but it's ugly.
Put something in the contributions section of my extension that changes the activation trigger for the markdown extension so that it is triggered by the other file types on which my extension operates.
Of these options my favourite would be 3 but I don't even know whether this is even possible. Option 1 is hampered by the crappy (in many cases non-existent) documentation for vscode internal commands.
Option 1 it is. If anyone knows how to do option 3 please tell, the solution below is a ghastly hack.
It is possible to trigger activation of the Markdown extension by changing the document language of any open editor to markdown. In the event that there are no open editors a document with the markdown language set can be created in memory and loaded into an editor.
If VS Code is busy loading extensions activation can take several hundred milliseconds so the best thing to do is watch the variable into which markdown-it is captured.
The variable md is a global (global to my extension, not the whole of VS Code) into which a reference is acquired as shown in the question.
let ed = vscode.window.activeTextEditor;
if (ed) {
let lid = ed.document.languageId;
if (lid !== "markdown") {
vscode.languages.setTextDocumentLanguage(ed.document, "markdown").then(
function waitForMd() {
if (md) {
vscode.languages.setTextDocumentLanguage(ed!.document, lid);
} else {
setTimeout(waitForMd, 100);
}
}
);
}
} else {
vscode.workspace.openTextDocument({ language: "markdown" }).then(doc => {
vscode.window.showTextDocument(doc).then(
function waitForMd() {
if (md) {
vscode.commands.executeCommand("workbench.action.closeActiveEditor");
} else {
setTimeout(waitForMd, 100);
}
});
});
}
Once the capture completes we can restore the true language or close the editor as appropriate. To be realistic the second case (no active editor) is unlikely because my own extension won't activate until you load something. At any rate it works stably now. The larger project is progressing nicely.

How to prevent VS Code from putting '{' on new line in C++ formatting?

If I write some code
void function() {
....
}
when I format the entire page using Shift+Alt+F, it becomes
void function()
{
....
}
How do I prevent that initial opening bracket from going to a new line?
Assuming you're using the MS C++ extension, these are the docs you're after. In > short, you'd need to either:
change C_Cpp.clang_format_fallbackStyle to one of: LLVM, Google, Chromium, > Mozilla, WebKit - and see if one matches your preferences.
find/make a custom .clang-format file
see clang-format docs for more details: > https://clang.llvm.org/docs/ClangFormatStyleOptions.html
https://www.reddit.com/r/vscode/comments/9rqj02/prevent_vscode_from_putting_c_curly_braces_on_new/

Turn off auto-closing parentheses in ipython

I stay up-to-date with ipython's dev branch (because ipython is pretty much the most awesome thing ever). Fairly recently (before yesterday's awesome ipython 2.0 release) I noticed that it has started to automatically close parentheses, brackets, quotes, etc., as I type them. It happens in both terminal [nothing else I use in terminal does it] and notebook sessions, so I assume it was an intentional choice on the part of the developers. I can respect that other people might like this feature, but it drives me completely nuts.
I can't find any option for it in the configuration files. I can't even google for it, because I don't know what it's called. The only thing that comes up is the different feature of automatic parentheses. I did actually find this question, but that's old, and suggests that the behavior I'm seeing can't happen.
How can I turn this feature off?
[I mostly just use the notebook interface anyway, so just turning it off there would be fine, but I'd prefer to turn it off in both notebooks and ipython sessions at the terminal.]
#minrk's answer is the meat and bones of the fix, but you'll need to wrap it in an initialization callback, at least with IPython-3.1.0. In your custom.js:
require(['base/js/namespace', 'base/js/events'], function(IPython, events) {
events.on('app_initialized.NotebookApp', function() {
IPython.CodeCell.options_default.cm_config.autoCloseBrackets = false;
});
});
Thanks #Mike for your comment about IPython's RequireJS dependency loading and the pointer to a better formulation at IPython/Jupyter Installing Extensions.
Edit for Jupyter 4.0.x:
The current IPython notebook implementation, Jupyter 4.0.0, revamped JS customizations. It now uses ~/.jupyter/custom/custom.js by default, and you'll need to replace that whole require(... events.on(...)) snippet with just the following in global scope:
IPython.CodeCell.options_default.cm_config.autoCloseBrackets = false;
Likewise, if you want to use jQuery to manipulate anything, just use the jQuery global directly. For example, I like to hide the fixed header by default, which gives me another 40px of space for my code, which I find a bit more valuable than looking at the Jupyter logo all the time:
jQuery('#header-container').hide();
Edit for Jupyter ≥ 4.0.6 (but < Jupyter Lab):
If the custom.js solution above doesn't work, try adding the following to your ~/.jupyter/nbconfig/notebook.json:
{
"CodeCell": {
"cm_config": {
"autoCloseBrackets": false
}
}
}
The notebook behavior is the result of the CodeMirror autoCloseBrackets plugin. You can turn this off by editing (create it with ipython profile create if you haven't already) ~/.ipython/profile_default/static/custom/custom.js and adding:
if (IPython.CodeCell) {
IPython.CodeCell.options_default.cm_config.autoCloseBrackets = false;
}
As for the terminal, I don't see the parenthesis behavior you describe. Do you perhaps have a PYTHONSTARTUP defined? IPython executes this file by default, which you can disable by adding to ~/.ipython/profile_default/ipython_config.py:
c.InteractiveShellApp.exec_PYTHONSTARTUP = False
If you want to do it just from python:
from notebook.services.config import ConfigManager
c = ConfigManager()
c.update('notebook', {"CodeCell": {"cm_config": {"autoCloseBrackets": False}}})
This is what works for me in Jupyter 4.0.6:
require(['notebook/js/codecell'], function (codecell) {
codecell.CodeCell.options_default.cm_config.autoCloseBrackets = false;
})
in ~/.jupyter/custom/custom.js.
BTW, If you additionally want to switch off the syntax higlighting of matching parentheses:
codecell.CodeCell.options_default.cm_config.matchBrackets = false;
In the JupyterLab Notebook you can turn off the autoClosingBrackets plugin in the settings menu. Go to Settings --> Advanced Settings Editor and add the following in the User Overrides section:
{
"codeCellConfig": {
"autoClosingBrackets": false
}
}
Screenshot
This worked with JupyterLab 0.32.1 and jupyter_core 4.4.0
The above suggestions didn't worked for me in Jupyter 4.3.0 with Jupyter Notebook 5.0.0
I found that I needed to create a file called ~/.jupyter/custom/custom.js with the following contents:
var cell = Jupyter.notebook.get_selected_cell();
var patch = {
CodeCell: {
cm_config: {
autoCloseBrackets: false,
}
}
}
cell.config.update(patch);
Note that the directory ~/.juypter/custom didn't exist before I did this.
This was hacked together from suggestions in v5.0 docs, and for future readers these are the latest
For Jupyter Notebook 5.1 use the same thing as for 4.2, i.e. put the following snippet into ~/.jupyter/custom/custom.js:
require(['notebook/js/codecell'], function (codecell) {
codecell.CodeCell.options_default.cm_config.autoCloseBrackets = false;
})
I found it was not mentioned in other answers. In my case(OS X, Jupyter 4.2.0), custom.js is located in
~/anaconda/lib/python3.5/site-packages/notebook/static/custom/custom.js
I think it may help somebody like me.
We can do that from jupyter console, try it.