How to disable highlight of full string in VS Code? - visual-studio-code

I have an issue with double clicking and highlighting in VS Code (v 1.71.2).
Sometimes the double-click does not select the word double-clicked.
In this screen recording you can see the issue:
Every time I used a double click.
First time the word "Condition" was not selected, but the whole string literal.
Then it was selected but the whole line was highlighted and when copying, only "Condition" would be pasted. That is correct.
The time that the word "Condition" was colored in fuchsia is the correct one but I want only that word to be highlighted instead of the entire string.
Anyone know the setting for this?

This issue was reported and fixed already, see:
Double Clicking On A Word Does Select The Entire String, Not Just The Word · Issue #125052 · microsoft/vscode · GitHub
Try to re-install the version 1.71.2 for release "August 2022 Recovery 2" and see if double-click selection works as expected.
Note that different click-counts have different outcomes:
double-click should select the word (using configured word-separators)
triple-click should select the entire string
quadruple-click should select the entire text
Configure word-separators with property editor.wordSeparators from preferences: Visual Studio Code—Customizing word separators
See also related: Double-click to select text does not always work · Issue #84319 · microsoft/vscode · GitHub.
To have finer control over selecting text you can use keyboard shortcuts like explained in Select all text between quotes in VS Code?.

I concluded that the issue was that the string was highlighted due to the cursor being placed somewhere inside the string.
To disable this, I disabled the Occurrences Highlight ("editor.occurrencesHighlight": false)
By doing so, the editor did not highlight open/closing tags though.
The (partial) solution to this was to install the extension Highlight Matching Tag

Related

VS Code multi-line select past ends of lines

I've been transitioning to using VS Code for my python projects after previously working with the full Visual Studio, and some of the key bindings/features I'm used to in Visual Studio I can't find the equivalent for in VS Code. I'm not sure if the bindings are different or if the feature doesn't exist.
One feature in particular that I can't figure out is if it is possible to do multi-line select past line endings. In Visual Studio, using Alt + Click + Drag, lets you create a multi-line cursor or box selection, that can extend past line ends, implicitly adding spaces as needed so that the right-most side of the box stays uniform. In VS Code, if you drag the selection past the end of a line, the selection box won't go past the end of the line, even if other lines in the selection extend past it. In Visual Studio, this feature even goes further, as you could Alt + Click + Drag even in areas with no characters as all, creating a multiline cursor or box selection to the right of all existing line ends.
This isn't an essential feature, but it's very handy in making code easy to read. For example, when assigning several dictionary entries all at once, with varying key lengths. Is it possible to do something like this in VS Code?
Edit: The feature I'm looking for is virtual spaces (thank you Mark for providing the feature name), which seems to be an outstanding feature request in VS Code.
The short answer is no, vscode does not have a box select, past line ends, built-in. VS Code does not have the concept of virtual spaces which would be necessary to make this work yet.
Below is the issue, lots of comments, not that many upvotes. Upvote it.
https://github.com/microsoft/vscode/issues/5402

VSCode will copy full line when only a word is selected (single click)

I'm on OSX and running Version 1.42.0 of Visual Studio Code. I have noticed that when I single click a word it will highlight. But if I copy CMD + c and then paste CMD+v, the full line will be in the clipboard. This causes problems from time to time, when the screen has given me every indication that I have only selected a single word. Is there some setting that I can set that will make the default behavior to select a word on a single quote and never ghost select a full line?
What it looks like when I single click a word:
And what it looks like after I've copied and pasted:
After filing an issue, it turns out that this behavior is by design.
The word the cursor is on (from a single click) is highlighted along with every occurrence of that word. The word is not selected (that would be a deeper blue).
By default copying without a selection copies the current line.
This in my opinion is an Accessibility issue, as there are strong visual clues that a word is selected. I have found that the behavior can be made more intuitive if you set these to settings.
// Controls whether copying without a selection copies the current line.
"editor.emptySelectionClipboard": false,
// Controls whether the editor should highlight semantic symbol occurrences.
"editor.occurrencesHighlight": false
With these two settings the word the cursor is on will not be highlighted (nor any other occurrences of that word). And if you do happen to copy, with an empty selection, the editor will behave similar to how other applications behave and not copy the current line.

Any way to manually trigger highlighting of semantic symbol occurrence in Visual Studio Code?

In VSCode, when you place cursor inside a symbol (variables, functions, etc), all occurrence of the same symbol will be highlighted.
This feature is somewhat useful but annoying as well. Even I can make it less obtrusive by customizing the color theme in settings.json, it will suppress the selection highlighting when you select a variable by double clicking it with mouse cursor.
I've learned that I can completely disable this feature by adding "editor.occurrencesHighlight":false in settings.json, but this feature is still useful because it can label occurrences of a symbol with different color, to represent read/write status of each occurrence.
So my question is: is there any way to disable the automatic semantic matching feature, and only enable it manually with keyboard shortcuts or commands ?
If you only need textual matches, you can select some text use the Select all occurrences of find match command. This will select every occurrence of the selected text in the current document (and also create a cursor at it)
For symbol based information, try using the Find all references or Peek references commands. The flow is different but it gives the same information.
Alternatively, use an extension like this one to create a keyboard shortcut that toggles editor.occurrencesHighlight

Select matching element/rename HTML tag in Visual Studio Code

