fix(linter): handle string extends property in config (#19674)

packages/eslint/src/generators/utils/eslint-file.spec.ts

@@ -1,11 +1,12 @@
 import {
+  addExtendsToLintConfig,
   baseEsLintConfigFile,
   eslintConfigFileWhitelist,
   findEslintFile,
   lintConfigHasOverride,
 } from './eslint-file';
 
-import { Tree } from '@nx/devkit';
+import { Tree, readJson } from '@nx/devkit';
 import { createTreeWithEmptyWorkspace } from '@nx/devkit/testing';
 
 describe('@nx/eslint:lint-file', () => {
@@ -73,4 +74,48 @@ describe('@nx/eslint:lint-file', () => {
       ).toBe(false);
     });
   });
+
+  describe('addExtendsToLintConfig', () => {
+    it('should update string extends property to array', () => {
+      tree.write(
+        'apps/demo/.eslintrc.json',
+        JSON.stringify({
+          extends: '../../.eslintrc',
+          rules: {},
+          overrides: [
+            {
+              files: ['**/*.ts', '**/*.tsx'],
+              rules: {
+                '@typescript-eslint/no-unused-vars': 'off',
+              },
+            },
+            {
+              files: ['./package.json'],
+              parser: 'jsonc-eslint-parser',
+              rules: {
+                '@nx/dependency-checks': [
+                  'error',
+                  {
+                    buildTargets: ['build'],
+                    includeTransitiveDependencies: true,
+                    ignoredFiles: [
+                      '{projectRoot}/remix.config.js',
+                      '{projectRoot}/tailwind.config.js',
+                    ],
+                    ignoredDependencies: ['saslprep'],
+                  },
+                ],
+              },
+            },
+          ],
+          ignorePatterns: ['!**/*', 'build/**/*'],
+        })
+      );
+      addExtendsToLintConfig(tree, 'apps/demo', 'plugin:playwright/recommend');
+      expect(readJson(tree, 'apps/demo/.eslintrc.json').extends).toEqual([
+        'plugin:playwright/recommend',
+        '../../.eslintrc',
+      ]);
+    });
+  });
 });

packages/eslint/src/generators/utils/eslint-file.ts

@@ -299,7 +299,11 @@ export function addExtendsToLintConfig(
   } else {
     const fileName = joinPathFragments(root, '.eslintrc.json');
     updateJson(tree, fileName, (json) => {
-      json.extends = [...plugins, ...(json.extends ?? [])];
+      json.extends ??= [];
+      json.extends = [
+        ...plugins,
+        ...(Array.isArray(json.extends) ? json.extends : [json.extends]),
+      ];
       return json;
     });
   }