Merge branch '18.0.x' of https://github.com/IgniteUI/igniteui-angular into ganastasov/fix-14187-18.0.x

Author: georgianastasov

projects/igniteui-angular/migrations/update-18_0_0/index.spec.ts

@@ -19,7 +19,7 @@ describe(`Update to ${version}`, () => {
                         options: {
                             styles: [
                                 "/testSrc/styles.scss"
-                            ]
+                            ] as (string | object)[]
                         }
                     }
                 }
@@ -450,6 +450,36 @@ describe(`Update to ${version}`, () => {
         );
     });
 
+    it('should add default CSS rule to set all components to their previous Large defaults with complex file ref configs', async () => {
+        const _configJson = JSON.parse(appTree.readContent('/angular.json'));
+        _configJson.projects.testProj.architect.build.options.styles = [{ input: '/testSrc/styles.scss' }];
+        appTree.overwrite('/angular.json', JSON.stringify(_configJson));
+
+        const tree = await schematicRunner.runSchematic(migrationName, { shouldInvokeLS: false }, appTree);
+        expect(tree.readContent('/testSrc/styles.scss')).toEqual(
+`
+@use "mockStyles.scss";
+@forward something;
+// Specifies large size for all components to match the previous defaults
+// This may not be needed for your project. Please consult https://www.infragistics.com/products/ignite-ui-angular/angular/components/general/update-guide for more details.
+:root {
+    --ig-size: var(--ig-size-large);
+}
+`
+        );
+    });
+
+    it('should not throw when applying default CSS rule with complex file ref configs', async () => {
+        const _configJson = JSON.parse(appTree.readContent('/angular.json'));
+        _configJson.projects.testProj.architect.build.options.styles = [{ notInput: '/testSrc/styles.scss' }];
+        appTree.overwrite('/angular.json', JSON.stringify(_configJson));
+        try {
+            await schematicRunner.runSchematic(migrationName, { shouldInvokeLS: false }, appTree);
+        } catch (e) {
+            fail(e);
+        }
+    });
+
     it('should rename the $active-item-color property to the $icon-selected-color', async () => {
         appTree.create(
             `/testSrc/appPrefix/component/test.component.scss`,

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

@@ -1,5 +1,5 @@
 import { Rule, SchematicContext, SchematicsException, Tree } from "@angular-devkit/schematics";
-import { FileChange, findElementNodes, getAttribute, getSourceOffset, hasAttribute, parseFile } from '../common/util';
+import { FileChange, findElementNodes, getAttribute, getProjects, getSourceOffset, getWorkspace, hasAttribute, parseFile } from '../common/util';
 import { nativeImport } from 'igniteui-angular/migrations/common/import-helper.js';
 import type { Element } from '@angular/compiler';
 import { BoundPropertyObject, InputPropertyType, UpdateChanges } from "../common/UpdateChanges";
@@ -78,16 +78,26 @@ export default (): Rule => async (host: Tree, context: SchematicContext) => {
     });
 
     const updateMainCSSFile = (host: Tree, context: SchematicContext): Tree => {
-        const angularConfigBuffer = host.read('angular.json');
-        if (!angularConfigBuffer) {
+        const workspace = getWorkspace(host);
+        if (!workspace) {
             throw new SchematicsException('Could not find angular.json');
         }
-        const angularConfig = JSON.parse(angularConfigBuffer.toString('utf-8'));
 
-        for (const project of Object.values<any>(angularConfig.projects)) {
+        const projects = getProjects(workspace);
+        for (const project of projects) {
             const srcRoot = project.sourceRoot || project.root || '';
-            const stylesPath = (project.architect?.build?.options?.styles?.filter(s => s.startsWith(srcRoot))[0]) as string;
-           
+            const stylesPath = project.architect?.build?.options?.styles
+                ?.map((s) => {
+                    if (typeof s === 'string') {
+                        return s;
+                    }
+                    // ref - https://angular.dev/reference/configs/workspace-config#styles-and-scripts-configuration
+                    if (s instanceof Object && 'input' in s) {
+                        return s.input as string;
+                    }
+                })
+                .filter((s) => s?.startsWith(srcRoot))[0];
+
             if (!stylesPath) {
                 context.logger.error(`No styles file found in angular.json for project: ${project}`);
             }

projects/igniteui-angular/src/lib/directives/tooltip/tooltip-target.directive.ts

@@ -99,7 +99,7 @@ export class IgxTooltipTargetDirective extends IgxToggleActionDirective implemen
      */
     @Input('igxTooltipTarget')
     public override set target(target: any) {
-        if (target !== null && target !== '') {
+        if (target instanceof IgxTooltipDirective) {
             this._target = target;
         }
     }

projects/igniteui-angular/src/lib/directives/tooltip/tooltip.directive.spec.ts

@@ -1,7 +1,7 @@
 import { fakeAsync, TestBed, tick, flush, waitForAsync } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
-import { IgxTooltipSingleTargetComponent, IgxTooltipMultipleTargetsComponent, IgxTooltipPlainStringComponent } from '../../test-utils/tooltip-components.spec';
+import { IgxTooltipSingleTargetComponent, IgxTooltipMultipleTargetsComponent, IgxTooltipPlainStringComponent, IgxTooltipWithToggleActionComponent } from '../../test-utils/tooltip-components.spec';
 import { UIInteractions } from '../../test-utils/ui-interactions.spec';
 import { configureTestSuite } from '../../test-utils/configure-suite';
 import { HorizontalAlignment, VerticalAlignment, AutoPositionStrategy } from '../../services/public_api';
@@ -24,7 +24,8 @@ describe('IgxTooltip', () => {
                 NoopAnimationsModule,
                 IgxTooltipSingleTargetComponent,
                 IgxTooltipMultipleTargetsComponent,
-                IgxTooltipPlainStringComponent
+                IgxTooltipPlainStringComponent,
+                IgxTooltipWithToggleActionComponent
             ]
         }).compileComponents();
         UIInteractions.clearOverlay();
@@ -554,6 +555,36 @@ describe('IgxTooltip', () => {
             verifyTooltipPosition(tooltipNativeElement, buttonOne, false);
         }));
     });
+
+    describe('Tooltip integration', () => {
+        beforeEach(waitForAsync(() => {
+            fix = TestBed.createComponent(IgxTooltipWithToggleActionComponent);
+            fix.detectChanges();
+            tooltipNativeElement = fix.debugElement.query(By.directive(IgxTooltipDirective)).nativeElement;
+            tooltipTarget = fix.componentInstance.tooltipTarget as IgxTooltipTargetDirective;
+            button = fix.debugElement.query(By.directive(IgxTooltipTargetDirective));
+        }));
+
+        it('Correctly sets tooltip target when defined before igxToggleAction directive on same host - issue #14196', fakeAsync(() => {
+            expect(tooltipTarget.target.element).toBe(tooltipNativeElement);
+            expect(fix.componentInstance.toggleDir.collapsed).toBe(true);
+
+            hoverElement(button);
+            flush();
+
+            verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true);
+
+            UIInteractions.simulateClickEvent(button.nativeElement);
+            fix.detectChanges();
+
+            verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false);
+
+            UIInteractions.simulateClickEvent(button.nativeElement);
+            fix.detectChanges();
+
+            expect(fix.componentInstance.toggleDir.collapsed).toBe(false);
+        }));
+    });
 });
 
 const hoverElement = (element) => element.nativeElement.dispatchEvent(new MouseEvent('mouseenter'));

