Auto-import Javascript module in Vscode using Shortcut (Ctrl + .) - javascript

If my JS code uses a module/varaible that is not yet imported, VSCode will underline it in red
Image showing underline in VSCode
How can VSCode be configured such that we can select the unimported variable, either press a shortcut or select something from the right-click menu, and select the appropriate module to be imported.
Similar to the Ctrl + . auto-import shortcut when dealing with Rust files

Create a clone of the Rust shortcut
Since there is already a shortcut that does what you want (albeit in a different language), you may be able to create a new shortcut based on the existing one.
First: open your keyboard shortcuts, and do a "reverse-shortcut" search for Ctrl + .. There's an icon near the right side of the search input that switches the search behavior to this:
You may find multiple matches; study them to identify the Rust import command that you like. In particular, take note of the "Source" column: if Source is "Extension," that means you're getting the Rust behavior from an extension, and you may need to find (or create) a similar extension that targets JS/TS. (I suspect you will, because I don't have any commands related to imports in my VSCode.) The next step requires that you copy the value of the Where column, so do that now.
Second: look at the "Command" column for the name given to this behavior. If the name is specific to Rust, do a new search for a similar command that doesn't target Rust. If there is such a command, you just need to configure it to run when you like: edit that shortcut and paste the "When" value from behavior; this may require a hand-edit if the When from the Rust command mentions anything specific about Rust (e.g. if it includes editorLangId == 'markdown', change that to 'javascript' and add alternative for typescript as well).
If there is no auto-import command that is language agnostic, and none that is specific to JS/TS (again, I don't see one in my VSC), you will have to rely on the Intellisense-based option, or find (or create) an extension that does this. Creating an extension is a whole other topic.

Normally, in Visual Studio Code, if you type in a variable or function that isn't imported, then Visual Studio Code will auto-correct it, if you select it.
For example, if I am typing half the name of a function, it will infer that I want a function, and when I hit Tab/Enter, it will autocomplete it, and import it.
See the GIF below for a visual example.

Related

VSCode Hover Provider - Remove default info/title?

Im writing a language server for ExtJs using HoverProvider among other things, I've written other extensions including Task Explorer, but cant for the life of me figure out if there's a way to remove the default hover information, the word "any" that VSCode injects on all the properties and functions within the file.
See attached screenshot.
I guess since the js language servers cant read ExtJs class definitions (json object as a function expression), I get this "any" text on everything, I'd like to replace it or remove it somehow, is it possible? I can properly insert my doc, but that "any" is still there...
Hover info screenshot with the word "any" at the top

Visual Studio Code Intellisense Method Definitions Javascript

Apparently no one else has wanted this feature, or I'm missing something. Intellisense works as normal, but I'm wondering if I'm missing a setting somewhere, if there is an extension, or if this functionality just isn't offered in VS Code... I would like to have the purpose of the method display when I start typing it as you can see in Adobe Brackets:
As opposed to how it shows in VS Code(which just shows the parameter requirements):
Is this possible?
VSCode is able to use the typescript language server to infer some information about the javascript that you're writing. The types for window/document etc are provided by the typescript team.
Here's where the type information for elements comes from. Compare that with the types for the document object. Notice that the properties here have comments above them, while the element properties do not. Type document.getElementById in VSCode, you'll see extra info like you do in brackets:
So for this information to appear about properties on Elements, someone would need to go through and add the comments. I have no idea if the typescript team is open to this, though.

Add new shortcut to selenium IDE

How can i add new shortcut to Selenium IDE modifying its code?
For example, i want to assign to action run test case shortcut: ctrl + p, just like save action has ctrl + s
I could not find any js file responsible for this.
Since you have asked make changes in the code. I would suggest :
Clone the git repository SeleniumHQ on your local machine.
Search for the file which implements the shortcuts on the IDE.
Make changes and create a Pull Request on the project.
Wait for the admin to review it and merge the same.
Note : This would put the usefulness of the idea and correctness of its implementation under regression which shall never be a cause of
worry if you want to develop on something.
Edit : On digging further I've got to know that selenium IDE uses a third party keyboard shortcuts script to provide us with the shortcuts.
The link to the specific file goes in here : keyboardshortcuthandler.js

is refactoring available in Adobe brackets

It is so great that code completion is already there but two things are also important to have
1- refactoring ( renaming all the incidents of same variable/ function )
2- when you select a variable it to highlight all the occurrences of that variable
I wonder if the 1,2 are available yet as I need a JavaScript IDE to have both plus code-completion. I badly searched for all three Eclipse too. but then Eclipse doesn't have code-completion
1) Check out the "Rename JavaScript Identifier" extension. (The Replace All command built into Brackets is more powerful than what most text editors give you, but it's not a true 'rename refactoring' -- it's not type-aware and currently only replaces within a single file).
2) Check out the "Quick Search" extension.
I use Ternific ("JavaScript hinting and refactoring powered by Tern") which can do more than the above mentioned extension. Still renames on Ctrl+R.

How to find functions/operators/methods in JS files quickly and easily

I'm looking for an app or a command line tool that can help me quickly find a defined function in a file. The file in question here is the EXT-debug.js file. I want to override some methods(in this case onRender) however I need to figure out the signature of said functions.
I've yet to try Eclipse or Aptana; I'm looking for a more lightweight solution.
I use agent ransack. It's able to search for files as well as content. I also like the fact that you can run it on demand as it does not use an invasive, indexing service.
Agent Ransack
Visual Studio is not exactly a lightweight solution, but I have to recommend it. It's come a long way towards becoming an excellent JavaScript editor.
Visual Studio's IntelliSense is able to infer JavaScript types and give you a dropdown of the functions and values in your object (works pretty well).
Of course, I always have my handy little muscle memory spasm: double-click-select -> Ctrl-C -> Ctrl-Shift-F -> Ctrl-V -> ENTER
And here's a plugin that pre-searches for exact string matches in your entire solution and highlights them for you, so jumping to a function definition is instantaneous. Whole Tomato's Visual Assist X

Categories