This commit changes the partial compilation so that it outputs declaration
calls rather than definition calls for NgModules and Injectors.
The JIT compiler and the linker are updated to be able to handle these
new declarations.
PR Close#41080
There were a number of almost identical interfaces used in
the same way throughout the Render3 compiler code.
This commit changes the compiler to use the same interface
throughout.
PR Close#41080
This function is declared in multiple places. The instances inside
`compiler` are slightly different to those in `compiler-cli`. So this
commit consolidates them into two reusable functions.
PR Close#41080
Currently the `Validators` class contains a number of static methods that represent different validators as well as some helper methods. Since class methods are not tree-shakable, any reference to the `Validator` class retains all of its methods (even if you've used just one).
This commit refactors the code to extract the logic into standalone functions and use these functions in the code instead of referencing them via `Validators` class. That should make the code more tree-shakable. The `Validators` class still retains its structure and calls these standalone methods internally to keep this change backwards-compatible.
PR Close#41189
A long-requested feature for HttpClient is the ability to store and retrieve
custom metadata for requests, especially in interceptors. This commit
implements this functionality via a new context object for requests.
Each outgoing HttpRequest now has an associated "context", an instance of
the HttpContext class. An HttpContext can be provided when making a request,
or if not then an empty context is created for the new request. This context
shares its lifecycle with the entire request, even across operations that
change the identity of the HttpRequest instance such as RxJS retries.
The HttpContext functions as an expando. Users can create typed tokens as instances of HttpContextToken, and
read/write a value for the key from any HttpContext object.
This commit implements the HttpContext functionality. A followup commit will
add angular.io documentation.
PR Close#25751
Previously, we used the `hotlist: community-help` label to mark issues
that were good candidates for contributions from the community.
Recently, we also started using the `good first issue` label to mark
issues that would additionally be suitable for first-time contributors.
This commit is part of the work to replace `hotlist: community-help`
with the newly added `help wanted` label, which (same as
`good first issue`) is a [default GitHub label][1]. This commit changes
all occurrences of `hotlist: community-help` in the documentation to
`help wanted` and also documents the purpose of the `help wanted` and
`good first issue` labels.
[1]: https://docs.github.com/en/github/managing-your-work-on-github/managing-labels#about-default-labels
PR Close#41195
This commit updates Forms code to avoid direct references to all built-in ControlValueAccessor classes, which
prevents their tree-shaking from production builds. Instead, a new static property is added to all built-in
ControlValueAccessors, which is checked when we need to identify whether a given ControlValueAccessors is a
built-in one.
PR Close#41146
Currently the code in the `FormGroupDirective` assumes that the shape of the underlying `FormGroup` never
changes and `FormControl`s are not replaced with other types. In practice this is possible and Forms code
should be able to process such changes in FormGroup shape.
This commit adds extra check to the `FormGroupDirective` class to avoid applying FormControl-specific to
other types.
Fixes#13788.
PR Close#40829
Before #41162, angular.io was broken on IE 11 due to missing a polyfill
for an API (`Reflect.construct()`) needed by the Custom Elements ES5
shim. #41162 tried to fix this by loading the necessary polyfill
(`es.reflect.construct.js`) on browsers that do not support ES2015
modules (including IE 11).
It turns out that the fix in #41162 was itself broken, because the
`es.reflect.consruct.js` script (included directly in the page via a
`<script>` tag) was in CommonJS format (which cannot run in the browser
as is). By chance, this still allowed browsers that supported neither
Custom Elements nor ES2015 modules (such as IE 11) to work correctly as
a side-effect of loading the `@webcomponents/custom-elements` polyfill
after the Custom Elements ES5 shim (`native-shim.js`). However, on the
few browsers that natively support Custom Elements but not ES2015
modules, angular.io would still be broken.
This commit correctly fixes angular.io on all browsers by properly
bundling the polyfills and transpiling to ES5.
Implementation-wise, we use [esbuild][1] for bundling the polyfills (and
converting from CommonJS to a browser-compatible, IIFE-based format) and
[swc][2] for downleveling the code to ES5 (since `esbuild` only supports
ES2015+).
[1]: https://esbuild.github.io/
[2]: https://swc.rs/
PR Close#41183
BREAKING CHANGE:
Switching default of `emitDistinctChangesOnlyDefaultValue`
which changes the default behavior and may cause some applications which
rely on the incorrect behavior to fail.
`emitDistinctChangesOnly` flag has also been deprecated and will be
removed in a future major release.
The previous implementation would fire changes `QueryList.changes.subscribe`
whenever the `QueryList` was recomputed. This resulted in an artificially
high number of change notifications, as it is possible that recomputing
`QueryList` results in the same list. When the `QueryList` gets recomputed
is an implementation detail, and it should not be the thing that determines
how often change event should fire.
Unfortunately, fixing the behavior outright caused too many existing
applications to fail. For this reason, Angular considers this fix a
breaking fix and has introduced a flag in `@ContentChildren` and
`@ViewChildren`, that controls the behavior.
```
export class QueryCompWithStrictChangeEmitParent {
@ContentChildren('foo', {
// This option is the new default with this change.
emitDistinctChangesOnly: true,
})
foos!: QueryList<any>;
}
```
For backward compatibility before v12
`emitDistinctChangesOnlyDefaultValue` was set to `false. This change
changes the default to `true`.
PR Close#41121
Tsserver expects `@angular/language-service` to provide a factory function
as the default export (commonjs-style) of the package.
The current implementation side steps TypeScript's import syntax by using
`module.exports = factory`.
This allows the code to incorrectly re-export other symbols:
```ts
export * from './api';
```
which transpiles to:
```js
var tslib_1 = require("tslib");
tslib_1.__exportStar(require("@angular/language-service/api"), exports);
```
Doing this meant that the package now has a runtime dependency on `tslib`,
which is totally unnecessary.
With the proper `export =` syntax, `tslib` is removed, and no other exports
are allowed.
Output:
```js
(function (factory) {
if (typeof module === "object" && typeof module.exports === "object") {
var v = factory(require, exports);
if (v !== undefined) module.exports = v;
}
else if (typeof define === "function" && define.amd) {
define("@angular/language-service", ["require", "exports"], factory);
}
})(function (require, exports) {
"use strict";
return function factory(tsModule) {
var plugin;
return {
create: function (info) {
var config = info.config;
var bundleName = config.ivy ? 'ivy.js' : 'language-service.js';
plugin = require("./bundles/" + bundleName)(tsModule);
return plugin.create(info);
},
getExternalFiles: function (project) {
var _a, _b;
return (_b = (_a = plugin === null || plugin === void 0 ? void 0 : plugin.getExternalFiles) === null || _a === void 0 ? void 0 : _a.call(plugin, project)) !== null && _b !== void 0 ? _b : [];
},
onConfigurationChanged: function (config) {
var _a;
(_a = plugin === null || plugin === void 0 ? void 0 : plugin.onConfigurationChanged) === null || _a === void 0 ? void 0 : _a.call(plugin, config);
},
};
};
});
```
PR Close#41165
The ViewEngine message extraction would trim the values
of the `equiv-text` attributes. This commit aligns the Ivy
extraction of these attributes.
Fixes#41176
PR Close#41180
Previously, the generated `404.html` page did not include a `<body>`
tag. In some browsers (such as IE 11), this was causing warnings in the
console.
This commit ensures the generated page contains a `<body>` tag. It also
fixes the indentation in the generated page.
PR Close#41163
Previously, the angular.io app was broken on IE 11. In particular, pages
that included Custom Elements would fail to load, because the
`Reflect.construct()` method (which the Custom Elements ES5 shim relies
on) was not available.
This commit fixes this by loading the polyfill for `Reflect.construct()`
on browsers that do not support ES2015 (including IE 11).
PR Close#41162
The custom elements spec is not compatible with ES5 style classes. This
means ES2015 code compiled to ES5 will not work with a native
implementation of Custom Elements. To support browsers that natively
support Custom Elements but not ES2015 modules, we load
`@webcomponents/custom-elements/src/native-shim.js`, which minimally
augments the native implementation to be compatible with ES5 code.
(See [here][1] for more details.)
Previously, the shim was included in `polyfills.ts`, which meant it was
loaded in all browsers (even those supporting ES2015 modules and thus
not needing the shim).
This commit moves the shim from `polyfills.ts` to a `nomodule` script
tag in `index.html`. This will ensure that it is only loaded in browsers
that do not support ES2015 modules and thus do not needed the shim.
NOTE:
This commit also reduces size of the polyfills bundle by ~400B
(52609B --> 52215B).
[1]: https://www.npmjs.com/package/@webcomponents/custom-elements#es5-vs-es2015
PR Close#41162
The `DomAdapter` is present in all Angular apps and its methods aren't tree shakeable.
These changes remove the methods that either aren't being used anymore or were only
used by our own tests. Note that these changes aren't breaking, because the adapter
is an internal API.
The following methods were removed:
* `getProperty` - only used within our own tests.
* `log` - Guaranteed to be defined on `console`.
* `logGroup` and `logGroupEnd` - Only used in one place. It was in the DomAdapter for built-in null checking.
* `logGroupEnd` - Only used in one place. It was placed in the DomAdapter for built in null checking.
* `performanceNow` - Only used in one place that has to be invoked through the browser console.
* `supportsCookies` - Unused.
* `getCookie` - Unused.
* `getLocation` and `getHistory` - Only used in one place which appears to have access to the DOM
already, because it had direct accesses to `window`. Furthermore, even if this was being used
in a non-browser context already, the `DominoAdapter` was set up to throw an error.
The following APIs were changed to be more compact:
* `supportsDOMEvents` - Changed to a readonly property.
* `remove` - No longer returns the removed node.
PR Close#41102
With this change we remove the lines length restriction in commit message body. This was previously in place due to a bug in GitHub UI, which is now fixed.
PR Close#41157
When there are elements in a translated message, the start and end tags
are encoded as placeholders. The names of these placeholders are computed
from the name of the element. For example `<a> will be `START_LINK` and
`</a>` will be `CLOSE_LINK`.
If there are more than one element with the same name, but different attributes,
then the starting placeholder name is made unique.
For example `<a href="a">` would be `START_LINK`, while `<a href="b">` in
the same message would then be called `START_LINK_1`.
But the closing tags will not be made unique since there are no attrbutes;
the always have the same text `</a>`, which will produce, for example,
`CLOSE_LINK`.
Previously, when extracting XLIFF 2 formatted translation files, the closing
tag placeholder names were computed incorrectly from the opening tag
placeholder names. For example `CLOSE_LINK_1`.
This commit strips these `_1` type endings from the start tag placeholder
name when computing the closing tag placeholder name. It also ensures
that the `type` of the placeholder is computed accurately in these cases
too.
Fixes#41142
PR Close#41152
The Angular compiler creates two `ts.Program`s; one for emit and one for
template type-checking. The creation of the type-check program could
benefit from reusing the `ts.ModuleResolutionCache` that was primed
during the creation of the emit program. This requires that the compiler
host implements `resolveModuleNames`, as otherwise TypeScript will setup
a `ts.ModuleResolutionHost` of its own for both programs.
This commit ensures that `resolveModuleNames` is always implemented,
even if the originally provided compiler host does not. This is
beneficial for the `ngc` binary.
PR Close#39693
Previously, the indentation of code snippets in the "Cheat sheet" guide
was done using `<br>` elements (for line breaks) and ` ` HTML
entities (for space). This was laborious and put the onus on the author
to remember to use these symbols (instead of regular whitespace
characters).
(Discussed in
https://github.com/angular/angular/pull/41051#discussion_r585651621.)
This commit changes the way `<code>` elements are styles inside the
"Cheat sheet" guide to allow using regular whitespace characters in code
snippets. It also changes all `<br>`/` ` occurrences to `\n`/` `
respectively to make code snippets more readable in the source code.
PR Close#41051
The "Features" page organizes features in groups/rows of 3 features
each. On wide screens, all 3 paragraphs of a group/row can be shown next
to each other. On narrow screens (between 768px and 1057px), the layout
changes to stack the paragraphs vertically. On medium screens, however,
there is not enough space to show more than two paragraphs next to each
other.
Previously, the 3rd paragraph was wrapped over to the next line.
This commit improves the layout on medium screens by switching to
immediately stacking the paragraphs vertically as soon as there is not
enough space for them to be displayed in one row. Since the total width
is still too much for one paragraph, the paragraphs are limited to 80%
of the total width.
Before (on 1000px width): [features page (on 1000px) before][1]
After (on 1000px width): [features page (on 1000px) after][2]
[1]: https://user-images.githubusercontent.com/8604205/109825316-62128a00-7c42-11eb-8391-650201257274.png
[2]: https://user-images.githubusercontent.com/8604205/109825323-6343b700-7c42-11eb-86c1-e8307c5a727a.png
PR Close#41051
Previously, with the min width of 220px per item, several API list items
were truncated.
This commit increases the min width per item to 330px, which allows
almost all items to have their full text shown. It also increases the
API list page's max content width from 50em (800px) to 62.5em (1000px)
to allow items to be shown on three columns despite their increased
width. This increase in the content width shouldn't negatively affect
UX, since the API list page uses a multi-column layout (i.e. it does not
contain 1000px-lines of text.)
Before: ![api-list before][1]
After: ![api-list after][2]
[1]: https://user-images.githubusercontent.com/8604205/109396457-5f5e1f00-793a-11eb-80cf-1418f409325a.png
[2]: https://user-images.githubusercontent.com/8604205/109396659-499d2980-793b-11eb-95d3-f54250f7fab5.png
PR Close#41051
Previously, each marketing page used a different limit for its content's
width (if it had a limit at all) and implemented the width limiting in a
different way. Besides resulting in an inconsistent UX, this also made
it difficult to apply site-wide layout changes.
This commit makes the limit for most marketing pages consistent and uses
the same CSS class to make it easier to apply site-wide changes in the
future. The chosen limit is slightly larger than that of docs pages
(62.5em/1000px vs 50em/800px), because marketing pages have a different
type of content and layout (i.e. images, multi-column layout, etc.).
Finally, this commit also removes obsolete wrapper elements, CSS classes
and CSS styles, that are no longer necessary after the changes.
Notably, the homepage (`/`) and the "Contributors" page (`/about`) have
remained unchanged, because the former has its own layout that is
different from other marketing pages and the latter would offer a worse
UX with a small content width limit (as the one used on other marketing
pages).
The content widths of the rest of the marketing pages change slightly as
a result of the changes in this commit, but not in a way that would have
a negative impact on UX. More specifically:
| Page (URL) | Size before | Size after |
|:--------------|------------:|-----------:|
| `/contribute` | 880px | 1000px |
| `/events` | unlimited | 1000px |
| `/features` | 996px | 1000px |
| `/presskit` | 800px | 1000px |
| `/resources` | 800px | 1000px |
PR Close#41051
This commit removes an unnecessary wrapper `<div>` from the
"Cheat sheet" guide. The CSS styles that referenced the element's ID
(`#cheatsheet`) have been updated to use `.page-guide-cheatsheet`
instead.
PR Close#41051