ang2-conduit

Angular 12.2.17, 10 majors behind 22.

Installed

12.2.17

package-lock.json

Latest

22

npm registry

Majors behind

10

Build system

webpack

• HighAngular 12 is 10 majors behind 22 and out of support

  Angular supports each major for 18 months, so only the newest three get fixes; 12 receives no security patches. ng update moves one major at a time, which makes this 10 sequential upgrade steps, each with its own migrations to review.

• Medium1 project still built with the webpack builder

  The esbuild-based application builder has been the default since Angular 17 and builds several times faster. ng update @angular/cli --name use-application-builder migrates the configuration. Projects: ang2-conduit.

• Mediumprotractor is end of life

  End of life since 2023. Replaced by Playwright or Cypress.

• Mediumtslint is end of life

  Deprecated since 2019. Replaced by ESLint with angular-eslint.

• Mediumcodelyzer is end of life

  A set of TSLint rules, so it died with TSLint. Replaced by angular-eslint.

Nothing deprecated as of Angular 12 is in use; APIs deprecated in later versions surface at each upgrade step.

Deprecated symbols

0

Files affected

0

Legacy template directives

13

not deprecated in this version

No third-party package depends on Angular.

Depend on Angular

0

third-party packages

Block the upgrade

0

to Angular 22

Peer mismatches

0

with Angular 12

Deprecated on npm

0

Runs on zone.js; 0% of 18 components use OnPush.

Mode

zone.js

OnPush

0%

0 of 18 components

Files injecting NgZone

0

Zone test helpers

0

• NoteZoneless change detection needs Angular 20.2 or newer

  Upgrade first; OnPush coverage is the preparation that pays off now.

• Medium18 components use eager change detection (100%)

  Without changeDetection: ChangeDetectionStrategy.OnPush a component is checked on every change detection cycle and usually relies on zone.js to notice mutations. These are the components to review before going zoneless.

  • src/app/app.component.ts:5
  • src/app/article/article-comment.component.ts:6
  • src/app/article/article.component.ts:14
  • src/app/auth/auth.component.ts:7
  • src/app/editor/editor.component.ts:7
  • and 13 more

18 components: 0% standalone, 0% signal inputs, 0% built-in control flow.

Components

18

Standalone

0%

16 NgModules

Signal inputs

0%

0 of 9

Signal outputs

0%

0 of 3

Built-in control flow

0%

0 of 13 blocks

@defer blocks

0

• Medium18 components still declared in NgModules (16 NgModules in total)

  Standalone components are the default since Angular 19 and what every new API assumes. ng generate @angular/core:standalone converts declarations, removes the emptied NgModules and switches bootstrapping, in three passes that can be reviewed one at a time.

  • src/app/app.component.ts:5
  • src/app/article/article-comment.component.ts:6
  • src/app/article/article.component.ts:14
  • src/app/auth/auth.component.ts:7
  • src/app/editor/editor.component.ts:7
  • and 13 more
• Medium9 @Input() decorators and 3 @Output() decorators left

  Signal inputs (input()) make inputs readable in computed() and effects without ngOnChanges, and are what zoneless change detection tracks. ng generate @angular/core:signal-input-migration and ng generate @angular/core:output-migration convert most of them; the rest are usually inputs written to from inside the component.

• Low13 uses of *ngIf, *ngFor and [ngSwitch]

  Built-in control flow (@if, @for, @switch) is available from Angular 17. ng generate @angular/core:control-flow migrates most templates automatically.

No classic NgRx, 0 signal()/computed() calls, 0 signal-store files.

Classic NgRx files

0

Signal store files

0

signal() / computed()

0

0 toSignal()

BehaviorSubject services

1

• Low1 service holds state in a BehaviorSubject

  Each is a candidate for a signal()-based service: templates read it without the async pipe, computed() replaces combineLatest chains, and zoneless change detection tracks it automatically. toObservable() keeps existing RxJS consumers working during the move.

  • src/app/core/services/user.service.ts:12

79% of 14 routes lazy, 0 files over 500 lines, 28 classes with constructor injection.

Lazy routes

79%

11 of 14

Large files

0

over 500 lines

Constructor injection

28

classes; 0 inject() calls

Class guards

7

and interceptors

Hotspots

-

shallow clone: no history (fetch-depth: 0)

• Low7 class-based guards and interceptors

  Resolve, CanActivate, HttpInterceptor. Functional guards (CanActivateFn, ResolveFn) and interceptors (HttpInterceptorFn with withInterceptors) are the current style: a function with inject() inside, no class, no provider. Class interceptors also need withInterceptorsFromDi() to keep working with provideHttpClient.

  • src/app/article/article-resolver.service.ts:8
  • src/app/auth/no-auth-guard.service.ts:8
  • src/app/core/interceptors/http.token.interceptor.ts:7
  • src/app/core/services/auth-guard.service.ts:8
  • src/app/editor/editable-article-resolver.service.ts:8
  • and 2 more
