Prior to this change, keys in "inputs" and "outputs" objects generated by compiler were not checked against unsafe characters. As a result, in some cases the generated code was throwing JS error. Now we check whether a given key contains any unsafe chars and wrap it in quotes if needed.
PR Close#28919
Angular supports having a component extend off of a parent component.
When this happens, all annotation-level data is inherited including styles
and classes. Up until now, Ivy only paid attention to static styling
values on the parent component and not the child component. This patch
ensures that both the parent's component and child component's styling
data is merged and rendered accordingly.
Jira Issue: FW-1081
PR Close#29015
Currently when `sauce-connect` times out after 2min, we just
print a message saying that the SauceLabs tunnel didn't establish
within 2min. In order to make debugging easier, we now print the
full log file output on failure.
PR Close#29084
Currently we only reset the `Attached` flag of a view if it is detached through its parent, however this means that if a root view is destroyed, its flag will never be reset. This manifested itself in one of the Material tests where we were destroying the root view.
This PR resolves FW-1130.
PR Close#29064
The ngtsc partial evaluator previously would not handle an enum reference
inside a template string expression correctly. Enums are resolved to an
`EnumValue` type, which has a `resolved` property with the actual value.
When effectively toString-ing a `ResolvedValue` as part of visiting a
template expression, the partial evaluator needs to translate `EnumValue`s
to their fully resolved value, which this commit does.
PR Close#29062
Currently, ngtsc has a bug where if you alias the name of a decorator when
importing it, it won't be detected properly. This is because the compiler
uses the aliased name and not the original, declared name of the decorator
for detection.
This commit fixes the compiler to compare against the declared name of
decorators when available, and adds a test to prevent regression.
PR Close#29061
ngtsc has cyclic import detection, to determine when adding an import to a
directive or pipe would create a cycle. However, this detection must also
account for already inserted imports, as it's possible for both directions
of a circular import to be inserted by Ivy (as opposed to at least one of
those edges existing in the user's program).
This commit fixes the circular import detection for components to take into
consideration already added edges. This is difficult for one critical
reason: only edges to files which will *actually* be imported should be
considered. However, that depends on which directives & pipes are used in
a given template, which is currently only known by running the
TemplateDefinitionBuilder during the 'compile' phase. This is too late; the
decision whether to use remote scoping (which consults the import graph) is
made during the 'resolve' phase, before any compilation has taken place.
Thus, the only way to correctly consider synthetic edges is for the compiler
to know exactly which directives & pipes are used in a template during
'resolve'. There are two ways to achieve this:
1) refactor `TemplateDefinitionBuilder` to do its work in two phases, with
directive matching occurring as a separate step which can be performed
earlier.
2) use the `R3TargetBinder` in the 'resolve' phase to independently bind the
template and get information about used directives.
Option 1 is ideal, but option 2 is currently used for practical reasons. The
cost of binding the template can be shared with template-typechecking.
PR Close#29040
In the @Component decorator, the 'host' field is an object which represents
host bindings. The type of this field is complex, but is generally of the
form {[key: string]: string}. Several different kinds of bindings can be
specified, depending on the structure of the key.
For example:
```
@Component({
host: {'[prop]': 'someExpr'}
})
```
will bind an expression 'someExpr' to the property 'prop'. This is known to
be a property binding because of the square brackets in the binding key.
If the binding key is a plain string (no brackets or parentheses), then it
is known as an attribute binding. In this case, the right-hand side is not
interpreted as an expression, but is instead a constant string.
There is no actual requirement that at build time, these constant strings
are known to the compiler, but this was previously enforced as a side effect
of requiring the binding expressions for property and event bindings to be
statically known (as they need to be parsed). This commit breaks that
relationship and allows the attribute bindings to be dynamic. In the case
that they are dynamic, the references to the dynamic values are reflected
into the Ivy instructions for attribute bindings.
PR Close#29033
DynamicValues are generated whenever a partially evaluated expression is
unable to be resolved statically. They contain a reference to the ts.Node
which wasn't resolvable.
They can also be nested. For example, the expression 'a + b' is resolvable
only if 'a' and 'b' are themselves resolvable. If either 'a' or 'b' resolve
to a DynamicValue, the whole expression must also resolve to a DynamicValue.
Previously, if 'a' resolved to a DynamicValue, the entire expression might
have been resolved to the same DynamicValue. This correctly indicated that
the expression wasn't resolvable, but didn't return a reference to the
shallow node that couldn't be resolved (the expression 'a + b'), only a
reference to the deep node that couldn't be resolved ('a').
In certain situations, it's very useful to know the shallow unresolvable
node (for example, to use it verbatim in the output). To support this,
the partial evaluator is updated to always wrap DynamicValue to point to
each unresolvable expression as it's processed, ensuring the receiver can
determine exactly which expression node failed to resolve.
PR Close#29033
Currently if a user accidentally calls ViewContainerRef.insert() with
a view that has already been attached, we do not clean up the references
properly, so we create a view tree with a cycle. This causes an infinite
loop when the view is destroyed.
This PR ensures that we fall back to ViewContainerRef.move() behavior
if we try to insert a view that is already attached. This fixes the
cycle and honors the user intention.
PR Close#29047
Currently, whenever someone on fw-core approvals list approves a change
to the angular_material_blocklist.js file, it is not sufficient because
dev-infra is also requested as a mandatory reviewer. This does not make
sense because this folder only contains the list of ignored tests and
not anything dev-infra related.
Previously, we tried to fix this by creating a "Material CI" section
underneath the existing "Build & CI" section, so that the "Material CI"
rule would override the rule matching the entire "tools" folder.
Unfortunately, this did not work. This commit attempts to resolve the
problem by explicitly marking all sub-folders in the "tools" folder
as owned by dev-infra (leaving out "material-ci"), so "material-ci"
is only referenced by the rule assigning fw-core as code owners.
PR Close#28990
As a side effect of 09b34bae8655d4251516655c317b150c46cd3653,
we fixed that the docs systemjs examples currently do not run
with Ivy in JIT mode. This now uncovered new failures with the JIT
resource loading. e.g.
```
zone.js:665 Unhandled Promise rejection: Component 'PhoneListComponent' is not resolved:
- templateUrl: ./phone-list.template.html
Did you run and wait for 'resolveComponentResources()'? ; Zone: <root> ; Task: Promise.then ; Value: Error: Component 'PhoneListComponent' is not resolved:
- templateUrl: ./phone-list.template.html
Did you run and wait for 'resolveComponentResources()'?
at Function.get (directive.ts:54)
at getComponentDef (definition.ts:648)
at verifyDeclarationsHaveDefinitions (module.ts:185)
at Array.forEach (<anonymous>)
at verifySemanticsOfNgModuleDef (module.ts:159)
at Function.get (module.ts:132)
at getInjectorDef (defs.ts:181)
at R3Injector.processInjectorType (r3_injector.ts:230)
at eval (r3_injector.ts:114)
at eval (r3_injector.ts:451) Error: Component 'PhoneListComponent' is not resolved:
```
We temporarily disable these two failing SystemJS examples by adding them to the
`fixmeIvyExamples` list.
PR Close#28984
Currently the docs example tests (`test_docs_examples_ivy`
and `test_docs_examples`) are the culprits for a slow-down
in our overall CI turnaround. We need to increase parallelism
in order to make our CI turnaround more _acceptable_. This is
temporary and the long-term goal is to move these tests to Bazel
with remote build execution.
References #28940
PR Close#28984
Currently the "test_docs_examples_ivy" job attaches
the legacy package output, while we can also attach
the Ivy NPM package output. We don't need Ngcc to downlevel
the Angular packages in order to run the docs examples with Ivy.
PR Close#28984
Currently when adding the example boilerplate to all
examples with Ivy enabled, we run Ngcc and transform
all found formats. This potentially slows down the build and
is not necessary as we only need the "fesm5" and "fesm2015" bundles.
PR Close#28984
This change helps highlight certain misoptimizations with Closure
compiler. It is also stylistically preferable to consistently use index
access on index sig types.
Roughly, when one sees '.foo' they know it is always checked for typos
in the prop name by the type system (unless 'any'), while "['foo']" is
always not.
Once all angular repos are conforming this will become a tsetse.info
check, enforced by bazel.
PR Close#28937
Previously, the VSCode settings for the workspace specified the
`clang-format.executable` setting to configure auto-formatting to use
`clang-format`. Yet, this setting has no effect without the extension
that provides that configuration option namely [xaver.clang-format][1]).
For people that didn't have the extension installed, VSCode would use
the default formatters, resulting in vastly different file fomatting.
This commit adds a set of [rcommended workspace extensions][2], to help
people get the right extensions when checking out the repository.
The recommended extensions are:
- [gkalpak.aio-docs-utils][3]:
Utilities to aid in authoring/viewing Angular documentation source
code. Currently, mainly aid in working with
`{@example}`/`<code-example>` tags.
- [ms-vscode.vscode-typescript-tslint-plugin][4]:
Add auto-linting for TS files using `tslint` while editing.
- [xaver.clang-format][1]:
Add auto-formatting for JS/TS files using `clang-format`.
[1]: https://marketplace.visualstudio.com/items?itemName=xaver.clang-format
[2]: http://go.microsoft.com/fwlink/?LinkId=827846
[3]: https://marketplace.visualstudio.com/items?itemName=gkalpak.aio-docs-utils
[4]: https://marketplace.visualstudio.com/items?itemName=ms-vscode.vscode-typescript-tslint-plugin
PR Close#28784
Previously, auto-formatting on save was enabled for all file types,
which meant also using default VSCode formatting settings for files
where this was not desirable - for example HTML files (such as
angular.io and docs examples templates) and JSON files (such as Firebase
configurations).
This was problematic for the following reasons:
- Unlike with JS/TS files, the formatting of other file types is not
checked/enforced on CI.
- Formatting is subject to default VSCode settings and everyone's local
VSCode settings overrides.
- Especially for docs examples files, changing the layout might require
updating the wording in corresponding guides (e.g. when referring to
line-numbers).
If we decide that we do want to lint those other file types as well
(which sounds like a good idea), we should do it in a way that ensures
consistent formatting and check the formatting on CI.
PR Close#28784
Previously the start of a character indicated by an escape sequence
was being incorrectly computed by the lexer, which caused tokens
to include the start of the escaped character sequence in the
preceding token. In particular this affected the name extracted
from opening tags if the name was terminated by an escape sequence.
For example, `<t\n>` would have the name `t\` rather than `t`.
This fix refactors the lexer to use a "cursor" object to iterate over
the characters in the template source. There are two cursor implementations,
one expects a simple string, the other expects a string that contains
JavaScript escape sequences that need to be unescaped.
PR Close#28978
The parts of a token are supposed to be an array of not-null strings,
but we were using `null` for tags that had no prefix. This has been
fixed to use the empty string in such cases, which allows the `null !`
hack to be removed.
PR Close#28978
Prior to this change, TypeScript stripped out some imports in case we reference a type that can be represented as a value (for ex. classes). This fix ensures that we use correct symbol identifier, which makes TypeScript retain the necessary import statements.
PR Close#28941
This commit removes code duplication around projectables nodes insertion.
It also simplfy the overall logic by using recursive function calls instead
of hand-unrolled stack (we can always optimise this part if needed).
PR Close#29008