Invalid JSON AST error

[Javarome]

🐞 Bug report

Command (mark with an x)

• new
• build
• serve
• test
• e2e
• generate
• add
• update
• lint
• xi18n
• run
• config
• help
• version
• doc

Is this a regression?

Yes, the previous version in which this bug was not present was: 9.1.9.

Description

When issuing `ng update @angular/cli` the migration process goes fine up to this step where it complains about a ngx-translate file:

❯ Add "Solution Style" TypeScript configuration file support.
  This improves developer experience using editors powered by TypeScript’s language server.
  Read more about this here: https://v10.angular.io/guide/migration-solution-style-tsconfig
✖ Migration failed: Invalid JSON AST Object (fr.json)

🔬 Minimal Reproduction

run ng update @angular/cli on a codebase that includes ngx-translate translation fr.json file, structured like this:

{
  "key": {
    "subkey": {
      "subsubkey": "translation value"
    }
}

🔥 Exception or Error

[error] Error: Invalid JSON AST Object (fr.json)
    at visitExtendedJsonFiles (/Users/jbeau/project/zelros-cs/frontend/node_modules/@schematics/angular/migrations/update-10/solution-style-tsconfig.js:36:19)
    at visitExtendedJsonFiles.next ()
    at visitExtendedJsonFiles (/Users/jbeau/project/zelros-cs/frontend/node_modules/@schematics/angular/migrations/update-10/solution-style-tsconfig.js:52:16)
    at visitExtendedJsonFiles.next ()
    at visitExtendedJsonFiles (/Users/jbeau/project/zelros-cs/frontend/node_modules/@schematics/angular/migrations/update-10/solution-style-tsconfig.js:52:16)
    at visitExtendedJsonFiles.next ()
    at visitExtendedJsonFiles (/Users/jbeau/project/zelros-cs/frontend/node_modules/@schematics/angular/migrations/update-10/solution-style-tsconfig.js:52:16)
    at visitExtendedJsonFiles.next ()
    at visitExtendedJsonFiles (/Users/jbeau/project/zelros-cs/frontend/node_modules/@schematics/angular/migrations/update-10/solution-style-tsconfig.js:52:16)
    at visitExtendedJsonFiles.next ()
    at /Users/jbeau/project/zelros-cs/frontend/node_modules/@schematics/angular/migrations/update-10/solution-style-tsconfig.js:63:45
    at MergeMapSubscriber.project (/Users/jbeau/project/zelros-cs/frontend/node_modules/@angular-devkit/schematics/src/rules/call.js:75:24)
    at MergeMapSubscriber._tryNext (/Users/jbeau/project/zelros-cs/frontend/node_modules/rxjs/internal/operators/mergeMap.js:69:27)
    at MergeMapSubscriber._next (/Users/jbeau/project/zelros-cs/frontend/node_modules/rxjs/internal/operators/mergeMap.js:59:18)
    at MergeMapSubscriber.Subscriber.next (/Users/jbeau/project/zelros-cs/frontend/node_modules/rxjs/internal/Subscriber.js:66:18)
    at Observable._subscribe (/Users/jbeau/project/zelros-cs/frontend/node_modules/rxjs/internal/util/subscribeToArray.js:5:20)

🌍 Your Environment

Angular CLI: 10.0.1
Node: 13.14.0
OS: darwin x64

Angular: 10.0.2
... animations, common, compiler, compiler-cli, core, forms
... language-service, localize, platform-browser
... platform-browser-dynamic, router
Ivy Workspace: 

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.1000.1
@angular-devkit/build-angular     0.1000.1
@angular-devkit/build-optimizer   0.1000.1
@angular-devkit/build-webpack     0.1000.1
@angular-devkit/core              10.0.1
@angular-devkit/schematics        10.0.1
@angular/cli                      10.0.1
@ngtools/webpack                  10.0.1
@schematics/angular               10.0.1
@schematics/update                0.1000.1
rxjs                              6.5.5
typescript                        3.9.6
webpack                           4.43.0

Anything else relevant?
The potential JSON files were pasted in a JSON validator with success.

Only the filename is specified (not the full path, which may have helped as I have multiple files with this name in different directories).

Also, the original parsing error is not displayed (this would have helped also).

[MeForThis]

Delete the "dist" folder from the last build. I had an old broken file in there.
The build folder should be deleted or not checked in the upgrade.

[Javarome]

@MeForThis I did empty the dist directory before migrating, but now it complains about en.json so it must not be only about this.

[MeForThis]

Maybe the files have the encoding UTF-8-BOM. Change them all to UTF-8 and it will work.

[Javarome]

I double checked and all the fr.json and en.json files are UTF-8.

[jonyadamit]

I had a file named app.config.json in the root folder, with the same error.
Renamed the file to app.config.temp, and ran ng update @angular/cli --migrate-only --from "9.1.8" and the migration proceeded successfully. Renamed the file back afterwards.

[Javarome]

Thanks for the tip @jonyadamit . However the error remains surprising and I wonder if the problem is more that the JSON file contents do not match some expected schema (angular.json's one ?) than JSON validity per se. I understand that the current fix only cares about displaying more info (parsing error and full file path), but the actual problem doesn't seem to be addressed and the error will still pop up (with more details) in the next release. I think the case for business JSON files in migrated sources should be investigated more deeply.

[jonyadamit]

@Javarome yes, obviously business JSON files should be ignored by the migration process. As this issue is tagged as broken/bug I suppose it will be addressed as you suggest.

[alan-agius4]

Hi all, in the next patch version of the CLI. instead of an erroring out when we encounter a JSON file which the JSON parser cannot parse, we will display a warning.

@Javarome, the problem here is not caused by a mismatch against a schema but rather the JSON file contents cannot be parsed to a valid JSON AST object.

[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.}