NGCC is non-hermetic and produces different output depending on source location in file system

🐞 bug report

Affected Package

angular/compiler-cli

Description

NGCC produces different output - specifically, in sourcemap transformation - depending on source location in file system.

I have two copies of the same project checked out in two places:

D:/myproj D:/myproj-other/myproj

If I compare node_modules/@angular/animation between the two (this is just an example), the “sources” fields on the source maps in node_modules/@angular/animations/fesm2015 (again, just an example) are different

D:/myproj-other/myproj/node_modules/@angular/animations/fesm2015/animations.js.map

{"version":3,"file":"animations.js","sources":["../../../../../../packages/animations/src/animation_builder.ts","../../../../../../packages/animations/src/animation_metadata.ts","../../../../../../packages/animations/src/util.ts","../../../../../../packages/animations/src/players/animation_player.ts","../../../../../../packages/animations/src/players/animation_group_player.ts","../../../../../../packages/animations/src/private_export.ts","../../../../../../packages/animations/src/animations.ts","../../../../../../packages/animations/public_api.ts","../../../../../../packages/animations/index.ts","../../../../../../packages/animations/animations.ts"],"names":
...

D:/myproj/node_modules/@angular/animations/fesm2015/animations.js.map

{"version":3,"file":"animations.js","sources":["../../../../../packages/animations/src/animation_builder.ts","../../../../../packages/animations/src/animation_metadata.ts","../../../../../packages/animations/src/util.ts","../../../../../packages/animations/src/players/animation_player.ts","../../../../../packages/animations/src/players/animation_group_player.ts","../../../../../packages/animations/src/private_export.ts","../../../../../packages/animations/src/animations.ts","../../../../../packages/animations/public_api.ts","../../../../../packages/animations/index.ts","../../../../../packages/animations/animations.ts"],"names":[
...

Note that the number of “…/” is different between them.

the __ivy_ngcc_bak file shows the original:

{"version":3,"file":"animations.js","sources":["../../../../../../packages/animations/src/animation_builder.ts","../../../../../../packages/animations/src/animation_metadata.ts","../../../../../../packages/animations/src/util.ts","../../../../../../packages/animations/src/players/animation_player.ts","../../../../../../packages/animations/src/players/animation_group_player.ts","../../../../../../packages/animations/src/private_export.ts","../../../../../../packages/animations/src/animations.ts","../../../../../../packages/animations/public_api.ts","../../../../../../packages/animations/index.ts","../../../../../../packages/animations/animations.ts"],
...

Unfortunately, this difference is significant if you want to do any sort of build caching between machines as the hashes of the input files of any dependencies on ngcc-processed node_modules are different. This has caused me a lot of pain as I am trying to set up Bazel in our system. I had problems with cache misses between our build servers and developer machines that appears to be caused by this. As a temporary workaround I have had to check in our node_modules, along with ngcc generated files.

I don’t have a firm grasp on the details of this bug, but it appears to me arise from the following code in:

node_modules/@angular/compiler-cli/src/ngtsc/sourcemaps/src/source_file.js

var sourceMap = {
                version: 3,
                file: this.fs.relative(sourcePathDir, this.sourcePath),
                sources: sources.map(function (sf) { return _this.fs.relative(sourcePathDir, sf.sourcePath); }),
                names: names,
                mappings: sourcemap_codec_1.encode(mappings),
                sourcesContent: sources.map(function (sf) { return sf.contents; }),
            };

The line

                sources: sources.map(function (sf) { return _this.fs.relative(sourcePathDir, sf.sourcePath); }),

ends up forming a relative path from

D:/myproj/path/to/file

to D:/packages/path/to/file

Obviously this is going to be different if the first path is

D:/my/nested/checkout/myproj/path/to/file

🌍 Your Environment

Angular Version: 10.1.5

Anything else relevant? Windows

[petebacondarwin]

So as far as I can tell, this is kind of an issue with the source-maps generated by the Angular project in the first place.

Since the file paths of original source files are pointing way way up the tree, (e.g. ../../../../../../packages/...) then if the location of the source-map itself is not deep enough in the tree then of course it will produce different relative paths.

This is equivalent to doing:

cd /a/b/c/d/e
cd ../../../x

This should put you in /a/b/x right?

But if you did:

cd /a/b
cd ../../../x

Then you end up in /x

I appreciate that is not very helpful. So I will take a look into whether we can make ngcc’s source-map handling more resilient to this…

[angular-automatic-lock-bot[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.}