• Low28 classes inject through the constructor

  inject() is the current default (0 calls already in the code). It works in field initialisers and functions, and it is what signal-based code expects. ng generate @angular/core:inject migrates constructors automatically.

  • src/app/app.component.ts:10
  • src/app/article/article-comment.component.ts:11
  • src/app/article/article-resolver.service.ts:10
  • src/app/article/article.component.ts:28
  • src/app/auth/auth.component.ts:18
  • and 23 more

Karma, 0 spec files, 0% of components and services with a spec.

Unit-test runner

Karma

Spec files

0

With a spec

0%

0 of 32 component/service files

End-to-end

Protractor

• HighUnit tests run on Karma, which is deprecated

  Karma was deprecated in 2023 and receives no further development. Vitest is the Angular CLI's default runner since v21 (@angular/build:unit-test). With no specs written yet, moving costs only the configuration, and the first specs can be written for Vitest directly.

• HighNo unit tests found

  32 component and service files without a single spec. Every refactoring and upgrade step is verified by hand.

• HighEnd-to-end tests use Protractor, which is end of life

  Protractor reached end of life in 2023 and gets no fixes, including for new browser versions. Playwright and Cypress are the usual replacements.

strictNullChecks off, strictTemplates off, 13 explicit any.

strictNullChecks

off

default in TypeScript 4

strictTemplates

off

default in Angular 12

noImplicitAny

off

default in TypeScript 4

Explicit any

13

8.2 per 1 000 lines

Non-null assertions

0

• HighstrictNullChecks is off

  Every value that may be null or undefined is typed as if it never is, so the most common runtime error in an Angular app is invisible to the compiler. In a large codebase switching it on is staged: a separate tsconfig that checks one folder at a time, with a count that may only go down.

• HighstrictTemplates is off

  Template bindings are only loosely type-checked: a wrong input type, a misspelled output payload or a possibly-undefined value passed to a component compiles and fails at runtime. Turning it on typically surfaces a batch of real bugs alongside the type noise.

• MediumnoImplicitAny is off

  An unannotated parameter silently becomes any, and no lint rule that counts the word any can see it.

• Medium13 explicit any in application code (8.2 per 1 000 lines)

  Files with the most are listed first. Each any switches type checking off for everything that flows through it.

  • src/app/core/services/api.service.ts:14
  • src/app/core/interceptors/http.token.interceptor.ts:11
  • src/test.ts:16
  • src/app/article/article-resolver.service.ts:18
  • src/app/editor/editable-article-resolver.service.ts:19
  • and 2 more
• Low1 @ts-ignore / @ts-expect-error comment

  Each switches off checking for the next line, including errors nobody has seen yet.

No sanitizer bypasses, direct DOM HTML writes or eval in 69 files; 1 sanitized [innerHTML] binding; 23 known vulnerabilities in dependencies.

Direct DOM HTML writes

0

innerHTML =, insertAdjacentHTML

Sanitizer bypasses

0

bypassSecurityTrust*

eval / new Function

0

[innerHTML] bindings

1

sanitized by Angular

Known vulnerabilities

23

in 35 direct dependencies checked

• High23 known vulnerabilities in 4 dependencies (15 high or critical)

  @angular/common 12.2.17: 8 advisories (CVE-2026-54266, CVE-2026-54268, CVE-2025-66035, …), all fixed by 20.3.34; @angular/compiler 12.2.17: 6 advisories (CVE-2026-54265, CVE-2026-50557, CVE-2026-88057, …), all fixed by 20.3.28; @angular/core 12.2.17: 7 advisories (CVE-2026-52725, CVE-2026-50557, CVE-2026-88057, …), all fixed by 20.3.28; @angular/router 12.2.17: 2 advisories (CVE-2026-111752, CVE-2026-101896), all fixed by 20.3.33. Direct dependencies at their exact versions, from the advisories in osv.dev; the full dependency tree is npm audit's job.

• Low1 [innerHTML] binding in 1 template

  Angular sanitizes these, so they are safe on their own: scripts and event handlers are stripped. They become a hole only when the bound value went through bypassSecurityTrustHtml, which is worth checking for each one.

  • src/app/article/article.component.html

No import cycles between application files.

Tangles

0

groups of files in a loop

Files involved

0

Largest tangle

0

files

No build stats found, so the bundle size is not part of this report.

• NoteRun ng build --stats-json (or nx build <app> --stats-json) and re-run to include the bundle size