INT-3361: Update dependencies

eslint.config.mjs

@@ -0,0 +1,77 @@
+// eslint.config.js
+import { defineConfig } from 'eslint/config';
+import tinymceEslintPlugin from '@tinymce/eslint-plugin';
+import js from '@eslint/js';
+
+import pluginChaiFriendly from 'eslint-plugin-chai-friendly';
+
+export default defineConfig([
+	{
+    plugins: {
+        '@tinymce': tinymceEslintPlugin
+    },
+    extends: [ '@tinymce/standard' ],
+    files: [
+      'tinymce-angular-component/src/**/*.ts',
+      'stories/**/*.ts'
+    ],
+    ignores: [
+      'src/demo/demo.ts'
+    ],
+    languageOptions: {
+      parserOptions: {
+        sourceType: 'module',
+        project: [
+            './tsconfig.json'
+        ]
+      },
+    },
+    rules: {
+      '@tinymce/prefer-fun': 'off',
+      'no-underscore-dangle': 'off',
+      '@typescript-eslint/member-ordering': 'off',
+    }
+  },
+  {
+    files: [
+      '**/*.js'
+    ],
+    env: {
+      es6: true,
+      node: true,
+      browser: true
+    },
+    plugins: { js },
+    extends: [ 'js/recommended' ],
+    parser: 'espree',
+    languageOptions: {
+      parserOptions: {
+        ecmaVersion: 2020,
+        sourceType: 'module'
+      },
+    },
+    rules: {
+      'indent': [ 'error', 2, { 'SwitchCase': 1 } ],
+      'no-shadow': 'error',
+      'no-unused-vars': [ 'error', { 'argsIgnorePattern': '^_' } ],
+      'object-curly-spacing': [ 'error', 'always', { 'arraysInObjects': false, 'objectsInObjects': false } ],
+      'quotes': [ 'error', 'single' ],
+      'semi': 'error'
+    }
+  },
+  {
+    files: [
+      '**/*Test.ts',
+      '**/test/**/*.ts'
+    ],
+    plugins: {
+      'chai-friendly': pluginChaiFriendly
+    },
+    rules: {
+      'no-unused-expressions': 'off',
+      'no-console': 'off',
+      'max-classes-per-file': 'off',
+      '@typescript-eslint/no-non-null-assertion': 'off'
+    }
+  }
+]);

package.json

@@ -41,7 +41,7 @@
     "@storybook/blocks": "^8.2.5",
     "@storybook/test": "^8.2.5",
     "@tinymce/beehive-flow": "^0.19.0",
-    "@tinymce/eslint-plugin": "^2.3.1",
+    "@tinymce/eslint-plugin": "^3.0.0",
     "@tinymce/miniature": "^6.0.0",
     "@types/chai": "^4.3.16",
     "@types/node": "^20.14.12",

stories/form-control/FormControl.component.ts

@@ -1,4 +1,3 @@
-/* eslint-disable no-console */
 import { Component } from '@angular/core';
 import { FormBuilder, FormControl } from '@angular/forms';
 import { apiKey } from 'stories/Settings';
