cargdev/angular
1
0
Fork 0
Code Issues 17 Pull Requests Actions Packages Projects Releases Wiki Activity

fix(ivy): reuse default imports in type-to-value references (#29266)

Browse Source 
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
This commit is contained in:
Alex Rickabaugh
2019-03-11 16:54:07 -07:00
committed by Kara Erickson
parent 940fbf796c
commit ccb70e1c64
39 changed files with 535 additions and 206 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
packages/compiler-cli/src/ngtsc/imports/index.ts
View File

@ -8,6 +8,7 @@
export {AliasGenerator, AliasStrategy} from './src/alias';
export {ImportRewriter, NoopImportRewriter, R3SymbolsImportRewriter, validateAndRewriteCoreSymbol} from './src/core';
export {DefaultImportRecorder, DefaultImportTracker, NOOP_DEFAULT_IMPORT_RECORDER} from './src/default';
export {AbsoluteModuleStrategy, FileToModuleHost, FileToModuleStrategy, LocalIdentifierStrategy, LogicalProjectStrategy, ReferenceEmitStrategy, ReferenceEmitter} from './src/emitter';
export {Reexport} from './src/reexport';
export {ImportMode, OwningModule, Reference} from './src/references';

188
packages/compiler-cli/src/ngtsc/imports/src/default.ts Normal file
View File

@ -0,0 +1,188 @@
/**
* @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 * as ts from 'typescript';
import {getSourceFile} from '../../util/src/typescript';
/**
* Registers and records usages of `ts.Identifer`s that came from default import statements.
*
* See `DefaultImportTracker` for details.
*/
export interface DefaultImportRecorder {
/**
* Record an association between a `ts.Identifier` which might be emitted and the
* `ts.ImportDeclaration` from which it came.
*
* Alone, this method has no effect as the `ts.Identifier` might not be used in the output.
* The identifier must later be marked as used with `recordUsedIdentifier` in order for its
* import to be preserved.
*/
recordImportedIdentifier(id: ts.Identifier, decl: ts.ImportDeclaration): void;
/**
* Record the fact that the given `ts.Identifer` will be emitted, and thus its
* `ts.ImportDeclaration`, if it was a previously registered default import, must be preserved.
*
* This method can be called safely for any `ts.Identifer`, regardless of its origin. It will only
* have an effect if the identifier came from a `ts.ImportDeclaration` default import which was
* previously registered with `recordImportedIdentifier`.
*/
recordUsedIdentifier(id: ts.Identifier): void;
}
/**
* An implementation of `DefaultImportRecorder` which does nothing.
*
* This is useful when default import tracking isn't required, such as when emitting .d.ts code
* or for ngcc.
*/
export const NOOP_DEFAULT_IMPORT_RECORDER: DefaultImportRecorder = {
recordImportedIdentifier: (id: ts.Identifier) => void{},
recordUsedIdentifier: (id: ts.Identifier) => void{},
};
/**
* TypeScript has trouble with generating default imports inside of transformers for some module
* formats. The issue is that for the statement:
*
* import X from 'some/module';
* console.log(X);
*
* TypeScript will not use the "X" name in generated code. For normal user code, this is fine
* because references to X will also be renamed. However, if both the import and any references are
* added in a transformer, TypeScript does not associate the two, and will leave the "X" references
* dangling while renaming the import variable. The generated code looks something like:
*
* const module_1 = require('some/module');
* console.log(X); // now X is a dangling reference.
*
* Therefore, we cannot synthetically add default imports, and must reuse the imports that users
* include. Doing this poses a challenge for imports that are only consumed in the type position in
* the user's code. If Angular reuses the imported symbol in a value position (for example, we
* see a constructor parameter of type Foo and try to write "inject(Foo)") we will also end up with
* a dangling reference, as TS will elide the import because it was only used in the type position
* originally.
*
* To avoid this, the compiler must "touch" the imports with `ts.updateImportClause`, and should
* only do this for imports which are actually consumed. The `DefaultImportTracker` keeps track of
* these imports as they're encountered and emitted, and implements a transform which can correctly
* flag the imports as required.
*
* This problem does not exist for non-default imports as the compiler can easily insert
* "import * as X" style imports for those, and the "X" identifier survives transformation.
*/
export class DefaultImportTracker implements DefaultImportRecorder {
/**
* A `Map` which tracks the `Map` of default import `ts.Identifier`s to their
* `ts.ImportDeclaration`s. These declarations are not guaranteed to be used.
*/
private sourceFileToImportMap =
new Map<ts.SourceFile, Map<ts.Identifier, ts.ImportDeclaration>>();
/**
* A `Map` which tracks the `Set` of `ts.ImportDeclaration`s for default imports that were used in
* a given `ts.SourceFile` and need to be preserved.
*/
private sourceFileToUsedImports = new Map<ts.SourceFile, Set<ts.ImportDeclaration>>();
recordImportedIdentifier(id: ts.Identifier, decl: ts.ImportDeclaration): void {
const sf = getSourceFile(id);
if (!this.sourceFileToImportMap.has(sf)) {
this.sourceFileToImportMap.set(sf, new Map<ts.Identifier, ts.ImportDeclaration>());
}
this.sourceFileToImportMap.get(sf) !.set(id, decl);
}
recordUsedIdentifier(id: ts.Identifier): void {
const sf = getSourceFile(id);
if (!this.sourceFileToImportMap.has(sf)) {
// The identifier's source file has no registered default imports at all.
return;
}
const identiferToDeclaration = this.sourceFileToImportMap.get(sf) !;
if (!identiferToDeclaration.has(id)) {
// The identifier isn't from a registered default import.
return;
}
const decl = identiferToDeclaration.get(id) !;
// Add the default import declaration to the set of used import declarations for the file.
if (!this.sourceFileToUsedImports.has(sf)) {
this.sourceFileToUsedImports.set(sf, new Set<ts.ImportDeclaration>());
}
this.sourceFileToUsedImports.get(sf) !.add(decl);
}
/**
* Get a `ts.TransformerFactory` which will preserve default imports that were previously marked
* as used.
*
* This transformer must run after any other transformers which call `recordUsedIdentifier`.
*/
importPreservingTransformer(): ts.TransformerFactory<ts.SourceFile> {
return (context: ts.TransformationContext) => {
return (sf: ts.SourceFile) => { return this.transformSourceFile(sf); };
};
}
/**
* Process a `ts.SourceFile` and replace any `ts.ImportDeclaration`s.
*/
private transformSourceFile(sf: ts.SourceFile): ts.SourceFile {
const originalSf = ts.getOriginalNode(sf) as ts.SourceFile;
// Take a fast path if no import declarations need to be preserved in the file.
if (!this.sourceFileToUsedImports.has(originalSf)) {
return sf;
}
// There are declarations that need to be preserved.
const importsToPreserve = this.sourceFileToUsedImports.get(originalSf) !;
// Generate a new statement list which preserves any imports present in `importsToPreserve`.
const statements = sf.statements.map(stmt => {
if (ts.isImportDeclaration(stmt) && importsToPreserve.has(stmt)) {
// Preserving an import that's marked as unreferenced (type-only) is tricky in TypeScript.
//
// Various approaches have been tried, with mixed success:
//
// 1. Using `ts.updateImportDeclaration` does not cause the import to be retained.
//
// 2. Using `ts.createImportDeclaration` with the same `ts.ImportClause` causes the import
// to correctly be retained, but when emitting CommonJS module format code, references
// to the imported value will not match the import variable.
//
// 3. Emitting "import * as" imports instead generates the correct import variable, but
// references are missing the ".default" access. This happens to work for tsickle code
// with goog.module transformations as tsickle strips the ".default" anyway.
//
// 4. It's possible to trick TypeScript by setting `ts.NodeFlag.Synthesized` on the import
// declaration. This causes the import to be correctly retained and generated, but can
// violate invariants elsewhere in the compiler and cause crashes.
//
// 5. Using `ts.getMutableClone` seems to correctly preserve the import and correctly
// generate references to the import variable across all module types.
//
// Therefore, option 5 is the one used here. It seems to be implemented as the correct way
// to perform option 4, which preserves all the compiler's invariants.
//
// TODO(alxhub): discuss with the TypeScript team and determine if there's a better way to
// deal with this issue.
stmt = ts.getMutableClone(stmt);
}
return stmt;
});
// Save memory - there's no need to keep these around once the transform has run for the given
// file.
this.sourceFileToImportMap.delete(originalSf);
this.sourceFileToUsedImports.delete(originalSf);
return ts.updateSourceFileNode(sf, statements);
}
}

26
packages/compiler-cli/src/ngtsc/imports/test/BUILD.bazel Normal file
View File

@ -0,0 +1,26 @@
load("//tools:defaults.bzl", "jasmine_node_test", "ts_library")
package(default_visibility = ["//visibility:public"])
ts_library(
name = "test_lib",
testonly = True,
srcs = glob([
"**/*.ts",
]),
deps = [
"//packages:types",
"//packages/compiler-cli/src/ngtsc/imports",
"//packages/compiler-cli/src/ngtsc/testing",
"@npm//typescript",
],
)
jasmine_node_test(
name = "test",
bootstrap = ["angular/tools/testing/init_node_no_angular_spec.js"],
deps = [
":test_lib",
"//tools/testing:node_no_angular",
],
)

90
packages/compiler-cli/src/ngtsc/imports/test/default_spec.ts Normal file
View File

@ -0,0 +1,90 @@
/**
* @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 * as ts from 'typescript';
import {getDeclaration, makeProgram} from '../../testing/in_memory_typescript';
import {DefaultImportTracker} from '../src/default';
describe('DefaultImportTracker', () => {
it('should prevent a default import from being elided if used', () => {
const {program, host} = makeProgram(
[
{name: 'dep.ts', contents: `export default class Foo {}`},
{name: 'test.ts', contents: `import Foo from './dep'; export function test(f: Foo) {}`},
// This control file is identical to the test file, but will not have its import marked
// for preservation. It exists to verify that it is in fact the action of
// DefaultImportTracker and not some other artifact of the test setup which causes the
// import to be preserved. It will also verify that DefaultImportTracker does not preserve
// imports which are not marked for preservation.
{name: 'ctrl.ts', contents: `import Foo from './dep'; export function test(f: Foo) {}`},
],
{
module: ts.ModuleKind.ES2015,
});
const fooClause = getDeclaration(program, 'test.ts', 'Foo', ts.isImportClause);
const fooId = fooClause.name !;
const fooDecl = fooClause.parent;
const tracker = new DefaultImportTracker();
tracker.recordImportedIdentifier(fooId, fooDecl);
tracker.recordUsedIdentifier(fooId);
program.emit(undefined, undefined, undefined, undefined, {
before: [tracker.importPreservingTransformer()],
});
const testContents = host.readFile('/test.js') !;
expect(testContents).toContain(`import Foo from './dep';`);
// The control should have the import elided.
const ctrlContents = host.readFile('/ctrl.js');
expect(ctrlContents).not.toContain(`import Foo from './dep';`);
});
it('should transpile imports correctly into commonjs', () => {
const {program, host} = makeProgram(
[
{name: 'dep.ts', contents: `export default class Foo {}`},
{name: 'test.ts', contents: `import Foo from './dep'; export function test(f: Foo) {}`},
],
{
module: ts.ModuleKind.CommonJS,
});
const fooClause = getDeclaration(program, 'test.ts', 'Foo', ts.isImportClause);
const fooId = ts.updateIdentifier(fooClause.name !);
const fooDecl = fooClause.parent;
const tracker = new DefaultImportTracker();
tracker.recordImportedIdentifier(fooId, fooDecl);
tracker.recordUsedIdentifier(fooId);
program.emit(undefined, undefined, undefined, undefined, {
before: [
addReferenceTransformer(fooId),
tracker.importPreservingTransformer(),
],
});
const testContents = host.readFile('/test.js') !;
expect(testContents).toContain(`var dep_1 = require("./dep");`);
expect(testContents).toContain(`var ref = dep_1["default"];`);
});
});
function addReferenceTransformer(id: ts.Identifier): ts.TransformerFactory<ts.SourceFile> {
return (context: ts.TransformationContext) => {
return (sf: ts.SourceFile) => {
if (id.getSourceFile().fileName === sf.fileName) {
return ts.updateSourceFileNode(sf, [
...sf.statements, ts.createVariableStatement(undefined, ts.createVariableDeclarationList([
ts.createVariableDeclaration('ref', undefined, id),
]))
]);
}
return sf;
};
};
}