fix(ngcc): use preserve whitespaces from tsconfig if provided (#36189)

Previously ngcc never preserved whitespaces but this is at odds
with how the ViewEngine compiler works. In ViewEngine, library
templates are recompiled with the current application's tsconfig
settings, which meant that whitespace preservation could be set
in the application tsconfig file.

This commit allows ngcc to use the `preserveWhitespaces` setting
from tsconfig when compiling library templates. One should be aware
that this disallows different projects with different tsconfig settings
to share the same node_modules folder, with regard to whitespace
preservation. But this is already the case in the current ngcc since
this configuration is hard coded right now.

Fixes #35871

PR Close #36189
This commit is contained in:
Pete Bacon Darwin 2020-03-21 22:18:50 +00:00 committed by Misko Hevery
parent 32ce8b1326
commit b8e9a30d3b
4 changed files with 50 additions and 6 deletions

View File

@ -8,6 +8,7 @@
import {ConstantPool} from '@angular/compiler'; import {ConstantPool} from '@angular/compiler';
import * as ts from 'typescript'; import * as ts from 'typescript';
import {ParsedConfiguration} from '../../..';
import {ComponentDecoratorHandler, DirectiveDecoratorHandler, InjectableDecoratorHandler, NgModuleDecoratorHandler, PipeDecoratorHandler, ReferencesRegistry, ResourceLoader} from '../../../src/ngtsc/annotations'; import {ComponentDecoratorHandler, DirectiveDecoratorHandler, InjectableDecoratorHandler, NgModuleDecoratorHandler, PipeDecoratorHandler, ReferencesRegistry, ResourceLoader} from '../../../src/ngtsc/annotations';
import {CycleAnalyzer, ImportGraph} from '../../../src/ngtsc/cycles'; import {CycleAnalyzer, ImportGraph} from '../../../src/ngtsc/cycles';
import {isFatalDiagnosticError} from '../../../src/ngtsc/diagnostics'; import {isFatalDiagnosticError} from '../../../src/ngtsc/diagnostics';
@ -55,6 +56,7 @@ export class DecorationAnalyzer {
private rootDirs = this.bundle.rootDirs; private rootDirs = this.bundle.rootDirs;
private packagePath = this.bundle.entryPoint.package; private packagePath = this.bundle.entryPoint.package;
private isCore = this.bundle.isCore; private isCore = this.bundle.isCore;
private compilerOptions = this.tsConfig !== null? this.tsConfig.options: {};
moduleResolver = moduleResolver =
new ModuleResolver(this.program, this.options, this.host, /* moduleResolutionCache */ null); new ModuleResolver(this.program, this.options, this.host, /* moduleResolutionCache */ null);
@ -87,7 +89,7 @@ export class DecorationAnalyzer {
new ComponentDecoratorHandler( new ComponentDecoratorHandler(
this.reflectionHost, this.evaluator, this.fullRegistry, this.fullMetaReader, this.reflectionHost, this.evaluator, this.fullRegistry, this.fullMetaReader,
this.scopeRegistry, this.scopeRegistry, this.isCore, this.resourceManager, this.rootDirs, this.scopeRegistry, this.scopeRegistry, this.isCore, this.resourceManager, this.rootDirs,
/* defaultPreserveWhitespaces */ false, !!this.compilerOptions.preserveWhitespaces,
/* i18nUseExternalIds */ true, this.bundle.enableI18nLegacyMessageIdFormat, /* i18nUseExternalIds */ true, this.bundle.enableI18nLegacyMessageIdFormat,
this.moduleResolver, this.cycleAnalyzer, this.refEmitter, NOOP_DEFAULT_IMPORT_RECORDER, this.moduleResolver, this.cycleAnalyzer, this.refEmitter, NOOP_DEFAULT_IMPORT_RECORDER,
NOOP_DEPENDENCY_TRACKER, this.injectableRegistry, /* annotateForClosureCompiler */ false), NOOP_DEPENDENCY_TRACKER, this.injectableRegistry, /* annotateForClosureCompiler */ false),
@ -123,7 +125,8 @@ export class DecorationAnalyzer {
constructor( constructor(
private fs: FileSystem, private bundle: EntryPointBundle, private fs: FileSystem, private bundle: EntryPointBundle,
private reflectionHost: NgccReflectionHost, private referencesRegistry: ReferencesRegistry, private reflectionHost: NgccReflectionHost, private referencesRegistry: ReferencesRegistry,
private diagnosticHandler: (error: ts.Diagnostic) => void = () => {}) {} private diagnosticHandler: (error: ts.Diagnostic) => void = () => {},
private tsConfig: ParsedConfiguration|null = null) {}
/** /**
* Analyze a program to find all the decorated files should be transformed. * Analyze a program to find all the decorated files should be transformed.

View File

@ -307,7 +307,7 @@ export function mainNgcc(
const createCompileFn: CreateCompileFn = onTaskCompleted => { const createCompileFn: CreateCompileFn = onTaskCompleted => {
const fileWriter = getFileWriter( const fileWriter = getFileWriter(
fileSystem, logger, pkgJsonUpdater, createNewEntryPointFormats, errorOnFailedEntryPoint); fileSystem, logger, pkgJsonUpdater, createNewEntryPointFormats, errorOnFailedEntryPoint);
const transformer = new Transformer(fileSystem, logger); const transformer = new Transformer(fileSystem, logger, tsConfig);
return (task: Task) => { return (task: Task) => {
const {entryPoint, formatProperty, formatPropertiesToMarkAsProcessed, processDts} = task; const {entryPoint, formatProperty, formatPropertiesToMarkAsProcessed, processDts} = task;

View File

@ -7,6 +7,7 @@
*/ */
import * as ts from 'typescript'; import * as ts from 'typescript';
import {ParsedConfiguration} from '../../..';
import {FileSystem} from '../../../src/ngtsc/file_system'; import {FileSystem} from '../../../src/ngtsc/file_system';
import {TypeScriptReflectionHost} from '../../../src/ngtsc/reflection'; import {TypeScriptReflectionHost} from '../../../src/ngtsc/reflection';
import {DecorationAnalyzer} from '../analysis/decoration_analyzer'; import {DecorationAnalyzer} from '../analysis/decoration_analyzer';
@ -63,7 +64,9 @@ export type TransformResult = {
* - Some formats may contain multiple "modules" in a single file. * - Some formats may contain multiple "modules" in a single file.
*/ */
export class Transformer { export class Transformer {
constructor(private fs: FileSystem, private logger: Logger) {} constructor(
private fs: FileSystem, private logger: Logger,
private tsConfig: ParsedConfiguration|null = null) {}
/** /**
* Transform the source (and typings) files of a bundle. * Transform the source (and typings) files of a bundle.
@ -146,7 +149,7 @@ export class Transformer {
const diagnostics: ts.Diagnostic[] = []; const diagnostics: ts.Diagnostic[] = [];
const decorationAnalyzer = new DecorationAnalyzer( const decorationAnalyzer = new DecorationAnalyzer(
this.fs, bundle, reflectionHost, referencesRegistry, this.fs, bundle, reflectionHost, referencesRegistry,
diagnostic => diagnostics.push(diagnostic)); diagnostic => diagnostics.push(diagnostic), this.tsConfig);
const decorationAnalyses = decorationAnalyzer.analyzeProgram(); const decorationAnalyses = decorationAnalyzer.analyzeProgram();
const moduleWithProvidersAnalyzer = const moduleWithProvidersAnalyzer =

View File

@ -1373,6 +1373,44 @@ runInEachFileSystem(() => {
}); });
}); });
describe('whitespace preservation', () => {
it('should default not to preserve whitespace', () => {
mainNgcc({basePath: '/dist', propertiesToConsider: ['es2015']});
expect(loadPackage('local-package', _('/dist')).__processed_by_ivy_ngcc__).toEqual({
es2015: '0.0.0-PLACEHOLDER',
typings: '0.0.0-PLACEHOLDER',
});
expect(fs.readFile(_('/dist/local-package/index.js')))
.toMatch(/ɵɵtext\(\d+, " Hello\\n"\);/);
});
it('should preserve whitespace if set in a loaded tsconfig.json', () => {
fs.writeFile(
_('/tsconfig.json'),
JSON.stringify({angularCompilerOptions: {preserveWhitespaces: true}}));
mainNgcc({basePath: '/dist', propertiesToConsider: ['es2015']});
expect(loadPackage('local-package', _('/dist')).__processed_by_ivy_ngcc__).toEqual({
es2015: '0.0.0-PLACEHOLDER',
typings: '0.0.0-PLACEHOLDER',
});
expect(fs.readFile(_('/dist/local-package/index.js')))
.toMatch(/ɵɵtext\(\d+, "\\n Hello\\n"\);/);
});
it('should not preserve whitespace if set to false in a loaded tsconfig.json', () => {
fs.writeFile(
_('/tsconfig.json'),
JSON.stringify({angularCompilerOptions: {preserveWhitespaces: false}}));
mainNgcc({basePath: '/dist', propertiesToConsider: ['es2015']});
expect(loadPackage('local-package', _('/dist')).__processed_by_ivy_ngcc__).toEqual({
es2015: '0.0.0-PLACEHOLDER',
typings: '0.0.0-PLACEHOLDER',
});
expect(fs.readFile(_('/dist/local-package/index.js')))
.toMatch(/ɵɵtext\(\d+, " Hello\\n"\);/);
});
});
describe('with configuration files', () => { describe('with configuration files', () => {
it('should process a configured deep-import as an entry-point', () => { it('should process a configured deep-import as an entry-point', () => {
loadTestFiles([ loadTestFiles([
@ -1883,7 +1921,7 @@ runInEachFileSystem(() => {
{ {
name: _('/dist/local-package/index.js'), name: _('/dist/local-package/index.js'),
contents: contents:
`import {Component} from '@angular/core';\nexport class AppComponent {};\nAppComponent.decorators = [\n{ type: Component, args: [{selector: 'app', template: '<h2>Hello</h2>'}] }\n];` `import {Component} from '@angular/core';\nexport class AppComponent {};\nAppComponent.decorators = [\n{ type: Component, args: [{selector: 'app', template: '<h2>\\n Hello\\n</h2>'}] }\n];`
}, },
{ {
name: _('/dist/local-package/index.d.ts'), name: _('/dist/local-package/index.d.ts'),