projects/igniteui-angular/src/lib/grids/common/events.ts

@@ -10,11 +10,11 @@ import { IBaseSearchInfo } from '../../directives/text-highlight/text-highlight.
 
 /** The event arguments when data from a grid is being copied. */
 export interface IGridClipboardEvent {
-    /** `data` can be of any type and referes to the data that is being copied/stored to the clipboard */
+    /** `data` can be of any type and refers to the data that is being copied/stored to the clipboard */
     data: any[];
     /**
-     * `cancel` returns whether an external event has interepted the copying
-     * If the value becomes "true", it returns/exits from the method, instanciating the interface
+     * `cancel` returns whether an external event has intercepted the copying
+     * If the value becomes "true", it returns/exits from the method, instantiating the interface
      */
     cancel: boolean;
 }
@@ -67,7 +67,7 @@ export interface IGridEditDoneEventArgs extends IBaseEventArgs {
     rowData: any;
     /**
      * Represents the previous (before editing) value of the edited cell.
-     * It's used when the event has been stoped/exited.
+     * It's used when the event has been stopped/exited.
      */
     oldValue: any;
     /**
@@ -93,7 +93,7 @@ export interface IGridEditDoneEventArgs extends IBaseEventArgs {
     owner?: GridType;
     /**
      * Optional
-     * Indicates if the editing cosists of adding a new row
+     * Indicates if the editing consists of adding a new row
      */
     isAddRow?: boolean;
     /**
@@ -151,7 +151,7 @@ export interface IPinColumnEventArgs extends IBaseEventArgs {
     insertAtIndex: number;
     /**
      * Returns the actual pin state of the column.
-     * If pinning/unpinning is succesfull, value of `isPinned` will change accordingly when read in the "-ing" and "-ed" event.
+     * If pinning/unpinning is successful, value of `isPinned` will change accordingly when read in the "-ing" and "-ed" event.
      */
     isPinned: boolean;
 }
