Problems installing ng14 cli completion on macOS

[moniuch]

🐞 Bug report

Command (mark with an x)

• new
• build
• serve
• test
• e2e
• generate
• add
• update
• lint
• extract-i18n
• run
• config
• help
• version
• doc

Is this a regression?

No, a new feature

Description

I went to play with 14rc1 but since I don't have ng installed globally, I issued the following command npx @angular/cli new ng14
(from the WebStorm embedded terminal).

Once the new cli got installed, I was asked if I want the cli completion to be enabled. Answered yes.
The result in the terminal was something like: source<(ng completion script)

The completion did not work OOTB or even in a new terminal tab, decided to restart.
After the restart saw this in the reopened terminal:

Then I realized the embedded terminal in WebStorm might have not been elevated so I repeated the entire ng new process from macOS Terminal. Unfortunately, I couldn't force the completion prompt to appear again. Now ng new proceeds now straight to the routing question. Don't really know how to mitigate this.

A clear and concise description of the problem...

🔬 Minimal Reproduction

🔥 Exception or Error

ng g c my-comp [tab] doesn't produce any output as expected, just a void macOS sound

🌍 Your Environment

I don't have ng installed globally so ng version results in ng command not found.

macOS Monterey 12.3.1
nvm
node -v 18.1

Anything else relevant?

[moniuch]

Tried to follow what's inside the completion utility
https://github.com/angular/angular-cli/blob/14.0.x/packages/angular/cli/src/utilities/completion.ts

Seems like the completion feature requires global installation of ng command
which I haven't seen mentioned anywhere

[alan-agius4]

//cc @dgp1130, since you are working on the docs it might be worth mentioning this.

[dgp1130]

Thanks for mentioning this. Yes we do need a global install of the CLI (npm install -g @angular/cli) since your terminal needs to invoke it on startup to configure autocompletion, without a global install your terminal doesn't know where the CLI is. I'll add this to our docs on the feature in angular/angular#45995.

I wonder if we can also update ng completion to check for ng on the user's $PATH and fail/warn if it's missing? I'm not sure if we would inherit node_modules/.bin/ on the $PATH from the npm / npx runner, but worth investigating.

[moniuch]

@dgp1130 Thanks for your effort! Since the arrival of npx, I started to avoid -g installations, still expecting everything to work, my bad. ;-)

Yes, please try to determine during installation, whether ng completion can be offered, and in case like mine, maybe output an educational message that due to missing global ng it was not possible to offer/install ng completion

For successful installations, it would be awesome to have the paths of added/altered files (eg full path to .bashrc) listed.

[dgp1130]

#23145 should skip the prompt / warn when a global install of the Angular CLI can't be found, which should more gracefully handle npm run ng and npx @angular/cli use cases.

#23146 is also adding some documentation and includes a section about the requirement for a global install.

For successful installations, it would be awesome to have the paths of added/altered files (eg full path to .bashrc) listed.

I'm pretty sure it already does that, it should print:

$ ng completion
Appended `source <(ng completion script)` to `/path/to/home/.bashrc`. Restart your terminal or run the following to autocomplete `ng` commands:

    source <(ng completion script)