Skip to content

Commit 54de2d6

Browse files
authored
feat: update origin v20.0 (#1022)
* feat: update origin to v20.0 * feat: merge untraslated files * fix: migrate adev app source code changes * fix: migrate guide changes * fix: migrate tutorial changes * fix: migrate recommendation changes * fix: migrate toc changes * fix: update patches * fix: update Node.js version to 22.12.0 * fix: correct formatting of Node.js version * fix: migrate untranslated files * fix: migrate changes * fix: migrate patches * fix: lint fix * fix: update origin * fix
1 parent 6940a9f commit 54de2d6

File tree

351 files changed

+6270
-6121
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

351 files changed

+6270
-6121
lines changed

.node-version

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
v20.13.1
1+
22.12.0

adev-ja/shared-docs/components/table-of-contents/table-of-contents.component.en.html

Lines changed: 12 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -6,26 +6,18 @@ <h2 class="docs-title">On this page</h2>
66
<ul class="docs-faceted-list">
77
<!-- TODO: Hide li elements with class docs-toc-item-h3 for laptop, table and phone screen resolutions -->
88
@for (item of tableOfContentItems(); track item.id) {
9-
<li
10-
class="docs-faceted-list-item"
11-
[class.docs-toc-item-h2]="item.level === TableOfContentsLevel.H2"
12-
[class.docs-toc-item-h3]="item.level === TableOfContentsLevel.H3"
13-
>
14-
<!-- Not using routerLink + fragment because of: https://github.com/angular/angular/issues/30139 -->
15-
<a
16-
[href]="location.path() + '#' + item.id"
17-
[class.docs-faceted-list-item-active]="item.id === activeItemId()"
18-
>
19-
{{ item.title }}
20-
</a>
21-
</li>
9+
<li class="docs-faceted-list-item" [class.docs-toc-item-h2]="item.level === TableOfContentsLevel.H2"
10+
[class.docs-toc-item-h3]="item.level === TableOfContentsLevel.H3">
11+
<!-- Not using routerLink + fragment because of: https://github.com/angular/angular/issues/30139 -->
12+
<a [href]="location.path() + '#' + item.id" [class.docs-faceted-list-item-active]="item.id === activeItemId()">
13+
{{ item.title }}
14+
</a>
15+
</li>
2216
}
2317
</ul>
2418
</nav>
25-
@if (shouldDisplayScrollToTop()) {
26-
<button type="button" (click)="scrollToTop()">
27-
<docs-icon role="presentation">arrow_upward_alt</docs-icon>
28-
Back to the top
29-
</button>
30-
}
31-
</aside>
19+
<button type="button" (click)="scrollToTop()">
20+
<docs-icon role="presentation">arrow_upward_alt</docs-icon>
21+
Back to the top
22+
</button>
23+
</aside>

adev-ja/shared-docs/components/table-of-contents/table-of-contents.component.html

Lines changed: 12 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -6,26 +6,18 @@ <h2 class="docs-title">目次</h2>
66
<ul class="docs-faceted-list">
77
<!-- TODO: Hide li elements with class docs-toc-item-h3 for laptop, table and phone screen resolutions -->
88
@for (item of tableOfContentItems(); track item.id) {
9-
<li
10-
class="docs-faceted-list-item"
11-
[class.docs-toc-item-h2]="item.level === TableOfContentsLevel.H2"
12-
[class.docs-toc-item-h3]="item.level === TableOfContentsLevel.H3"
13-
>
14-
<!-- Not using routerLink + fragment because of: https://github.com/angular/angular/issues/30139 -->
15-
<a
16-
[href]="location.path() + '#' + item.id"
17-
[class.docs-faceted-list-item-active]="item.id === activeItemId()"
18-
>
19-
{{ item.title }}
20-
</a>
21-
</li>
9+
<li class="docs-faceted-list-item" [class.docs-toc-item-h2]="item.level === TableOfContentsLevel.H2"
10+
[class.docs-toc-item-h3]="item.level === TableOfContentsLevel.H3">
11+
<!-- Not using routerLink + fragment because of: https://github.com/angular/angular/issues/30139 -->
12+
<a [href]="location.path() + '#' + item.id" [class.docs-faceted-list-item-active]="item.id === activeItemId()">
13+
{{ item.title }}
14+
</a>
15+
</li>
2216
}
2317
</ul>
2418
</nav>
25-
@if (shouldDisplayScrollToTop()) {
26-
<button type="button" (click)="scrollToTop()">
27-
<docs-icon role="presentation">arrow_upward_alt</docs-icon>
28-
トップに戻る
29-
</button>
30-
}
31-
</aside>
19+
<button type="button" (click)="scrollToTop()">
20+
<docs-icon role="presentation">arrow_upward_alt</docs-icon>
21+
トップに戻る
22+
</button>
23+
</aside>

adev-ja/src/app/core/layout/navigation/navigation.component.en.html

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<!-- Primary Nav -->
22
<div
33
[attr.id]="PRIMARY_NAV_ID"
4+
class="wrapper"
45
(docsClickOutside)="closeMobileNav()"
56
[docsClickOutsideIgnore]="[SECONDARY_NAV_ID]"
67
>
@@ -149,7 +150,7 @@
149150
(cdkMenuClosed)="closeMenu()"
150151
(click)="openVersionMenu($event)"
151152
>
152-
{{ currentDocsVersion()?.displayName }}
153+
{{ currentDocsVersion().displayName }}
153154
<svg
154155
xmlns="http://www.w3.org/2000/svg"
155156
height="15"

adev-ja/src/app/core/layout/navigation/navigation.component.html

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<!-- Primary Nav -->
22
<div
33
[attr.id]="PRIMARY_NAV_ID"
4+
class="wrapper"
45
(docsClickOutside)="closeMobileNav()"
56
[docsClickOutsideIgnore]="[SECONDARY_NAV_ID]"
67
>
@@ -149,7 +150,7 @@
149150
(cdkMenuClosed)="closeMenu()"
150151
(click)="openVersionMenu($event)"
151152
>
152-
{{ currentDocsVersion()?.displayName }}
153+
{{ currentDocsVersion().displayName }}
153154
<svg
154155
xmlns="http://www.w3.org/2000/svg"
155156
height="15"

adev-ja/src/app/features/update/recommendations.en.ts

Lines changed: 177 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1822,7 +1822,7 @@ export const RECOMMENDATIONS: Step[] = [
18221822
material: true,
18231823
step: 'v15 mat refactor',
18241824
action:
1825-
'In Angular Material v15, many of the components have been refactored to be based on the official Material Design Components for Web (MDC). This change affected the DOM and CSS classes of many components. <a href="https://rc.material.angular.io/guide/mdc-migration" alt="Link to more information about this change">Read further</a>',
1825+
'In Angular Material v15, many of the components have been refactored to be based on the official Material Design Components for Web (MDC). This change affected the DOM and CSS classes of many components. <a href="https://rc.material.angular.dev/guide/mdc-migration" alt="Link to more information about this change">Read further</a>',
18261826
},
18271827
{
18281828
possibleIn: 1500,
@@ -1919,7 +1919,7 @@ export const RECOMMENDATIONS: Step[] = [
19191919
level: ApplicationComplexity.Medium,
19201920
step: 'v16 createUrlTree',
19211921
action:
1922-
'After bug fixes in `Router.createUrlTree` you may have to readjust tests which mock `ActiveRoute`. [Read further](https://github.com/angular/angular/blob/main/CHANGELOG.md#1600-next1-2023-03-01)',
1922+
'After bug fixes in `Router.createUrlTree` you may have to readjust tests which mock `ActivatedRoute`. [Read further](https://github.com/angular/angular/blob/main/CHANGELOG.md#1600-2023-05-03)',
19231923
},
19241924
{
19251925
possibleIn: 1600,
@@ -2537,4 +2537,179 @@ export const RECOMMENDATIONS: Step[] = [
25372537
possibleIn: 1900,
25382538
step: '19.0.0-update-fakeasync-to-flush-pending-timers',
25392539
},
2540+
{
2541+
action:
2542+
"In the application's project directory, run `ng update @angular/core@20 @angular/cli@20` to update your application to Angular v20.",
2543+
level: ApplicationComplexity.Basic,
2544+
necessaryAsOf: 2000,
2545+
possibleIn: 2000,
2546+
step: '20.0.0_ng_update',
2547+
},
2548+
{
2549+
possibleIn: 2000,
2550+
necessaryAsOf: 2000,
2551+
level: ApplicationComplexity.Basic,
2552+
material: true,
2553+
step: 'update @angular/material',
2554+
action: 'Run `ng update @angular/material@20`.',
2555+
},
2556+
{
2557+
possibleIn: 2000,
2558+
necessaryAsOf: 2000,
2559+
level: ApplicationComplexity.Basic,
2560+
step: '20.0.0_rename_afterRender_to_afterEveryRender',
2561+
action: 'Rename the `afterRender` lifecycle hook to `afterEveryRender`',
2562+
},
2563+
{
2564+
possibleIn: 2000,
2565+
necessaryAsOf: 2000,
2566+
level: ApplicationComplexity.Medium,
2567+
step: '20.0.0_replace_TestBed_flushEffects_with_tick',
2568+
action:
2569+
'Replace uses of `TestBed.flushEffects()` with `TestBed.tick()`, the closest equivalent to synchronously flush effects.',
2570+
},
2571+
{
2572+
possibleIn: 2000,
2573+
necessaryAsOf: 2000,
2574+
level: ApplicationComplexity.Advanced,
2575+
step: '20.0.0_update_provideCheckNoChangesConfig',
2576+
action:
2577+
'Rename `provideExperimentalCheckNoChangesForDebug` to `provideCheckNoChangesConfig`. Note its behavior now applies to all `checkNoChanges` runs. The `useNgZoneOnStable` option is no longer available.',
2578+
},
2579+
{
2580+
possibleIn: 2000,
2581+
necessaryAsOf: 2000,
2582+
level: ApplicationComplexity.Advanced,
2583+
step: '20.0.0_refactor_ng_reflect_attributes_usage',
2584+
action:
2585+
'Refactor application and test code to avoid relying on `ng-reflect-*` attributes. If needed temporarily for migration, use `provideNgReflectAttributes()` from `@angular/core` in bootstrap providers to re-enable them in dev mode only.',
2586+
},
2587+
{
2588+
possibleIn: 2000,
2589+
necessaryAsOf: 2000,
2590+
level: ApplicationComplexity.Advanced,
2591+
step: '20.0.0_adjust_RedirectFn_return_type_handling',
2592+
action:
2593+
'Adjust code that directly calls functions returning `RedirectFn`. These functions can now also return an `Observable` or `Promise`; ensure your logic correctly handles these asynchronous return types.',
2594+
},
2595+
{
2596+
possibleIn: 2000,
2597+
necessaryAsOf: 2000,
2598+
level: ApplicationComplexity.Advanced,
2599+
step: '20.0.0_rename_provideExperimentalZonelessChangeDetection',
2600+
action:
2601+
'Rename `provideExperimentalZonelessChangeDetection` to `provideZonelessChangeDetection`.',
2602+
},
2603+
{
2604+
possibleIn: 2000,
2605+
necessaryAsOf: 2000,
2606+
level: ApplicationComplexity.Advanced,
2607+
step: '20.0.0_update_template_expressions_using_in_property',
2608+
action:
2609+
"If your templates use `{{ in }}` or `in` in expressions to refer to a component property named 'in', change it to `{{ this.in }}` or `this.in` as 'in' now refers to the JavaScript 'in' operator. If you're using `in` as a template reference, you'd have to rename the reference.",
2610+
},
2611+
{
2612+
possibleIn: 2000,
2613+
necessaryAsOf: 2000,
2614+
level: ApplicationComplexity.Advanced,
2615+
step: '20.0.0_update_router_method_array_parameters_to_readonly',
2616+
action:
2617+
'The type for the commands arrays passed to Router methods (`createUrlTree`, `navigate`, `createUrlTreeFromSnapshot`) have been updated to use `readonly T[]` since the array is not mutated. Code which extracts these types (e.g. with `typeof`) may need to be adjusted if it expects mutable arrays.',
2618+
},
2619+
{
2620+
possibleIn: 2000,
2621+
necessaryAsOf: 2000,
2622+
level: ApplicationComplexity.Advanced,
2623+
step: '20.0.0_update_animation_tests_for_guaranteed_flushing',
2624+
action:
2625+
'Review and update tests asserting on DOM elements involved in animations. Animations are now guaranteed to be flushed with change detection or `ApplicationRef.tick`, potentially altering previous test outcomes.',
2626+
},
2627+
{
2628+
possibleIn: 2000,
2629+
necessaryAsOf: 2000,
2630+
level: ApplicationComplexity.Medium,
2631+
step: '20.0.0_handle_uncaught_listener_errors_in_tests',
2632+
action:
2633+
'In tests, uncaught errors in event listeners are now rethrown by default. Previously, these were only logged to the console by default. Catch them if intentional for the test case, or use `rethrowApplicationErrors: false` in `configureTestingModule` as a last resort.',
2634+
},
2635+
{
2636+
possibleIn: 2000,
2637+
necessaryAsOf: 2000,
2638+
level: ApplicationComplexity.Advanced,
2639+
step: '20.0.0_update_route_guards_array_types',
2640+
action:
2641+
'The `any` type is removed from the Route guard arrays (canActivate, canDeactivate, etc); ensure guards are functions, `ProviderToken<T>`, or (deprecated) strings. Refactor string guards to `ProviderToken<T>` or functions.',
2642+
},
2643+
{
2644+
possibleIn: 2000,
2645+
necessaryAsOf: 2000,
2646+
level: ApplicationComplexity.Basic,
2647+
step: '20.0.0_update_nodejs_version',
2648+
action:
2649+
'Ensure your Node.js version is at least 20.11.1 and not v18 or v22.0-v22.10 before upgrading to Angular v20. Check https://angular.dev/reference/versions for the full list of supported Node.js versions.',
2650+
},
2651+
{
2652+
possibleIn: 2000,
2653+
necessaryAsOf: 2000,
2654+
level: ApplicationComplexity.Basic,
2655+
step: '20.0.0_replace_TestBed_get_with_TestBed_inject',
2656+
action:
2657+
'Replace all occurrences of the deprecated `TestBed.get()` method with `TestBed.inject()` in your Angular tests for dependency injection.',
2658+
},
2659+
{
2660+
possibleIn: 2000,
2661+
necessaryAsOf: 2000,
2662+
level: ApplicationComplexity.Medium,
2663+
step: '20.0.0_remove_InjectFlags_usage',
2664+
action:
2665+
'Remove `InjectFlags` enum and its usage from `inject`, `Injector.get`, `EnvironmentInjector.get`, and `TestBed.inject` calls. Use options like `{optional: true}` for `inject` or handle null for `*.get` methods.',
2666+
},
2667+
{
2668+
possibleIn: 2000,
2669+
necessaryAsOf: 2000,
2670+
level: ApplicationComplexity.Advanced,
2671+
step: '20.0.0_update_injector_get_calls_to_use_ProviderToken',
2672+
action:
2673+
'Update `injector.get()` calls to use a specific `ProviderToken<T>` instead of relying on the removed `any` overload. If using string tokens (deprecated since v4), migrate them to `ProviderToken<T>`.',
2674+
},
2675+
{
2676+
possibleIn: 2000,
2677+
necessaryAsOf: 2000,
2678+
level: ApplicationComplexity.Basic,
2679+
step: '20.0.0_update_typescript_version',
2680+
action:
2681+
"Upgrade your project's TypeScript version to at least 5.8 before upgrading to Angular v20 to ensure compatibility.",
2682+
},
2683+
{
2684+
possibleIn: 2000,
2685+
necessaryAsOf: 2000,
2686+
level: ApplicationComplexity.Advanced,
2687+
step: '20.0.0_review_AsyncPipe_error_handling_in_tests',
2688+
action:
2689+
'`Unhandled errors in subscriptions/promises of AsyncPipe` are now directly reported to `ErrorHandler`. This may alter test outcomes; ensure tests correctly handle these reported errors.',
2690+
},
2691+
{
2692+
possibleIn: 2000,
2693+
necessaryAsOf: 2000,
2694+
level: ApplicationComplexity.Advanced,
2695+
step: '20.0.0_refactor_PendingTasks_run_usage',
2696+
action:
2697+
'If relying on the return value of `PendingTasks.run`, refactor to use `PendingTasks.add`. Handle promise results/rejections manually, especially for SSR to prevent node process shutdown on unhandled rejections.',
2698+
},
2699+
{
2700+
possibleIn: 2000,
2701+
necessaryAsOf: 2000,
2702+
level: ApplicationComplexity.Advanced,
2703+
step: '20.0.0_update_template_expressions_using_void_property',
2704+
action:
2705+
"If your templates use `{{ void }}` or `void` in expressions to refer to a component property named 'void', change it to `{{ this.void }}` or `this.void` as 'void' now refers to the JavaScript `void` operator.",
2706+
},
2707+
{
2708+
possibleIn: 2000,
2709+
necessaryAsOf: 2000,
2710+
level: ApplicationComplexity.Advanced,
2711+
step: '20.0.0_review_date_pipe_formatter_Y_usage',
2712+
action:
2713+
'Review `DatePipe` usages. Using the `Y` (week-numbering year) formatter without also including `w` (week number) is now detected as suspicious. Use `y` (year) if that was the intent, or include `w` alongside `Y`.',
2714+
},
25402715
];

0 commit comments

Comments
 (0)