Let's say I've got the following code
<div class="footer">
<div>Foo</div>
</div>
How can I change .footer from a div element to a footer element?
That is, if I have the cursor in div I'm looking for a keyboard shortcut that selects the opening and closing tags of an element. I believe I've used emmet to do this before in Sublime, but I can't seem to find similar functionality in Code. (Ideally this would work in JSX files too...)
Do you want to rename the paired tags? If yes, there is a much easier way: you just need to install the Auto Rename Tag extension. When you rename one HTML tag, it will automatically rename the paired HTML tag.
V1.41 is adding this functionality, see https://github.com/microsoft/vscode-docs/blob/vnext/release-notes/v1_41.md#html-rename-tags
HTML rename tags
You can now use F2 to rename the opening/closing tag pairs in HTML.
F2 when the cursor is over one of the tags and you will get a little input box with the cursor to input the new tag name and the start/end tags will be replaced with whatever you type upon .
See https://github.com/microsoft/vscode-docs/blob/vnext/release-notes/v1_42.md#html-mirror-cursor-off-by-default
Also of interest might be the "mirror tags" functionality just added in v1.41 as well (https://github.com/microsoft/vscode-docs/blob/vnext/release-notes/v1_41.md#html-mirror-cursor):
Clicking inside a tag will create another cursor in the matching start or end tag.
VS Code now adds a "mirror cursor" when you are editing HTML tags.
This behavior is controlled by the setting
html.mirrorCursorOnMatchingTag, which is on by default.
---------- v1.42 is changing the default status of the mirror cursor:
HTML Mirror Cursor off by default
We have made Mirror Cursor an opt-in feature. In the upcoming
iteration, we'll continue to improve its implementation to make this
feature more easily understandable and available to more languages.
You can still use this feature by turning on
html.mirrorCursorOnMatchingTag.
Thanks to JerryGoyal's answer below (I have upvoted it) - I have continued with this ongoing answer.
Because I have been tracking this for over half a year now, v1.44 has renamed this once again. From Synced Regions:
Synced Regions
We have improved the mirror cursor feature introduced last November
with a new implementation called Synced Regions. Currently this
feature is available for HTML and you can try it out by one of the
following ways:
Running the command On Type Rename Symbol on an HTML tag (bound to
Ctrl+Shift+F2 by default).
Turning on the editor.renameOnType setting and move the cursor to an HTML tag.
The red regions are Synced Regions. As their name suggests, any change
in one region will be synced to other regions. You can exit this mode
by either moving your cursor out of the regions or pressing ESC.
Additionally, typing or pasting any content leading with a whitespace
in any region exits this mode.
We look forward to providing an API that could make this
rename-on-type experience available to other languages such as JSX,
XML, or even local variables in TypeScript.
As that last part notes, it works in html out of the box but other languages need to implement themselves. As of June 2020 by my testing it still does not work in jsx files on embedded html tags.
You must enable this in your settings, it is off by default.
You can do this without an extension using Emmet Update Tag
Place your cursor in the opening tag
Press CTRL+SHIFT+P to open the command palette
Search for "Emmet: Update Tag" by typing something such as "em up t", and/or find it in the list
Press enter to select "Emmet: Update Tag"
Enter the new tag
Press enter
The opening and closing tag are updated to the new one.
Update Mar 2021:
No need for extension, this is now cooked into VSCode.
"editor.linkedEditing": true
Read more here: https://code.visualstudio.com/Docs/languages/html#_auto-update-tags
CTRL + D on windows. As mentioned by #tataata, CMD + D on Mac OS. Not limited to tag renaming. Very useful.
You can use a key shortcut cmd + D (Mac OS) for adding to the selection the next matching element and then there is a possibility to edit open and closing tags simultaneously.
I'm using tag-rename. Press F2 on the tag and it renames the start and close tags.
https://marketplace.visualstudio.com/items?itemName=krizzdewizz.tag-rename
Quick and Simple Select tool works fine too but though it is not perfect.
it has over 40k downloads
https://marketplace.visualstudio.com/items?itemName=dbankier.vscode-quick-select
it allows you to select tools
Ctrl + K ' select everything between single quotes
Ctrl + K " select everything between double quotes
Ctrl + K ` select everything between backticks
Ctrl + K ( select everything inside the parenthesis
Ctrl + K ) select everything inside parenthesis and include them
Ctrl + K [ or ] select everything between square brackets and include them
Ctrl + K { or } select everything between curly braces and include them
Ctrl + K < or > select everything between angle brackets and include
No need to write config codes, just enable it from settings page.

Double click text selection in CFEclipse

In CFEclipse, I do a lot of double-clicking to select text. The standard behavior is to select all text within the nearest word boundaries. This is problematic when editing code where the original editor didn't use camel-case; for example, they wrote "myObject" as "my_object".
Is there a way to change the double-click selection behavior to include '_' as a valid word character?
In the latest version of CFEclipse, there is now the option to define what characters are considered word boundaries when double-clicking, and also the option to use different characters when using alt or shift keys.
In Preferences, goto CFEclipse > Editor > Text Selection to update this:
(source: bpsite.net)
CFEclipse does not recognize either the underscore or a period as a character for selecting text with a double-click. There is no way that I know of other than rolling your sleeves up and hacking the editor code to change it. I doubt that this will be changed any time soon with the impending release of Bolt from Adobe.
On eclipse 3.4.1 Ganymede, it seems to select the nearest boundaries including the '_' (at least in the java file I am using)
What eclipse version are you using ?
This blog even reports that eclipse3.3 does select word as you are expecting it...
vs.