fix(@schematics/angular): retain trailing comma when adding providers…

… to app config This fixes an issue which caused the new provider to be added in the position of the trailing comma. With this change the trailing comma is retained. Closes #26911 (cherry picked from commit 90363dd)
angular · Jan 23, 2024 · 35ebf1e · 35ebf1e
1 parent 45dea6f
commit 35ebf1e
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 3 deletions.
diff --git a/packages/schematics/angular/utility/standalone/rules.ts b/packages/schematics/angular/utility/standalone/rules.ts
@@ -231,12 +231,10 @@ function addProvidersExpressionToAppConfig(
   // If there's a `providers` property, we can add the provider
   // to it, otherwise we need to declare it ourselves.
   if (providersLiteral) {
-    const hasTrailingComma = providersLiteral.elements.hasTrailingComma;
-
     applyChangesToFile(tree, filePath, [
       insertAfterLastOccurrence(
         providersLiteral.elements,
-        (hasTrailingComma || providersLiteral.elements.length === 0 ? '' : ', ') + expression,
+        (providersLiteral.elements.length === 0 ? '' : ', ') + expression,
         filePath,
         providersLiteral.getStart() + 1,
       ),

diff --git a/packages/schematics/angular/utility/standalone/rules_spec.ts b/packages/schematics/angular/utility/standalone/rules_spec.ts
@@ -445,5 +445,36 @@ describe('standalone utilities', () => {
       assertContains(content, `import { provideModule } from '@my/module';`);
       assertContains(content, `providers: [provideModule([])]`);
     });
+
+    it('should add a root provider to a standalone app when providers contain a trailing comma', async () => {
+      await setupProject(true);
+
+      const configPath = 'app/app.config.ts';
+      host.overwrite(
+        getPathWithinProject(configPath),
+        `
+        import { ApplicationConfig } from '@angular/core';
+        import { provideRouter } from '@angular/router';
+
+        export const appConfig: ApplicationConfig = {
+          providers: [
+            provideRouter([]),
+          ]
+        };
+      `,
+      );
+
+      await testRule(
+        addRootProvider(
+          projectName,
+          ({ code, external }) => code`${external('provideModule', '@my/module')}([])`,
+        ),
+        host,
+      );
+
+      const content = readFile('app/app.config.ts');
+      assertContains(content, `import { provideModule } from '@my/module';`);
+      assertContains(content, `providers: [provideRouter([]),provideModule([]),]`);
+    });
   });
 });