QUESTION: WebStorm Code Completion (How to get code completion to always work?)

I get Intellisense code completion when I type the following:

$(document).ready(function() {


        
});

But no code completion appears when I type:

$(".")

Watch as I type. Code completion works and then stops working:



But the course I am watching shows code completion working.

03_code_completion_course.png

QUESTIONS:
  1. Why isn't code completion working when I type $(".")?
  2. How do I get code completion to work when I type $(".")?
  3. What am I missing?
14 comments
Comment actions Permalink

Hi there,

In $(".") you are inside the string literal.

In any case: does it work if you invoke code completion popup manually (Ctrl+Space .. of whatever you may have there for "Code | Completion | Basic")? Maybe they (in that tutorial) invoke it in a same way?

0
Comment actions Permalink
(Ctrl+Space .. of whatever you may have there for "Code | Completion | Basic")



Hi Andriy,

Here's what my Preferences for Code Completion show:
code_completion_preference.png

When I look at the documentation, I don't see a description of "Basic Completion" and "Smart Type Completion".

What is the difference between "Basic Completion" and "Smart Type Completion" (aside from different keyboard equivalents)?

QUESTIONS:
  1. What is the difference between "Basic Completion" and "Smart Type Completion"?
0
Comment actions Permalink

In $(".") you are inside the string literal.

...does it work if you invoke code completion popup manually (Ctrl+Space .. )?


Yes, doing control-space inside the string literal produces a drop down list.

But the list is different from what the course shows?

That is, when the insertion point is within the string, and I then type period followed by control-space, the list that appears is different.

In jQuery, a dot is followed by a class name. So shouldn't the list show class names? (I believe the course's list shows class names.)

Here's a comparison of what I see and what the course shows. What I see is on the left, and what the course shows is on the right:

compare.png

QUESTIONS:
  1. Why am I seeing a different list than what the course shows?
  2. Why doesn't my list shows class names?
  3. What am I missing here?
0
Comment actions Permalink
Here's what my Preferences for Code Completion show:

That's not what I mean by "Code | Completion | Basic" (I haven't used any "Preferences" or "Settings" word here). "Code | Completion | Basic" is the path to the action in Main Menu.

You have automatic code completion pop up -- just like majority of users (plus, it's a default setting). I personally do not like automatic popup because in most cases it just distracts/annoys me .. so I invoke it manually only when needed. This allows me to avoid certain "bugs"/"uncertain behaviour" that others had in the past (or may still have now; like using Live Templates so that do not conflict with actual code completion entries) .. and I'm so used to invoke it manually so that it feels absolutely naturally this way .. and not "OMG -- I have to press another button" like some people do have.

So .. because I do not use automatic popup .. I cannot say if it meant to be this way or if this is a recent bug (as screenshot of the video shows that older version of IDE was used were it might've worked well). This is also why I have suggested you to try manual invocation -- if it works and if it offers correct entries.

When I look at the documentation, I don't see a description of "Basic Completion" and "Smart Type Completion".

What is the difference between "Basic Completion" and "Smart Type Completion" (aside from different keyboard equivalents)?

0
Comment actions Permalink

Your recent screenshot .... it shows that your function name is S (Capital S) and not $ (dollar sign).

I've tried in my PhpStorm (invoking manually) .. and it shows actual CSS classes and not JavaScript stuff like you have (inside the $(".") of course).

0
Comment actions Permalink

The character "S" was the problem.

Now control-space displays the same classes as the course.

To make distinguishing between "S" and "$" clearer, I've increased the editor's font size.

I'm curious, what editor theme and font size do you use?

0
Comment actions Permalink

I'm using Consolas and customized Default color scheme (that's for Editor); GUI Theme -- Windows. I've tried Darcula (both GUI and color scheme) .. but did not liked it -- on screenshots it looks better than in real action on my computer).

TBH I have not tried other monospaced fonts -- I've switched to it from Courier / Courier New in an IDE for another language where those fonts become very hard to read, got used to it in few days and did not bother with looking for other fonts.

0
Comment actions Permalink

Andriy,

So, I assume, there are no possibility to somehow enable normal visual studio-like code completion with tipping selected element explanation?! Unbelievable
To see at least something to know what current method do i must always press another key combination (Ctrl + Space)! Why?
Please, do possibility to show quick doc without more ado, because without this the product become really worse than VS with resharper...

0
Comment actions Permalink

>do i must always press another key combination (Ctrl + Space)

 

Surely not. Auto-completion is enabled almost everywhere in code (after '.', when entering variable/function name, etc.). But it doesn't auto-popup inside string literals, for example (even if this literal is a CSS selector name, you still have to his Ctrl+space to see the list of selectors)

0
Comment actions Permalink

Elena, i'm sorry, i probably caused misunderstanding. For example i use method setInterval and i want automatically see it's description "Stops a interval from triggering"like that:
but without Ctrl+Space i see only that:
And no possibility to do show it automatic :( . I tried already all, my setup is:




0
Comment actions Permalink

'Autopopup documentation' only works for EXPLICITLY invoked completion, so it only auto-popups when the completion is called explicitly by hitting Ctrl+Space. If you like it to auto-popup along with auto-completion, please vote for https://youtrack.jetbrains.com/issue/IDEA-76223

0
Comment actions Permalink

 Elena,

Yep, i read that and that's why i wrote my first comment above.

Thanks for the link, as for me it's must have feature. If it's so difficult to implement i'm wondering why you don't just emulate that ctrl+space press or something like that

0
Comment actions Permalink

There is an alternative .. but you may find it inconvenient.

You need to pin the Quick Documentation window (manually by clicking on pin button or by using the same shortcut one more time), dock it somewhere on the screen and enable auto-update option in it. This way it will always show documentation for the active element (be it actual code or entry in code completion popup).

The downside -- documentation window is always visible. It usually needs to be quite large to see all details .. so it's hard to find a place on a screen to pin it there. Plus, the auto-updating stuff can distract (depends on a person).

On related note (this is different to the ticket Elena mentioned; it's for actual parameters completion + its for PHP only) -- https://youtrack.jetbrains.com/issue/WI-23913

0
Comment actions Permalink

Tnx for the tip, i'll use Ctrl+Space so far and maybe will try to manually automatize it later with something like xdotool...

0

Please sign in to leave a comment.