When editing text on visual studio code, when I use autocomplete for something (like in the picture)
https://i.stack.imgur.com/0WKnm.png
It highlights my text (while typing) and autocomplete stops working
https://i.stack.imgur.com/HjK6T.png
Same goes when I autocomplete an if statement
https://i.stack.imgur.com/WPNVX.png
Is there any way to disable that highlight, or make it autocomplete even with the highlight?
Add this in your settings.json file, it'll prevent this behaviour:
"editor.suggest.snippetsPreventQuickSuggestions": true,
If you wanted autocomplete dropdown while code is highlighted
(for example: After you performed an autocomplete and VS Code auto highlights for you):
"editor.suggest.snippetsPreventQuickSuggestions": false,
^^^ in your settings.json ^^^
Example action:
Editing a html doc: you typed 'clas...' in a div
<div clas..>
Something...
<div>
It should autocomplete to
<div class="HIGHLIGHTEDTXT">
Something...
<div>
with HIGHLIGHTEDTXT, you can type any things and the autocomplete dropdown will be shown.
P.S.
The autocomplete dropdown will not appear if the settings is set to TRUE when a text is highlighted.
Related
In VS Code, if I press control+F to search, it auto prefills the search box with the word under the cursor. Is there a way to disable that behavior?
For the editor finder (AKA "search"), put the following in your settings.json:
"editor.find.seedSearchStringFromSelection": "never"
The setting's description:
Controls whether the search string in the Find Widget is seeded from the editor selection.
Bonus material: For the search panel in the sidebar (ctrl+shift+f / View: Show Search), put the following in your settings.json:
"search.seedOnFocus": true,
// "search.seedWithNearestWord": true, // optional
How can I change activeEditor programetically in tinyMCE.
Ex:
Like if I have two editors in same page, How can I switch between them programetically?
The activeEditor will switch when you focus a different editor so the method is to call focus on the editor you want to be active. You can choose to not actually focus the editor by passing false.
https://www.tiny.cloud/docs/api/tinymce/tinymce.editor/#focus
Extract from that page:
focus
focus(skipFocus:Boolean)
Focuses/activates the editor. This will set this editor as the
activeEditor in the tinymce collection it will also place DOM focus
inside the editor.
Parameters
skipFocus (Boolean) - Skip DOM focus. Just set is as the active editor.
We can get any instance of TinyMCE by tinyMCE.get('field-name') or by tinyMCE['field-name'] here field name will be the field TinyMCE is associated with.
CodeSandbox editor used to auto generate the corresponding close tag for the current tag.
For example:
<div> // THEN IT WOULD AUTO GENERATE THE </div> TAG
But don't know exactly when, it stopped doing that, and I have to write it manually. Is there a way to enable this autocomplete again?
In the codesandbox.io go to:
File -> Preferences -> Settings
In the Search Settings box type Javascript Autoclosing Tags.
Enable that feature by checking the Checkbox.
Just posting an updated answer since the UI has changed for codesandbox. I believe this answer is now slightly better:
Press cmd+, (ctrl+, on a windows) with the editor focused (this opens the vscode settings)
You should see a settings page like so:
In the Search Settings box type Javascript Autoclosing Tags
Toggle the checkbox on
In my case the auto completion works if a change the extension of the file to .jsx and if I start typing the tag without the <.
In sublime Text 2 writing div.panel then press tab, or the auto complete trigger, in the HTML document produces <div class="panel"></div>
I have tried to get the same result in Visual Studio Code version 1.17.1 but I could not able to get it.
I am using the following plugins:
Auto Close Tag
HTML CSS Support
HTML Snippets
settings.json Ctrl+,
"emmet.triggerExpansionOnTab": true,
"emmet.showSuggestionsAsSnippets": true,
"editor.snippetSuggestions": "top"
In the latest version of vs code, you need to go in seetings using Ctrl+, key and search for Emmet.
Tick the checkbox of Emmet: Show Suggestions As Snippets and Emmet: Triger Expansion On Tab and you will be able to use Emmet functionalities.
Add it at setting.json
"emmet.includeLanguages": {
"javascript": "javascriptreact"}
Do not forget to ADD A COMMA at the end of the closing bracket above this code.
I use TinyMCE (with react-tinymce moudle on npm). I need to customize the HTML code editor, so that it looks like the one on Wordpress. I think it should be possible as Wordpress use TinyMCE.
What makes the editor on Wordpress comfortable is we don't need to enter <br> or <p> on code editor. But when we switch to visual mode, it will add <br> or <p> automatically. That makes the text looks much cleaner and easier to read.
Another question is how to make the code editor not displayed in a popup. The main problem with the popup is it will be closed when we accidentally press esc or the cancel button. In addition, the Wordpress code editor also has a toolbar, while the default TinyMCE code editor is just a textarea on a popup.
The code plugin that comes with TinyMCE places the HTML code is a separate window - there in no configuration option that will allow the code to appear directly in the editor's main window.
If you'd like to submit this as a feature request, TinyMCE has a place for that:
https://community.tinymce.com/communityIdeasHome