84 lines
3.3 KiB
TypeScript
Raw Normal View History

/**
* @license
* Copyright Google Inc. All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/
import {WrappedNodeExpr} from '@angular/compiler';
import {R3Reference} from '@angular/compiler/src/compiler';
import * as ts from 'typescript';
fix(ivy): reuse default imports in type-to-value references (#29266) This fixes an issue with commit b6f6b117. In this commit, default imports processed in a type-to-value conversion were recorded as non-local imports with a '*' name, and the ImportManager generated a new default import for them. When transpiled to ES2015 modules, this resulted in the following correct code: import i3 from './module'; // somewhere in the file, a value reference of i3: {type: i3} However, when the AST with this synthetic import and reference was transpiled to non-ES2015 modules (for example, to commonjs) an issue appeared: var module_1 = require('./module'); {type: i3} TypeScript renames the imported identifier from i3 to module_1, but doesn't substitute later references to i3. This is because the import and reference are both synthetic, and never went through the TypeScript AST step of "binding" which associates the reference to its import. This association is important during emit when the identifiers might change. Synthetic (transformer-added) imports will never be bound properly. The only possible solution is to reuse the user's original import and the identifier from it, which will be properly downleveled. The issue with this approach (which prompted the fix in b6f6b117) is that if the import is only used in a type position, TypeScript will mark it for deletion in the generated JS, even though additional non-type usages are added in the transformer. This again would leave a dangling import. To work around this, it's necessary for the compiler to keep track of identifiers that it emits which came from default imports, and tell TS not to remove those imports during transpilation. A `DefaultImportTracker` class is implemented to perform this tracking. It implements a `DefaultImportRecorder` interface, which is used to record two significant pieces of information: * when a WrappedNodeExpr is generated which refers to a default imported value, the ts.Identifier is associated to the ts.ImportDeclaration via the recorder. * when that WrappedNodeExpr is later emitted as part of the statement / expression translators, the fact that the ts.Identifier was used is also recorded. Combined, this tracking gives the `DefaultImportTracker` enough information to implement another TS transformer, which can recognize default imports which were used in the output of the Ivy transform and can prevent them from being elided. This is done by creating a new ts.ImportDeclaration for the imports with the same ts.ImportClause. A test verifies that this works. PR Close #29266
2019-03-11 16:54:07 -07:00
import {LocalIdentifierStrategy, NOOP_DEFAULT_IMPORT_RECORDER, ReferenceEmitter} from '../../imports';
import {PartialEvaluator} from '../../partial_evaluator';
import {TypeScriptReflectionHost, isNamedClassDeclaration} from '../../reflection';
import {LocalModuleScopeRegistry, MetadataDtsModuleScopeResolver} from '../../scope';
import {getDeclaration, makeProgram} from '../../testing/in_memory_typescript';
import {NgModuleDecoratorHandler} from '../src/ng_module';
import {NoopReferencesRegistry} from '../src/references_registry';
describe('NgModuleDecoratorHandler', () => {
it('should resolve forwardRef', () => {
const {program} = makeProgram([
{
name: 'node_modules/@angular/core/index.d.ts',
contents: `
export const Component: any;
export const NgModule: any;
export declare function forwardRef(fn: () => any): any;
`,
},
{
name: 'entry.ts',
contents: `
import {Component, forwardRef, NgModule} from '@angular/core';
@Component({
template: '',
})
export class TestComp {}
@NgModule()
export class TestModuleDependency {}
@NgModule({
declarations: [forwardRef(() => TestComp)],
exports: [forwardRef(() => TestComp)],
imports: [forwardRef(() => TestModuleDependency)]
})
export class TestModule {}
`
},
]);
const checker = program.getTypeChecker();
const reflectionHost = new TypeScriptReflectionHost(checker);
const evaluator = new PartialEvaluator(reflectionHost, checker);
const referencesRegistry = new NoopReferencesRegistry();
const scopeRegistry = new LocalModuleScopeRegistry(
new MetadataDtsModuleScopeResolver(checker, reflectionHost, null), new ReferenceEmitter([]),
null);
const refEmitter = new ReferenceEmitter([new LocalIdentifierStrategy()]);
const handler = new NgModuleDecoratorHandler(
fix(ivy): reuse default imports in type-to-value references (#29266) This fixes an issue with commit b6f6b117. In this commit, default imports processed in a type-to-value conversion were recorded as non-local imports with a '*' name, and the ImportManager generated a new default import for them. When transpiled to ES2015 modules, this resulted in the following correct code: import i3 from './module'; // somewhere in the file, a value reference of i3: {type: i3} However, when the AST with this synthetic import and reference was transpiled to non-ES2015 modules (for example, to commonjs) an issue appeared: var module_1 = require('./module'); {type: i3} TypeScript renames the imported identifier from i3 to module_1, but doesn't substitute later references to i3. This is because the import and reference are both synthetic, and never went through the TypeScript AST step of "binding" which associates the reference to its import. This association is important during emit when the identifiers might change. Synthetic (transformer-added) imports will never be bound properly. The only possible solution is to reuse the user's original import and the identifier from it, which will be properly downleveled. The issue with this approach (which prompted the fix in b6f6b117) is that if the import is only used in a type position, TypeScript will mark it for deletion in the generated JS, even though additional non-type usages are added in the transformer. This again would leave a dangling import. To work around this, it's necessary for the compiler to keep track of identifiers that it emits which came from default imports, and tell TS not to remove those imports during transpilation. A `DefaultImportTracker` class is implemented to perform this tracking. It implements a `DefaultImportRecorder` interface, which is used to record two significant pieces of information: * when a WrappedNodeExpr is generated which refers to a default imported value, the ts.Identifier is associated to the ts.ImportDeclaration via the recorder. * when that WrappedNodeExpr is later emitted as part of the statement / expression translators, the fact that the ts.Identifier was used is also recorded. Combined, this tracking gives the `DefaultImportTracker` enough information to implement another TS transformer, which can recognize default imports which were used in the output of the Ivy transform and can prevent them from being elided. This is done by creating a new ts.ImportDeclaration for the imports with the same ts.ImportClause. A test verifies that this works. PR Close #29266
2019-03-11 16:54:07 -07:00
reflectionHost, evaluator, scopeRegistry, referencesRegistry, false, null, refEmitter,
NOOP_DEFAULT_IMPORT_RECORDER);
const TestModule = getDeclaration(program, 'entry.ts', 'TestModule', isNamedClassDeclaration);
const detected =
handler.detect(TestModule, reflectionHost.getDecoratorsOfDeclaration(TestModule));
if (detected === undefined) {
return fail('Failed to recognize @NgModule');
}
const moduleDef = handler.analyze(TestModule, detected.metadata).analysis !.ngModuleDef;
expect(getReferenceIdentifierTexts(moduleDef.declarations)).toEqual(['TestComp']);
expect(getReferenceIdentifierTexts(moduleDef.exports)).toEqual(['TestComp']);
expect(getReferenceIdentifierTexts(moduleDef.imports)).toEqual(['TestModuleDependency']);
function getReferenceIdentifierTexts(references: R3Reference[]) {
return references.map(ref => (ref.value as WrappedNodeExpr<ts.Identifier>).node.text);
}
});
});