@openrewrite/recipes-angular 1.9.0 → 1.10.0-20260813-195315

package/src/search/find-http-xhr-backend-usage.ts

@@ -0,0 +1,44 @@
+/*
+ * Copyright 2026 the original author or authors.
+ *
+ * Moderne Proprietary. Only for use by Moderne customers under the terms of a commercial contract.
+ */
+
+import {ExecutionContext, foundSearchResult, Recipe, TreeVisitor} from "@openrewrite/rewrite";
+import {JavaScriptVisitor, JS} from "@openrewrite/rewrite/javascript";
+import {isIdentifier, J} from "@openrewrite/rewrite/java";
+
+export class FindHttpXhrBackendUsage extends Recipe {
+    readonly name = "org.openrewrite.angular.search.find-http-xhr-backend-usage";
+    readonly displayName: string = "Find `HttpXhrBackend` usage";
+    readonly description: string = "Finds imports of `HttpXhrBackend` from `@angular/common/http`. " +
+        "Angular 22 uses the Fetch API by default; add `withXhr()` to `provideHttpClient()` to keep using `XMLHttpRequest`, " +
+        "which is also required for upload progress reports.";
+
+    async editor(): Promise<TreeVisitor<any, ExecutionContext>> {
+        return new class extends JavaScriptVisitor<ExecutionContext> {
+            protected async visitImportDeclaration(jsImport: JS.Import, p: ExecutionContext): Promise<J | undefined> {
+                const imp = await super.visitImportDeclaration(jsImport, p) as JS.Import;
+                if (!imp.moduleSpecifier) return imp;
+
+                const moduleSpec = imp.moduleSpecifier.element;
+                if (moduleSpec.kind !== J.Kind.Literal) return imp;
+                if ((moduleSpec as J.Literal).value !== '@angular/common/http') return imp;
+
+                const namedBindings = imp.importClause?.namedBindings;
+                if (namedBindings?.kind === JS.Kind.NamedImports) {
+                    const named = namedBindings as JS.NamedImports;
+                    for (const specifier of named.elements.elements) {
+                        const spec = specifier.element as JS.ImportSpecifier;
+                        if (isIdentifier(spec.specifier) && spec.specifier.simpleName === 'HttpXhrBackend') {
+                            return foundSearchResult(imp,
+                                "HttpXhrBackend is no longer the default in Angular 22. Use provideHttpClient(withXhr()) to keep XMLHttpRequest based requests. See https://angular.dev/api/common/http/withXhr");
+                        }
+                    }
+                }
+
+                return imp;
+            }
+        };
+    }
+}

package/src/search/find-implicit-params-inheritance.ts

@@ -0,0 +1,49 @@
+/*
+ * Copyright 2026 the original author or authors.
+ *
+ * Moderne Proprietary. Only for use by Moderne customers under the terms of a commercial contract.
+ */
+
+import {ExecutionContext, foundSearchResult, Recipe, TreeVisitor} from "@openrewrite/rewrite";
+import {JavaScriptVisitor} from "@openrewrite/rewrite/javascript";
+import {isIdentifier, J} from "@openrewrite/rewrite/java";
+
+export class FindImplicitParamsInheritance extends Recipe {
+    readonly name = "org.openrewrite.angular.search.find-implicit-params-inheritance";
+    readonly displayName: string = "Find router configuration relying on the default `paramsInheritanceStrategy`";
+    readonly description: string = "Finds `provideRouter()` and `RouterModule.forRoot()` calls that do not set `paramsInheritanceStrategy`. " +
+        "Angular 22 changed the default from `emptyOnly` to `always`, so route parameters and data are now inherited from all parent routes.";
+
+    async editor(): Promise<TreeVisitor<any, ExecutionContext>> {
+        return new class extends JavaScriptVisitor<ExecutionContext> {
+            override async visitMethodInvocation(method: J.MethodInvocation, p: ExecutionContext): Promise<J | undefined> {
+                const m = await super.visitMethodInvocation(method, p) as J.MethodInvocation;
+                if (!m || !isIdentifier(m.name)) return m;
+
+                const isProvideRouter = !m.select && m.name.simpleName === 'provideRouter';
+                const isForRoot = m.name.simpleName === 'forRoot' &&
+                    !!m.select && isIdentifier(m.select.element) && m.select.element.simpleName === 'RouterModule';
+                if (!isProvideRouter && !isForRoot) return m;
+
+                if (await declaresParamsInheritanceStrategy(m, p)) return m;
+
+                return foundSearchResult(m,
+                    "paramsInheritanceStrategy defaults to 'always' as of Angular 22. Set it to 'emptyOnly' to keep the previous behavior.");
+            }
+        };
+    }
+}
+
+async function declaresParamsInheritanceStrategy(method: J.MethodInvocation, p: ExecutionContext): Promise<boolean> {
+    let found = false;
+    const detector = new class extends JavaScriptVisitor<ExecutionContext> {
+        override async visitIdentifier(identifier: J.Identifier, ctx: ExecutionContext): Promise<J | undefined> {
+            if (identifier.simpleName === 'paramsInheritanceStrategy') found = true;
+            return identifier;
+        }
+    }();
+    for (const element of method.arguments?.elements ?? []) {
+        await detector.visit(element.element, p);
+    }
+    return found;
+}

package/src/search/find-provide-routes-usage.ts

