ng set apps[0].main does not work

[platosha]

Overview

Setting an app config option with a set command does not work.

$ ng set apps.0.main src/my-main.ts gives error: Invalid config path.
$ ng set apps[0].main src/my-main.ts also fails in the same way.

Motivation

As a part of the Vaadin Elements R&D project, we have a @vaadin/angular2-polymer package that allows developers to use Polymer elements in Angular applications. It is possible, but due to some technical limitations there is a requirement to load and bootstrap the Angular app after the Polymer elements are loaded and registered.

For the regular SystemJS Angular workflow, we recommend our users to wrap the System.import('app') call inside a listener for the WebComponentsReady event, and thus postpone the Angular app load after the Polymer elements are registered. I am writing the alternative instructions for those who use webpack, especially for the angular-cli@webpack generated projects.

For the above requirement, we are probably going to instruct our users to switch the main app entry point to a separate proxy loader script, where we wait for the WebComponentsReady event and require the original main.ts:

document.addEventListener('WebComponentsReady', function() {
  require('./main.ts');
});

Switching the app config properties from the command line would be easier then editing the json manually. I would prefer the ng set command in our instructions. But, as it turns out, the command does not work for changing the properties of the apps[0].

Versions

OS: Mac OS X El Capitan.

$ ng --version
angular-cli: local (v1.0.0-beta.11-webpack.2, branch: master)
node: 6.3.0
os: darwin x64

Steps to Reproduce

1. Generate a project with default settings

$ ng new my-project
$ cd my-project
$ ng set apps.0.main src/my-main.ts

Results

The config is not changed, and the following error is given in the output:

Invalid config path.
Error: Invalid config path.
    at /myhome/angular-cli/addon/ng2/models/config.ts:55:23
    at Array.reduce (native)
    at CliConfig.set (/myhome/angular-cli/addon/ng2/models/config.ts:53:45)
    at /myhome/angular-cli/addon/ng2/commands/set.ts:14:20
    at Class.Command.extend.run (/myhome/angular-cli/addon/ng2/commands/set.ts:12:16)
    at Class.<anonymous> (/myhome/angular-cli/node_modules/angular-cli/lib/models/command.js:152:17)
    at lib$rsvp$$internal$$tryCatch (/myhome/angular-cli/node_modules/rsvp/dist/rsvp.js:1036:16)
    at lib$rsvp$$internal$$invokeCallback (/myhome/angular-cli/node_modules/rsvp/dist/rsvp.js:1048:17)
    at lib$rsvp$$internal$$publish (/myhome/angular-cli/node_modules/rsvp/dist/rsvp.js:1019:11)
    at lib$rsvp$asap$$flush (/myhome/angular-cli/node_modules/rsvp/dist/rsvp.js:1198:9)
    at _combinedTickCallback (internal/process/next_tick.js:67:7)
    at process._tickCallback (internal/process/next_tick.js:98:9)

Other information

For the get command, both ng get apps[0].main and ng get apps.0.main work. But for the set, neither of the paths work. Not sure what is the correct syntax to address array items.

The issue seems to be in CliConfig.set. The array items are not considered by a path check in there.

The type check there also looks incorrect for me (typeof statements seem excessive, as long as checkPath.type are always set with strings):

    if (typeof checkPath.type === 'string' && isNaN(value)) {
      parent[name] = value;
      return true;
    }

    if (typeof checkPath.type === 'number' && !isNaN(value)) {
      parent[name] = value;
      return true;
    }

The schema.json itself seems to have a different syntax for the apps, also not considered by CliConfig.set: the app property types are declared in a short format: ("main": "string"), while the rest of the properties are in a long format ("version": { "type": "string" }).

I’m preparing a PR to support this, please let me know if it is welcome.

[hansl]

Thanks, we'll take a look.

[kurpav]

Looks like this issue occurs again.
I have the following command:
ng config projects.hero-snatch.architect.build.configurations.local.fileReplacements[0].replace
Output:
Value cannot be found.

This one works:
ng config projects.hero-snatch.architect.build.configurations.local.fileReplacements
Output:
[ { "replace": "src/environments/environment.ts", "with": "src/environments/.environment.local.ts" } ]

ng version
   
Angular CLI: 7.3.8
Node: 11.12.0
OS: darwin x64
Angular: 7.2.6

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}