@@ -11,9 +10,10 @@ export class FormControlComponent {
   public apiKey = apiKey;
   public formControl: FormControl<string | null>;
 
-  // eslint-disable-next-line @typescript-eslint/no-parameter-properties
+  // eslint-disable-next-line @typescript-eslint/parameter-properties
   public constructor(private readonly formBuilder: FormBuilder) {
     this.formControl = this.formBuilder.control<string | null>(null);
+    // eslint-disable-next-line no-console
     this.formControl.valueChanges.subscribe(console.log);
     this.formControl.setValue('<p>Initial value</p>');
     // Console log should be triggered just once

stories/form-with-on-push/form-with-on-push.component.ts

@@ -1,5 +1,4 @@
 /* eslint-disable @typescript-eslint/unbound-method */
-/* eslint-disable @typescript-eslint/no-parameter-properties */
 import {
   Component,
   ChangeDetectionStrategy,

stories/pipes/Safe.pipe.ts

@@ -5,7 +5,8 @@ import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
   name: 'safe'
 })
 export class SafePipe implements PipeTransform {
-  // eslint-disable-next-line @typescript-eslint/no-parameter-properties
+
+  // eslint-disable-next-line @typescript-eslint/parameter-properties
   public constructor(protected sanitizer: DomSanitizer) {}
 
   public transform(value: string, type: string): SafeHtml {

tinymce-angular-component/src/main/ts/editor/editor.component.ts

@@ -1,4 +1,4 @@
-/* eslint-disable @typescript-eslint/no-parameter-properties */
+/* eslint-disable @typescript-eslint/parameter-properties */
 import { isPlatformBrowser, CommonModule } from '@angular/common';
 import {
   AfterViewInit,
@@ -114,7 +114,7 @@ export class EditorComponent extends Events implements AfterViewInit, ControlVal
     elementRef: ElementRef,
     ngZone: NgZone,
     private cdRef: ChangeDetectorRef,
-    @Inject(PLATFORM_ID) private platformId: Object,
+    @Inject(PLATFORM_ID) private platformId: object,
     @Optional() @Inject(TINYMCE_SCRIPT_SRC) private tinymceScriptSrc?: string
   ) {
     super();

tinymce-angular-component/src/main/ts/utils/Utils.ts

@@ -82,7 +82,6 @@ const normalizePluginArray = (plugins?: string | string[]): string[] => {
 const mergePlugins = (initPlugins: string | string[], inputPlugins?: string | string[]) =>
   normalizePluginArray(initPlugins).concat(normalizePluginArray(inputPlugins));
 
-// eslint-disable-next-line @typescript-eslint/no-empty-function
 const noop: (...args: any[]) => void = () => { };
 
 const isNullOrUndefined = (value: any): value is null | undefined => value === null || value === undefined;

tinymce-angular-component/src/test/ts/alien/TestHooks.ts

@@ -35,10 +35,10 @@ export interface EditorFixture<T> extends ComponentFixture<T> {
 
 export type CreateEditorFixture<T> = (
   props?: Partial<
-  Omit<
-  EditorComponent,
-    `${'on' | 'ng' | 'register' | 'set' | 'write'}${string}` | 'createElement' | 'initialise' | 'editor'
-  >
+    Omit<
+      EditorComponent,
+      `${'on' | 'ng' | 'register' | 'set' | 'write'}${string}` | 'createElement' | 'initialise' | 'editor'
+    >
   >
 ) => Promise<EditorFixture<T>>;
 
@@ -77,7 +77,7 @@ export const editorHook = <T = unknown>(component: Type<T>, moduleDef: TestModul
               if (editor.initialized) {
                 resolve(editor);
               }
-              editor.once('SkinLoaded', () => resolve(editor));
+              editor.once( 'SkinLoaded', () => resolve(editor));
             })
         ),
         map(

tinymce-angular-component/src/test/ts/browser/LoadTinyTest.ts

@@ -8,9 +8,10 @@ import { EditorComponent, TINYMCE_SCRIPT_SRC } from '../../../main/ts/public_api
 import { Version } from '../../../main/ts/editor/editor.component';
 import { editorHook, tinymceVersionHook } from '../alien/TestHooks';
 import type { Editor } from 'tinymce';
-import { deleteTinymce } from '../alien/TestHelpers';
+import { apiKey, deleteTinymce } from '../alien/TestHelpers';
 
 describe('LoadTinyTest', () => {
+  const key = apiKey();
   const assertTinymceVersion = (version: Version, editor: Editor) => {
     Assertions.assertEq(`Loaded version of TinyMCE should be ${version}`, version, editor.editorManager.majorVersion);
     Assertions.assertEq(`Loaded version of TinyMCE should be ${version}`, version, Global.tinymce.majorVersion);
@@ -53,12 +54,11 @@ describe('LoadTinyTest', () => {
       before(deleteTinymce);
 
       it(`Should be able to load TinyMCE ${version} from Cloud`, async () => {
-        const apiKey = 'fake-api-key';
-        const { editor } = await createFixture({ cloudChannel: version, apiKey });
+        const { editor } = await createFixture({ cloudChannel: version, apiKey: key });
         assertTinymceVersion(version, editor);
         Assertions.assertEq(
           'TinyMCE should have been loaded from Cloud',
-          `https://cdn.tiny.cloud/1/${apiKey}/tinymce/${version}`,
+          `https://cdn.tiny.cloud/1/${key}/tinymce/${version}`,
           Global.tinymce.baseURI.source
         );
       });

tinymce-angular-component/src/test/ts/browser/NgModelTest.ts

@@ -1,4 +1,4 @@
-/* eslint-disable max-classes-per-file */
+
 import '../alien/InitTestEnvironment';
 
 import { Component } from '@angular/core';

tinymce-angular-component/src/test/ts/browser/PropTest.ts

@@ -10,9 +10,9 @@ import { concatMap, distinct, firstValueFrom, mergeMap, of, toArray } from 'rxjs
 import { ComponentFixture } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
 import type { Editor } from 'tinymce';
-import { expect } from 'chai';
 import { Fun } from '@ephox/katamari';
-import { Waiter } from '@ephox/agar';
+import { Waiter, Assertions } from '@ephox/agar';
+import { TinyAssertions } from '@ephox/mcagar';
 
 describe('PropTest', () => {
   const containsIDWarning = (logs: unknown[][]) =>
@@ -57,9 +57,10 @@ describe('PropTest', () => {
           const fixture = createFixture();
           fixture.detectChanges();
           const [ ed ] = await waitForEditorsToLoad(fixture);
-          expect(ed.id).to.equal('my-id');
+          Assertions.assertEq('Editor\'s id must match', ed.id, 'my-id');
         });
-        expect(containsIDWarning(warnings), 'Should not contain an ID warning').to.be.false;
+
+        Assertions.assertEq('Should not contain an ID warning', containsIDWarning(warnings), false);
       });
     });
 
@@ -87,11 +88,11 @@ describe('PropTest', () => {
           ];
           fixture.detectChanges();
           const [ ed1, ed2 ] = await waitForEditorsToLoad(fixture);
-          expect(ed1.id).to.equal('my-id-0');
-          expect(ed1.getContent()).to.equal('<p>text1</p>');
-          expect(ed2).to.be.undefined;
+          Assertions.assertEq('Editor\'s id must match', 'my-id-0', ed1.id);
+          TinyAssertions.assertContent(ed1, '<p>text1</p>');
+          Assertions.assertEq('Editor 2 must be undefined', undefined, ed2);
         });
-        expect(containsIDWarning(warnings), 'Should contain an ID warning').to.be.true;
+        Assertions.assertEq( 'Should contain an ID warning', true, containsIDWarning(warnings));
       });
 
       it('INT-3299: creating more than one editor with different IDs does not log a warning', async () => {
@@ -104,16 +105,16 @@ describe('PropTest', () => {
           fixture.detectChanges();
           const [ ed1, ed2, ed3, ed4 ] = findAllComponents(fixture, EditorComponent);
           await Waiter.pTryUntil('All editors to have been initialised', () => {
-            expect(ed1.id).to.equal('my-id-0');
-            expect(ed1.editor?.getContent()).to.equal('<p>text0</p>');
-            expect(ed2.id).to.equal('my-id-1');
-            expect(ed2.editor?.getContent()).to.equal('<p>text1</p>');
-            expect(ed3.id).to.equal('my-id-2');
-            expect(ed3.editor?.getContent()).to.equal('<p>text2</p>');
-            expect(ed4?.editor).to.be.undefined;
+            Assertions.assertEq('Editor 1\'s id must match', ed1.id, 'my-id-0');
+            Assertions.assertEq('Content of editor 1', ed1.editor?.getContent(), '<p>text0</p>');
+            Assertions.assertEq('Editor 2\'s id must match', ed2.id, 'my-id-1');
+            Assertions.assertEq('Content of editor 2', ed2.editor?.getContent(), '<p>text1</p>');
+            Assertions.assertEq('Editor 3\'s id must match', ed3.id, 'my-id-2');
+            Assertions.assertEq('Content of editor 3', ed3.editor?.getContent(), '<p>text2</p>');
+            Assertions.assertEq('Editor 4 should not exist', ed4?.editor, undefined);
           }, 1000, 10000);
         });
-        expect(containsIDWarning(warnings), 'Should not contain an ID warning').to.be.false;
+        Assertions.assertEq( 'Should not contain an ID warning', containsIDWarning(warnings), false);
       });
     });
   });