@@ -160,7 +160,7 @@ export interface IPinColumnEventArgs extends IBaseEventArgs {
  * The event arguments before a column's pin state is changed.
  * `insertAtIndex`specifies at which index in the pinned/unpinned area the column is inserted.
  * Can be changed in the `columnPin` event.
- * `isPinned` returns the actual pin state of the column. When pinning/unpinning is succesfull,
+ * `isPinned` returns the actual pin state of the column. When pinning/unpinning is successful,
  * the value of `isPinned` will change accordingly when read in the "-ing" and "-ed" event.
  */
 export interface IPinColumnCancellableEventArgs extends IPinColumnEventArgs, CancelableEventArgs {
@@ -190,7 +190,7 @@ export interface IRowDataEventArgs extends IBaseEventArgs {
 
 /** The event arguments when a column is being resized */
 export interface IColumnResizeEventArgs extends IBaseEventArgs {
-    /** Represents the informantion of the column that is being resized */
+    /** Represents the information of the column that is being resized */
     column: ColumnType;
     /** Represents the old width of the column before the resizing */
     prevWidth: string;
@@ -236,7 +236,7 @@ export interface IRowSelectionEventArgs extends CancelableEventArgs, IBaseEventA
 }
 
 /**
- * The event arguments when the selection state of a column is being chaged
+ * The event arguments when the selection state of a column is being changed
  * The event is cancelable
  */
 export interface IColumnSelectionEventArgs extends CancelableEventArgs, IBaseEventArgs {
@@ -288,8 +288,8 @@ export interface IGridToolbarExportEventArgs extends IBaseEventArgs {
      */
     options: IgxExporterOptionsBase;
     /**
-     * `cancel` returns whether the event has been interepted and stopped
-     * If the value becomes "true", it returns/exits from the method, instanciating the interface
+     * `cancel` returns whether the event has been intercepted and stopped
+     * If the value becomes "true", it returns/exits from the method, instantiating the interface
      */
     cancel: boolean;
 }
@@ -298,7 +298,7 @@ export interface IGridToolbarExportEventArgs extends IBaseEventArgs {
 export interface IColumnMovingStartEventArgs extends IBaseEventArgs {
     /**
      * Represents the column that is being moved.
-     * The `ColumnType` contains the informatoin (the grid it belongs to, css data, settings, etc.) of the column in its properties
+     * The `ColumnType` contains the information (the grid it belongs to, css data, settings, etc.) of the column in its properties
      */
     source: ColumnType;
 }
@@ -307,12 +307,12 @@ export interface IColumnMovingStartEventArgs extends IBaseEventArgs {
 export interface IColumnMovingEventArgs extends IBaseEventArgs {
     /**
      * Represents the column that is being moved.
-     * The `ColumnType` contains the informatoin (the grid it belongs to, css data, settings, etc.) of the column in its properties
+     * The `ColumnType` contains the information (the grid it belongs to, css data, settings, etc.) of the column in its properties
      */
     source: ColumnType;
     /**
-     * `cancel` returns whether the event has been interepted and stopped
-     * If the value becomes "true", it returns/exits from the method, instanciating the interface
+     * `cancel` returns whether the event has been intercepted and stopped
+     * If the value becomes "true", it returns/exits from the method, instantiating the interface
      */
     cancel: boolean;
 }
@@ -321,17 +321,17 @@ export interface IColumnMovingEventArgs extends IBaseEventArgs {
 export interface IColumnMovingEndEventArgs extends IBaseEventArgs {
     /**
      * The source of the event represents the column that is being moved.
-     * The `ColumnType` contains the informatoin (the grid it belongs to, css data, settings, etc.) of the column in its properties
+     * The `ColumnType` contains the information (the grid it belongs to, css data, settings, etc.) of the column in its properties
      */
     source: ColumnType;
     /**
      * The target of the event represents the column, the source is being moved to.
-     * The `ColumnType` contains the informatoin (the grid it belongs to, css data, settings, etc.) of the column in its properties
+     * The `ColumnType` contains the information (the grid it belongs to, css data, settings, etc.) of the column in its properties
      */
     target: ColumnType;
     /**
-     * `cancel` returns whether the event has been interepted and stopped
-     * If the value becomes "true", it returns/exits from the method, instanciating the interface
+     * `cancel` returns whether the event has been intercepted and stopped
+     * If the value becomes "true", it returns/exits from the method, instantiating the interface
      */
     cancel: boolean;
 }
@@ -345,12 +345,12 @@ export interface IGridKeydownEventArgs extends IBaseEventArgs {
     targetType: GridKeydownTargetType;
     /** Represents the information and details of the object itself */
     target: any;
-    /** Represents the original event, that occured. */
+    /** Represents the original event, that occurred. */
     event: Event;
     /**
      * The event is cancelable
-     * `cancel` returns whether the event has been interepted and stopped
-     * If the value becomes "true", it returns/exits from the method, instanciating the interface
+     * `cancel` returns whether the event has been intercepted and stopped
+     * If the value becomes "true", it returns/exits from the method, instantiating the interface
      */
     cancel: boolean;
 }
@@ -360,7 +360,7 @@ export interface ICellPosition {
     /** It returns the position (index) of the row, the cell is in */
     rowIndex: number;
     /**
-     * It returns the position (index) of the colunm, the cell is in
+     * It returns the position (index) of the column, the cell is in
      * Counts only the visible (non hidden) columns
      */
     visibleColumnIndex: number;
@@ -391,7 +391,7 @@ export interface IRowDragStartEventArgs extends CancelableEventArgs, IBaseEventA
     dragElement: HTMLElement;
 }
 
-/** Рepresents event arguments related to the row's expansion state being changed in a grid */
+/** Represents event arguments related to the row's expansion state being changed in a grid */
 export interface IRowToggleEventArgs extends IBaseEventArgs {
     /**
      * Represents the ID of the row that emitted the event (which state is changed)
@@ -406,13 +406,13 @@ export interface IRowToggleEventArgs extends IBaseEventArgs {
     expanded: boolean;
     /**
      * Optional
-     * Represents the original event, that has triggered the expantion/collapse
+     * Represents the original event, that has triggered the expansion/collapse
      */
     event?: Event;
     /**
      * The event is cancelable
-     * `cancel` returns whether the event has been interepted and stopped
-     * If the value becomes "true", it returns/exits from the method, instanciating the interface
+     * `cancel` returns whether the event has been intercepted and stopped
+     * If the value becomes "true", it returns/exits from the method, instantiating the interface
      */
     cancel: boolean;
 }
@@ -459,7 +459,7 @@ export interface IColumnToggledEventArgs extends IBaseEventArgs {
     checked: boolean;
 }
 
-/** Emmited when the active node is changed */
+/** Emitted when the active node is changed */
 export interface IActiveNodeChangeEventArgs extends IBaseEventArgs {
     /** Represents the row index of the active node */
     row: number;
@@ -491,7 +491,7 @@ export interface ISortingEventArgs extends IBaseEventArgs, CancelableEventArgs {
     sortingExpressions?: ISortingExpression | Array<ISortingExpression>;
     /**
      * Optional
-     * Represents the gouping expressions applied to the grid.
+     * Represents the grouping expressions applied to the grid.
      * It can be a single grouping expression or an array of them
      * The expression contains information like the sorting expression and criteria by which the elements will be grouped
      */
@@ -515,7 +515,7 @@ export interface IColumnVisibilityChangedEventArgs extends IBaseEventArgs {
     /** Represents the column the event originated from */
     column: any;
     /**
-     * The new hidden state that the column will have, if operation is succesfull.
+     * The new hidden state that the column will have, if operation is successful.
      * Will be `true` when hiding and `false` when showing.
      */
     newValue: boolean;