This commit fixes one of the URLs used for testing the accessibility of
angular.io from `start-routing` to `start/start-routing`. The old URL is
not correct and result in a "Page not found" error.
This commit also increases some of the a11y scores.
PR Close#42462
Cleans up AIO's Sass files by:
* Switching them all over to the `@use`-based API from Angular Material.
* Removing the import of the Material theming API in a bunch of places that weren't using it.
* Migrating the new usages of Sass utility functions to the new syntax (e.g. `map.get` vs `map-get`).
* Fixing a few files that were using 4 spaces for indentation instead of 2.
PR Close#42442
We should primarily point readers to the stackblitz that contains the spec files and runs them.
The application stackblitz is secondary (and doesn't actually contain the spec files, which is confusing).
Fixes#38535
PR Close#42406
In the "Interceptor order" section of the HTTP guide there is a typo which incorrectly lists the same service twice when referring to two different services. The order that these services are listed is important, and this commit fixes the typo by listing the services in the correct order.
PR Close#42437
The documentation suggested that `@types/*` scoped packages would
automatically be recognized, however the CLI configures a project such
that the package has to be explicitly added to the TypeScript
configuration files.
Closes#37572
PR Close#42417
This commit removes the `_typography-theme.scss` file that is currently
not used. The file contains a single Sass mixin
(`docs-site-typography-theme()`), which is never called.
PR Close#42396
This commit includes some minor refactorings and style changes as a
follow-up to PR #41129. (The changes were minor enough that didn't
warrant blocking the PR.)
PR Close#42396
This commit changes the `engines` rules in the root `package.json` as
well as the `package.json` used when working on docs example to also
accept Node.js versions greater than v14. This aligns them with
`aio/package.json` and allows using Node.js v15 and v16 (current) for
local development in the `angular/angular` repo.
Related to #42367.
PR Close#42387
Previously, the docs didn't say anything about the fact that the `novalidate` attribute is added to the enclosing form, or how to override that behavior. I have added a couple lines in the appropriate spot clarifying this issue.
PR Close#42377
Fixes#35373.
This changes the example from "run an arbitrary process" to "copy a file". This should make it a bit easier to follow, require less background knowledge to understand, and not use any platform-specific commands that won't work for Windows users.
The most glaring issue with this change is that this doc does not explictly specify how to build and run a builder. I've updated some of the files to hint at this a bit more (such as the `"implementation": "./dist/my-builder.js"`), but another pass is required to figure out the best way to compile a builder and how we want to structure this example to best communicate that.
PR Close#42371
This commit fixes some linting warning that were printed when running
`ng lint`. The warnings can be seen in the `lint` step of
[this CI job][1].
Most of the warnings were related to the deprecation of passing context
to Jasmine matchers in favor of using the [withContext()][2] matcher
(introduced in Jasmine v3.3.0).
[1]: https://circleci.com/gh/angular/angular/995543
[2]: https://jasmine.github.io/api/3.3/matchers.html#withContext
PR Close#42359
An internal change in Ivy has surfaced issues in previosly broken code. This change adds a note to the
Ivy compatibility guide as well as the TrackByFunction api docs.
Fixes#35896
PR Close#42338
The only reference to the `spy-directive.gif` image was removed
in #42369, so the image is no longer used. This commit removes the file
from the repository.
PR Close#42388
This commit updates the `Lazy-loading feature modules` guide (guide/lazy-loading-ngmodules) to fix example code that illustrates the process of preloading component data.
Closes#37113.
PR Close#42340
It turns out that we don't document anywhere how ngc works and what options we support.
I added a brief section, without going too much into details because most users should not need to use ngc directly.
I also came across some bug in `ngc` and filed #42372.
Fixes#29623
PR Close#42373
Changes the engines rule in aio to accept any node version greater than
or equal to v14. This allows node v15 to work with aio.
addresses #42076
PR Close#42367
The faq on `forRoot` implies that you cannot and should not call `forRoot` for an import
outside the AppModule. This is technically incorrect. This commit clarifies
the statement and refers the reader to the hierarchical injectors guide.
fixes#29002
PR Close#42361
Since `entryComponents` field is deprecated and no longer used in Ivy, this commit removes `entryComponents` references from the custom elements guide.
Closes#40341.
PR Close#42324
In #39176 Alan noted that schematics is currently misplaced and should really be under the Angular Tools menu item.
In that issue, Alan also noted the "Angular Compiler" and "Angular CLI" are not refereced from here.
Since the issue was created "Angular Compiler" has already been moved under "Angular Tools".
Angular CLI is documented throughout the docs, and the "CLI Command Reference" under References is really just a reference
so it seems correctly located.
Fixes#39176
PR Close#42332
remove `async` and `await` from `BannerComponent` test because the
component uses an inline template and styles
create doc region in `banner-external.component.spec.ts` demonstrating
test setup that may fail due to a missing call to `.compileComponents()`
for a component with an external template and stylesheet
PR Close#42336
- improve `app` folder description: an initial skeleton app project, also called angular-tour-of-heroes (in the src subfolder), there is no `angular-tour-of-heroes` in the `src` subfolder.
- an end-to-end test project (in the e2e subfolder) removed as does not exist/was not created
PR Close#42346
remove `@Input()` decorator from `hero` property because the component
is designed to get the hero via a service, not an input binding.
add `HTMLElement` type to `HeroDetailComponent` unit test
PR Close#42349
Most of these were fixed in other PRs but there were are couple of stragglers.
Note that `my-app` components in non-documentation facing code, such as
compliance tests have not been changed.
Fixes#20235
PR Close#42256
Update the wording for Angular Libraries mapping of peer dependencies to make
it clearer that only the parts of @angular/* that the library depends on
should be marked as peer dependencies.
Closes#37304
PR Close#42322
I intentionally did not change the font size as discussed in #41196
because the current
font size is already about the same as the normal text size.
Fixes#41196
PR Close#42297
Previously we didn't clarify that the stricter defaults have no impact on existing
projects, and we also didn't define the default values for bundle budgets.
Fixes#41966
PR Close#42289
https://github.com/angular/angular/issues/16261#issuecomment-748289240
A couple important things to note about the behavior:
* The component is destroyed, meaning that all of its members will be destroyed as well, including any subscriptions to the route params
* This _does not_ mean that any `finalize` operators or `complete` on the subscription is called. This only happens if the source completes or you unsubscribe from the subscription. The documentation doesn't state that the `Router` will do this, though I can still understand why the behavior is confusing.
You can play around with these scenarios here:
https://stackblitz.com/edit/rxjs-hmpizx
* `complete` the source without unsubscribe: `next`, `complete` and `finalize` are all called, even when `complete` is called before the `next` from the `delay`
* `unsubscribe` from subscription without `complete` on the source: `finalize` happens, but the `complete` of the subscription does not, and neither does `next`
So even if the `Router` were to call `complete` on all of the `Observables` on an `ActivatedRoute`, you would see that any subscriptions with a `delay` operator would still get called.
resolves#16261
PR Close#42316
In the deployment guide on AIO, change the Zeit company name to Vercel.
This is because Zeit rebranded to Vercel. Also update link to point to
Vercel's page about angular.
Fixes#38141
PR Close#42285
Correctly the reference to ng-for as `NgForOf` so that we get the word linked to the API page.
`NgFor` is not a JavaScript symbol so the docs infra doesn't autolink to the API page unless
we use the correct symbol name - `NgForOf`.
PR Close#42293
The latest SW app version knows that `/devtools` should be redirected to
`/guide/devtools`. However, if a user has an older app version installed
(and until the SW downloads the latest version) they will get a 404 when
navigating to `/devtools`.
The reason is that the SW will see `/devtools` as a regular navigation
URL and serve `index.html` instead. The Angular app will then try to get
the content for `/devtools` by fetching `/generated/docs/devtools.json`
(which does not exist).
This commit fixes the issue by redirecting
`/generated/docs/devtools.json` to
`/geenrated/docs/guide/devtools.json`. When a user visits `/devtools`
for the first time, they will still be able to see the guide content
(while the SW updates in the background). On subsequent visits (once the
SW has downloaded the latest app version), they will be redirected to
`/guide/devtools`).
At a later time, once we are confident that the majority of users will
have updated to a newer app version, we can remove this temporary
redirect.
PR Close#42283
This fixes an issue in part 5 of the Tour of Heroes tutorial on
angular.io. At the end of the `Add RouterOutlet` section, the reader navigates to
`"/heroes"`. The next section, `Add a navigation link`, instructs the user to click ona link on the dashboard page to navigate to the heroes page. This is problematic because the previous section instructed the reader to navigate to the heroes page, not the dashboard. It assumes, the reader is on the dashboard page.
Fixes issue by instructing the reader to navigate back to the dashboard
after navigating to `"/heroes"` in the `Add RouterOutlet` section.
resolves#41212
PR Close#42279
Include a source code styling section in the style guide for docs,
indicating to follow the Angular style guide where possible and
defining hexidecimal style guidance.
Closes#23691
PR Close#42227
Previously it was mentioned that "Clicking a hero on the Heroes page does nothing.", this is not correct however since this link is implemented using `routerLink`.
Closes#41363
PR Close#42262
Moving the helpful alert expressing that built-in directives use public APIs
to be under the heading about built-in directives generally makes the content
in the alert more related to its surroundings than its previous location within
the ng-for section.
Closes#38525
PR Close#42226
This commit updates the animation docs and provides better clarity for open-close component with it also added click event in open-close.component
Closes#39708
PR Close#42046
Since #41625, `/guide/updating-to-version-10` is being redirected to
`https://v11.angular.io/guide/updating-to-version-11`. However,
`v11.angular.io` itself is being redirected to `angular.io`, while v11
is the latest stable version. As a result,
`/guide/updating-to-version-10` ends up being redirected to
`https://angular.io/guide/updating-to-version-11`. Currently, this
causes a CI failure in the `aio_monidoting` job ([example failure][1]).
This will change once v12 is released as the new stable version.
Alternatively, we could update the config and tests to expected
`/guide/updating-to-version-10` to be redirected to
`https://angular.io/guide/updating-to-version-11`, but that would end up
being redirected to `https://angular.io/guide/updating-to-version-12`
once v12 would be released, which is different behavior.
This commit provides a way to test for redirects when the destination
URL is itself redirected to a different URL. This allows us to use the
intended URL (for example, `https://v11.angular.io/...`), which will
continue to work as expected regardless of what is the latest stable
version without causing CI failures.
[1]: https://circleci.com/gh/angular/angular/983738
PR Close#42018
Previously, the `updating-to-version-*` URLs would redirect to the next
version update guide. More specifically:
- `/guide/updating-to-version-10` --> `https://v11.angular.io/guide/updating-to-version-11`
- `/guide/updating-to-version-11` --> `/guide/updating-to-version-12`
This seems confusing and inconsistent. Either all URLs should redirect
to the latest update guide (currently `/guide/updating-to-version-12`)
or each URL should redirect to the corresponding version.
This commit implements the second approach:
- `/guide/updating-to-version-10` --> `https://v10.angular.io/guide/updating-to-version-10`
- `/guide/updating-to-version-11` --> `https://v11.angular.io/guide/updating-to-version-11`
PR Close#42019
It is important to use the correct major version of the Angular CLI when
following the examples in the tutorials. This commit provides a custom
element that renders an appropriate dist-tag in the setup step of
the tutorial when the docs are not in "stable" mode.
Fixes#39821
PR Close#41991
When aio yarn docs-only command runs on v12.14.1 it fails details given on issue #41979. Upgrading node version to v12.17.0 solves this but creates a new warning (node:467072) ExperimentalWarning: The ESM module loader is experimental.
This warning gets removed in v12.20.0. Upgrading node version to 12.20.0
PR Close#42009
Such injectables were not appearing in the providers lists of their NgModule.
This commit updates the doc-gen to support associating these automatically.
Further, it also allows developers to mark other injectables that are provided
in an NgModule with a reference to the NgModule where they are provided.
The commit also does a refactoring of the `processNgModuleDocs` dgeni
processor code, to make it easier to maintain.
Fixes#41203
PR Close#41960
After the changes to the `lang-none` styling in #41335, code snippets marked with
```
language="none" class="code-shell"
```
were being styled with the same foreground and background colours.
It turns out that most of these ought to be marked `language="sh"`
in which case the `code-shell` style became redundant and has been
removed.
Fixes#41984
PR Close#41986
while reading the documentation, I noticed that there were
references in the material's documentation. Since the
links were absent, I had to google the terms and
continue my study. I find it easier for the reader not
to be distracted by googling, but just clicking
and following the suggested links
PR Close#41982
This commit adds support for skipping formatting in `<aio-code>`
elements (which are used by `<code-example>` and `<code-pane>` elements
under the hood) by specifying the `language` option as `'root'`.
This is useful for code-snippets that include plain text.
PR Close#41335
As of v12, strict mode is the default, so you don't have
to opt in anymore. This commit removes the instructions
to add --strict to the ng new.
PR Close#41542
Content projection is an important part of Angular. However, it has
never been documented in the Angular documentation set. This topic
attempts to provide the basics of content projection for developers. It
is not a comprehensive guide; rather, it is a starting point that we
can hopefully expand upon in the future.
PR Close#41143
Update the statement expressing Angular's supported versions of Node.js. Previously, we stated
that the `current` version of Node.js was supported, however Node.js's `current` version maps
more closely to what we would term a `next` branch and is not expected meant for usage with
production applications. This intention is stated on Node.js Releases page:
> Production applications should only use Active LTS or Maintenance LTS releases.
PR Close#41820
Since angular 11 extra package.json isn't generated and with version 12 strict mode is opt out bases.
Updated document to reflect the state
Closes#40841.
PR Close#41923
[`watchr` v4.0.0][1] changes the way watched directories are
scanned/watched, thus causing a great increase in the consumed CPU and
RAM. This affects the performance of the `docs-watch` and transitively
`serve-and-sync` npm scripts.
(For reference, on my local machine it goes from 0% CPU and 275MB RAM
with v3.0.1 to 50% CPU and 10GB RAM with v4+.)
This commit pins `watchr` to version 3.0.1 (which is the latest version
that does not cause performance issues) and disabled automatic updates
via Renovate.
[1]: https://github.com/bevry/watchr/releases/tag/v4.0.0
PR Close#41903
Previously example for handling client-side errors in networking didn't work when there was no Internet connection.
Caught error is ProgressEvent in such case, not ErrorEvent and error.error.message is undefined.
PR Close#36608
Follow-up to #41826
The CLI now no longer installs `ts-node` since Protractor has been removed.
See https://github.com/angular/angular-cli/pull/20601 for the relevant PR in angular-cli.
This change has been released in the CLI v12.0.0-rc.1
PR Close#41873
* `SelectivePreloadingStrategyService` is already provided in the root
module, so it should not be added to `AppRoutingModule` providers
array
PR Close#41859
With this change we add the `assert` polyfill which is required because `timezone-mock` is a Node.JS library which is being used in Browser.
PR Close#41764
In #41788, logic was added to disambiguate case-insensitively equal docs
paths/URLs. This process includes appending a `-\d+` suffix to some
paths/URLs (for example, `/.../inject-1`). Unfortunately, some of the
Firebase redirects configured in `firebase.json` would match these URLs
and redirect them to non-existing paths.
Example failures: [stable][1], [next][2]
NOTE:
This was not picked up in the regular CI tests run for PRs, because the
local devserver and the preview server used to test PRs do not support
Firebase-like redirects.
This commit fixes this by ensuring these disambiguated paths/URLs are
not matched by the redirect rules by checking whether the part of the
suffix after the `-` contains any numeric digits. While this check is
not ideal, it should be good enough for our purpose, since the legacy
URLs that we do want to redirect contain suffixes such as `-class`,
`-function` and thus no numeric digits.
[1]: https://circleci.com/gh/angular/angular/974345
[2]: https://circleci.com/gh/angular/angular/974346
PR Close#41842
In ##41788, the `disambiguateDocsPathsProcessor` was introduced to fix
an issue with case-insensitively equal paths. This processor may alter
the paths of some docs and thus their final URL in the app.
Previously, both the `disambiguateDocPathsProcessor` and the
`createSitemap` processor (which relies on the docs' computed paths to
generate the sitemap file) were configured to run before the
"rendering-docs" phase. However, this resulted in the
`disambiguateDocPathsProcessor`'s running after `createSitemap`, which
meant that the sitemap did not include the updated doc paths.
This commit fixes it by ensuring that the
`disambiguateDocPathsProcessor` is explicitly run before the
`createSitemap` processor, so that the latter will be able to take into
account any changes made by the former.
PR Close#41842
This commit includes the URL under test in the test description in
`testFirebaseRedirection.spec.ts` to make it easier to identify the
affected URL when a test fails.
It also avoids unnecessarily creating multiple `FirebaseRedirector`
instances by sharing instances between tests.
PR Close#41842
This commit updates the utilities in `firebase-test-utils/` to also
support testing Firebase redirects that are configured using regular
expressions (via the `regex` property).
See the [Firebase docs][1] for more details.
[1]: https://firebase.google.com/docs/hosting/full-config#redirects
PR Close#41842
Currently, the utilities for testing Firebase redirects assume that the
redirects are configured using the glob-based `source` property.
However, Firebase also supports configuring redirects using regular
expressions (via the `regex` property).
See the [Firebase docs][1] for more details.
This commit refactors the utilities in `firebase-test-utils/` to make it
easy to add support for such regex-based redirect configurations.
[1]: https://firebase.google.com/docs/hosting/full-config#redirects
PR Close#41842
Previously, the tests in `create-example.spec.ts` made assertions using
some hard-coded absolute paths (something like `/foo/bar`). This caused
the tests to fail on Windows, where the absolute paths are prefixed with
the drive letter (something like `C:/foo/bar`).
This commit uses `path.resolve()` to ensure paths are converted to the
format used on the current OS.
PR Close#41842
This section states that "Importing a module with services means that you will have a new instance of that service". This is only true for lazy-loaded `NgModules`. For non-lazy-loaded modules, my understanding is that the providers arrays are flattened into the root injector meaning that importing a module with a service doesn't create a new instance of that service.
PR Close#41835
These docs were linking directly to docs that have ambiguous paths.
These changes ensure that these links are not affected by the
disambiguation processing of those docs.
PR Close#41788
When two documents have the same `outputPath`, only differing by
letter casing, there can be problems on case-insensitive file-systems:
Only one of each of the docs would end up being written.
Moreover, the Webpack 5 bundler will error if it comes across files
that have this kind of ambiguous paths.
This commit adds a new docType: `disambiguator`, which will display
a list of the docs that match an ambiguous path. Each of the ambiguous
docs is then given a unique path and outputPath to ensure there are no
collisions.
PR Close#41788
Previously, the `autoLinkCode` Dgeni post-processor would not apply the
custom filters when matching the whole contents of a `<code>` element.
This meant that custom filters would not be applied to single-word
`<code>` elements.
You can see occurrences of this issue in the following sections of the
"Reactive forms" guide:
- [Creating nested form groups][1]
(look for `street, city, state, and zip controls`)
- [Using the FormBuilder service to generate controls][2]
(look for `group method`)
This commit fixes this by also applying the custom filters when
processing the whole contents of a `<code>` element.
This commit also updates the `filterPipes` custom filter to allow
matching a pipe's name in a single-word `<code>` element (where there is
no preceeding `|` character).
[1]: https://v10.angular.io/guide/reactive-forms#creating-nested-form-groups
[2]: https://v10.angular.io/guide/reactive-forms#using-the-formbuilder-service-to-generate-controls
PR Close#41709
While generating the docs, when a `<code>` element is inspected for
auto-linking, the `autoLinkCode` Dgeni post-processor will break its
contents up into words and generate text nodes for those words that
should not be auto-linked.
Previously, our text node visitor would visit these generated text nodes
and try to auto-link them too. As a result, it would unnecessarily
process nodes that had already been checked (and could potentially
generate links that would otherwise be ignored).
You can see an occurrence of this issue in the
[Create the product list][1] section of the
"Getting started with Angular" tutorial (look for `<a>`).
This commit fixes this by ensuring the visitor will skip the current
node and any nodes generated by `autoLinkCode`.
[1]: https://v11.angular.io/start#create-the-product-list
PR Close#41709