@@ -0,0 +1,43 @@
+/*
+ * Copyright 2026 the original author or authors.
+ *
+ * Moderne Proprietary. Only for use by Moderne customers under the terms of a commercial contract.
+ */
+
+import {ExecutionContext, foundSearchResult, Recipe, TreeVisitor} from "@openrewrite/rewrite";
+import {JavaScriptVisitor, JS} from "@openrewrite/rewrite/javascript";
+import {isIdentifier, J} from "@openrewrite/rewrite/java";
+
+export class FindProvideRoutesUsage extends Recipe {
+    readonly name = "org.openrewrite.angular.search.find-provide-routes-usage";
+    readonly displayName: string = "Find `provideRoutes` usage";
+    readonly description: string = "Finds imports of `provideRoutes` from `@angular/router`, which was removed in Angular 22. " +
+        "Use `provideRouter()`, or provide the `ROUTES` multi token directly.";
+
+    async editor(): Promise<TreeVisitor<any, ExecutionContext>> {
+        return new class extends JavaScriptVisitor<ExecutionContext> {
+            protected async visitImportDeclaration(jsImport: JS.Import, p: ExecutionContext): Promise<J | undefined> {
+                const imp = await super.visitImportDeclaration(jsImport, p) as JS.Import;
+                if (!imp.moduleSpecifier) return imp;
+
+                const moduleSpec = imp.moduleSpecifier.element;
+                if (moduleSpec.kind !== J.Kind.Literal) return imp;
+                if ((moduleSpec as J.Literal).value !== '@angular/router') return imp;
+
+                const namedBindings = imp.importClause?.namedBindings;
+                if (namedBindings?.kind === JS.Kind.NamedImports) {
+                    const named = namedBindings as JS.NamedImports;
+                    for (const specifier of named.elements.elements) {
+                        const spec = specifier.element as JS.ImportSpecifier;
+                        if (isIdentifier(spec.specifier) && spec.specifier.simpleName === 'provideRoutes') {
+                            return foundSearchResult(imp,
+                                "provideRoutes() was removed in Angular 22. Use provideRouter(), or the ROUTES multi token if necessary.");
+                        }
+                    }
+                }
+
+                return imp;
+            }
+        };
+    }
+}

package/src/search/find-template-safe-navigation.ts

@@ -0,0 +1,72 @@
+/*
+ * Copyright 2026 the original author or authors.
+ *
+ * Moderne Proprietary. Only for use by Moderne customers under the terms of a commercial contract.
+ */
+
+import {ExecutionContext, foundSearchResult, Recipe, TreeVisitor} from "@openrewrite/rewrite";
+import {PlainText, PlainTextVisitor} from "@openrewrite/rewrite/text";
+import {JavaScriptVisitor} from "@openrewrite/rewrite/javascript";
+import {isIdentifier, isLiteral, J} from "@openrewrite/rewrite/java";
+
+const MESSAGE = "Safe navigation in an Angular template returns undefined rather than null as of Angular 22. " +
+    "Review bindings that distinguish the two, such as comparisons against null and pipes that treat null and " +
+    "undefined differently. See https://angular.dev/errors/safe-navigation-undefined";
+
+/** `{{ a?.b }}`, `[x]="a?.b"`, and `@if (a?.b)`, but not `a ?? b` or the `?.` of a TypeScript expression. */
+const SAFE_NAVIGATION = /\?\.(?![.\d])/;
+
+export class FindTemplateSafeNavigation extends Recipe {
+    readonly name = "org.openrewrite.angular.search.find-template-safe-navigation";
+    readonly displayName: string = "Find safe navigation in Angular templates";
+    readonly description: string = "Finds `?.` in HTML templates and in inline `template` metadata. Angular 22 changed " +
+        "safe navigation in templates to return `undefined` instead of `null`, which changes bindings that tell the two " +
+        "apart. Angular ships a `$safeNavigationMigration()` wrapper for this; this recipe reports the templates to review " +
+        "rather than rewriting the expressions.";
+
+    async recipeList(): Promise<Recipe[]> {
+        return [new FindHtmlSafeNavigation(), new FindInlineTemplateSafeNavigation()];
+    }
+}
+
+class FindHtmlSafeNavigation extends Recipe {
+    readonly name = "org.openrewrite.angular.search.find-template-safe-navigation.html";
+    readonly displayName: string = "Find safe navigation in HTML templates";
+    readonly description: string = "Finds `?.` in `.html` templates.";
+
+    async editor(): Promise<TreeVisitor<any, ExecutionContext>> {
+        return new class extends PlainTextVisitor<ExecutionContext> {
+            override async visitText(text: PlainText, p: ExecutionContext): Promise<PlainText | undefined> {
+                const t = await super.visitText(text, p) as PlainText;
+                if (!t || !t.sourcePath.endsWith('.html')) return t;
+                if (!SAFE_NAVIGATION.test(t.text)) return t;
+
+                return foundSearchResult(t, MESSAGE);
+            }
+        }();
+    }
+}
+
+class FindInlineTemplateSafeNavigation extends Recipe {
+    readonly name = "org.openrewrite.angular.search.find-template-safe-navigation.inline";
+    readonly displayName: string = "Find safe navigation in inline templates";
+    readonly description: string = "Finds `?.` in inline `template` metadata of `@Component` decorators.";
+
+    async editor(): Promise<TreeVisitor<any, ExecutionContext>> {
+        return new class extends JavaScriptVisitor<ExecutionContext> {
+            protected async visitPropertyAssignment(property: any, p: ExecutionContext): Promise<J | undefined> {
+                const prop = await super.visitPropertyAssignment(property, p) as any;
+                if (!prop) return prop;
+
+                const name = prop.name?.element;
+                if (!isIdentifier(name) || name.simpleName !== 'template') return prop;
+
+                const initializer = prop.initializer;
+                if (!initializer || !isLiteral(initializer)) return prop;
+                if (!SAFE_NAVIGATION.test(initializer.valueSource ?? '')) return prop;
+
+                return foundSearchResult(prop, MESSAGE);
+            }
+        }();
+    }
+}