chore(editors, banner, nav-drawer): fix eslint warnings (#9860)

Author: Lipata

CHANGELOG.md

@@ -121,13 +121,19 @@ All notable changes for each version of this project will be documented in this
     - `onAppended` -> `contentAppended`
     - `onAnimation` -> `animationStarting`
 
+- `IgxMaskDirective`
+    - **Breaking Change** - Deprecated property `placeholder` is now removed;
+    - **Breaking Change** - `IgxMaskDirective` events are renamed as follows:
+        - `onValueChange` -> `valueChanged`
+
 - **Breaking Change** - `IgxBannerComponent` events are renamed as follows:
     - `onOpening` -> `opening`
     - `onOpened` -> `opened`
     - `onClosing` -> `closing`
     - `onClosed` -> `closed`
 
 - `IgxExpansionPanelComponent`
+    - **Breaking Change** - `IExpansionPanelEventArgs.panel` - Deprecated event property `panel` is removed. Usе `owner` property to get a reference to the panel.
     - **Breaking Change** - `IgxExpansionPanelComponent` events are renamed as follows:
         - `onCollapsed` -> `contentCollapsed`
         - `onExpanded` -> `contentExpanded`
@@ -144,6 +150,8 @@ All notable changes for each version of this project will be documented in this
             ...
         </igx-expansion-panel>
     ```
+- `IgxBanner`
+    - `BannerEventArgs.banner` - Deprecated. Usе `owner` property to get a reference to the banner.
 
 -   `IgxDropDown`
     - **Breaking Change** - The dropdown items no longer takes focus unless `allowItemsFocus` is set to `true`.

projects/igniteui-angular/migrations/common/ServerHost.ts

@@ -144,7 +144,7 @@ export class ServerHost implements ts.server.ServerHost {
 
     //#region Not implemented methods
 
-    public write(data: string): void {
+    public write(_data: string): void {
         throw new Error('Method "write" not implemented.');
         // ts.sys.write(data);
     }
@@ -154,27 +154,27 @@ export class ServerHost implements ts.server.ServerHost {
         // return ts.sys.writeOutputIsTTY();
     }
 
-    public writeFile(path: string, data: string, writeByteOrderMark?: boolean): void {
+    public writeFile(_path: string, _data: string, _writeByteOrderMark?: boolean): void {
         throw new Error('Method "writeFile" not implemented.');
         // return ts.sys.writeFile(path, data, writeByteOrderMark);
     }
 
-    public createDirectory(path: string): void {
+    public createDirectory(_path: string): void {
         throw new Error('Method "createDirectory" not implemented.');
         // return ts.sys.createDirectory(path);
     }
 
-    public setModifiedTime(path: string, time: Date): void {
+    public setModifiedTime(_path: string, _time: Date): void {
         throw new Error('Method "setModifiedTime" not implemented.');
         // return ts.sys.setModifiedTime(path, time);
     }
 
-    public deleteFile(path: string): void {
+    public deleteFile(_path: string): void {
         throw new Error('Method "deleteFile" not implemented.');
         // return ts.sys.deleteFile(path);
     }
 
-    public createHash(data: string): string {
+    public createHash(_data: string): string {
         throw new Error('Method "createHash" not implemented.');
         // return ts.sys.createHash(data);
     }
@@ -184,17 +184,17 @@ export class ServerHost implements ts.server.ServerHost {
         // return ts.sys.getMemoryUsage();
     }
 
-    public exit(exitCode?: number): void {
+    public exit(_exitCode?: number): void {
         throw new Error('Method "exit" not implemented.');
         // return ts.sys.exit(exitCode);
     }
 
-    public setTimeout(callback: (...argsv: any[]) => void, ms: number, ...args: any[]): any {
+    public setTimeout(_callback: (...argsv: any[]) => void, _ms: number, ..._args: any[]): any {
         throw new Error('Method "setTimeout" not implemented.');
         // return ts.sys.setTimeout(callback, ms, ...args);
     }
 
-    public clearTimeout(timeoutId: any): void {
+    public clearTimeout(_timeoutId: any): void {
         throw new Error('Method "clearTimeout" not implemented.');
         // return ts.sys.clearTimeout(timeoutId);
     }
@@ -204,22 +204,22 @@ export class ServerHost implements ts.server.ServerHost {
         // return ts.sys.clearScreen();
     }
 
-    public base64decode(input: string): string {
+    public base64decode(_input: string): string {
         throw new Error('Method "base64decode" not implemented.');
         // return ts.sys.base64decode(input);
     }
 
-    public base64encode(input: string): string {
+    public base64encode(_input: string): string {
         throw new Error('Method "base64encode" not implemented.');
         // return ts.sys.base64encode(input);
     }
 
-    public setImmediate(callback: (...argsv: any[]) => void, ...args: any[]): any {
+    public setImmediate(_callback: (...argsv: any[]) => void, ..._args: any[]): any {
         throw new Error('Method "setImmediate" not implemented.');
         // return setImmediate(callback, ...args);
     }
 
-    public clearImmediate(timeoutId: any): void {
+    public clearImmediate(_timeoutId: any): void {
         throw new Error('Method "clearImmediate" not implemented.');
         // return clearImmediate(timeoutId);
     }

projects/igniteui-angular/migrations/common/UpdateChanges.spec.ts

@@ -897,16 +897,6 @@ export class AppModule { }`);
 
         it('Should be able to replace property of an event', () => {
             pending('set up tests for migrations through lang service');
-            const membersConfig = {
-                member: 'onGridKeydown',
-                replaceWith: 'gridKeydown',
-                definedIn: [
-                    'IgxGridComponent',
-                    'IgxTreeGridComponent',
-                    'IgxHierarchicalGridComponent',
-                    'IgxRowIslandComponent'
-                ]
-            };
             const fileContent =
 `import { Component } from '@angular/core';
 import { IGridCreatedEventArgs } from 'igniteui-angular';

projects/igniteui-angular/migrations/common/UpdateChanges.ts

@@ -296,7 +296,6 @@ export class UpdateChanges {
 
             let base: string;
             let replace: string;
-            let groups = 1;
             let searchPattern;
 
             if (type === BindingType.Output) {
@@ -306,7 +305,6 @@ export class UpdateChanges {
                 // Match both bound - [name] - and regular - name
                 base = String.raw`(\s\[?)${change.name}(\s*\]?=)(["'])(.*?)\3`;
                 replace = String.raw`$1${change.replaceWith}$2$3$4$3`;
-                groups = 3;
             }
 
             let reg = new RegExp(base, 'g');

projects/igniteui-angular/migrations/common/tsPlugin/index.ts

@@ -1,7 +1,7 @@
 import { TSLanguageService } from './TSLanguageService';
 
 const init = (modules: { typescript: typeof import('typescript/lib/tsserverlibrary') }) => {
-    const ts = modules.typescript;
+    const _ts = modules.typescript;
     let tsLanguageService = null;
 
     /**

projects/igniteui-angular/migrations/update-12_0_0/index.ts

@@ -57,7 +57,7 @@ See https://www.infragistics.com/products/ignite-ui-angular/angular/components/t
     const changes = new Map<string, FileChange[]>();
     const htmlFiles = update.templateFiles;
     const sassFiles = update.sassFiles;
-    const tsFiles = update.tsFiles;
+    const _tsFiles = update.tsFiles;
     let applyComment = false;
 
     const applyChanges = () => {
@@ -127,7 +127,7 @@ See https://www.infragistics.com/products/ignite-ui-angular/angular/components/t
             findElementNodes(parseFile(host, path), comp.tags).
                 map(node => getSourceOffset(node as Element)).
                 forEach(offset => {
-                    const { startTag, endTag, file, node } = offset;
+                    const { startTag, file, node } = offset;
                     // Label content
                     let labelText = '';
                     if (hasAttribute(node, 'label')) {

projects/igniteui-angular/migrations/update-12_1_0/changes/members.json

@@ -82,12 +82,20 @@
             "definedIn": [
                 "IgxExpansionPanelComponent"
             ]
-        },{
+        },
+        {
             "member": "onInteraction",
             "replaceWith": "interaction",
             "definedIn": [
                 "IgxExpansionPanelHeaderComponent"
             ]
+        },
+        {
+            "member": "onValueChange",
+            "replaceWith": "valueChanged",
+            "definedIn": [
+                "IgxMaskDirective"
+            ]
         }
     ]
-}
+}

projects/igniteui-angular/migrations/update-12_1_0/changes/outputs.json

@@ -56,6 +56,14 @@
                 "selector": "igx-banner",
                 "type": "component"
             }
+        },
+        {
+            "name": "onValueChange",
+            "replaceWith": "valueChanged",
+            "owner": {
+                "selector": "[igxMask]",
+                "type": "directive"
+            }
         }
     ]
-}
+}

projects/igniteui-angular/migrations/update-12_1_0/index.spec.ts

@@ -24,8 +24,6 @@ describe(`Update to ${version}`, () => {
 
     const migrationName = 'migration-21';
     const lineBreaksAndSpaceRegex = /\s/g;
-    // eslint-disable-next-line max-len
-    const noteText = `<!--NOTE: This component has been updated by Infragistics migration: v${version}\nPlease check your template whether all bindings/event handlers are correct.-->`;
 
     beforeEach(() => {
         appTree = new UnitTestTree(new EmptyTree());
@@ -176,6 +174,50 @@ export class TestComponent implements OnInit {
 }`);
     });
 
+    it('should update mask event subscriptions in .html file', async () => {
+        appTree.create(
+            '/testSrc/appPrefix/component/test.component.html', `
+<input igxInput type="text" [igxMask]="'(####) 00-00-00 Ext. 9999'" (onValueChange)="handleEvent()" />`);
+        const tree = await schematicRunner.runSchematicAsync(migrationName, {}, appTree)
+            .toPromise();
+
+        expect(tree.readContent('/testSrc/appPrefix/component/test.component.html'))
+            .toEqual(`
+<input igxInput type="text" [igxMask]="'(####) 00-00-00 Ext. 9999'" (valueChanged)="handleEvent()" />`);
+    });
+
+    it('should update mask event subscriptions .ts file', async () => {
+        pending('ts language service tests do not pass');
+        appTree.create(
+            '/testSrc/appPrefix/component/test.component.ts', `
+import { Component, OnInit } from '@angular/core';
+import { IgxMaskDirective } from 'igniteui-angular';
+export class TestComponent implements OnInit {
+    @ViewChild(IgxMaskDirective)
+    public mask: IgxMaskDirective
+
+    public ngOnInit() {
+        this.mask.onValueChange.subscribe();
+    }
+}`);
+        const tree = await schematicRunner.runSchematicAsync(migrationName, {}, appTree)
+            .toPromise();
+
+        expect(tree.readContent('/testSrc/appPrefix/component/test.component.ts'))
+            .toEqual(`
+import { Component, OnInit } from '@angular/core';
+import { IgxMaskDirective } from 'igniteui-angular';
+export class TestComponent implements OnInit {
+    @ViewChild(IgxMaskDirective)
+    public mask: IgxMaskDirective
+
+    public ngOnInit() {
+        this.mask.valueChanged;
+    }
+}`);
+    });
+
+
     it('should update expansion panel event subscriptions in .html file', async () => {
         appTree.create(
             '/testSrc/appPrefix/component/test.component.html', `
@@ -196,6 +238,52 @@ export class TestComponent implements OnInit {
 </igx-expansion-panel>`);
     });
 
+it('Should remove references to deprecated `banner` property of `BannerEventArgs`', async () => {
+    pending('set up tests for migrations through lang service');
+    appTree.create(
+        '/testSrc/appPrefix/component/expansion-test.component.ts',
+        `import { Component, ViewChild } from '@angular/core';
+import { IgxBanner } from 'igniteui-angular';
+
+@Component({
+selector: 'app-banner-test',
+templateUrl: './banner-test.component.html',
+styleUrls: ['./banner-test.component.scss']
+})
+export class BannerTestComponent {
+
+@ViewChild(IgxBannerComponent, { static: true })
+public panel: IgxBannerComponent;
+
+public onBannerOpened(event: BannerEventArgs) {
+    console.log(event.banner);
+}
+}`
+    );
+    const tree = await schematicRunner
+        .runSchematicAsync('migration-17', {}, appTree)
+        .toPromise();
+    const expectedContent =  `import { Component, ViewChild } from '@angular/core';
+import { IgxBanner } from 'igniteui-angular';
+
+@Component({
+selector: 'app-banner-test',
+templateUrl: './banner-test.component.html',
+styleUrls: ['./banner-test.component.scss']
+})
+export class BannerTestComponent {
+
+@ViewChild(IgxBannerComponent, { static: true })
+public panel: IgxBannerComponent;
+
+public onBannerOpened(event: BannerEventArgs) {
+    console.log(event.owner);
+}
+}`;
+    expect(
+            tree.readContent('/testSrc/appPrefix/component/expansion-test.component.ts')
+        ).toEqual(expectedContent);
+});
     it('should remove paging property and define a igx-paginator component instead', async () => {
         appTree.create(
             '/testSrc/appPrefix/component/test.component.html', `

projects/igniteui-angular/migrations/update-9_0_1/index.spec.ts

@@ -5,7 +5,7 @@ import { SchematicTestRunner, UnitTestTree } from '@angular-devkit/schematics/te
 
 describe('Update 9.0.1', () => {
     let appTree: UnitTestTree;
-    const schematicRunner = new SchematicTestRunner('ig-migrate', path.join(__dirname, '../migration-collection.json'));
+    const _schematicRunner = new SchematicTestRunner('ig-migrate', path.join(__dirname, '../migration-collection.json'));
     const configJson = {
         defaultProject: 'testProj',
         projects: {