test(tooltip): add tooltip tests

Author: zhosti

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

@@ -2,7 +2,7 @@ import { fakeAsync, TestBed, tick, flush, waitForAsync } from '@angular/core/tes
 import { By } from '@angular/platform-browser';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 import { IgxTooltipModule, IgxTooltipTargetDirective, IgxTooltipDirective } from './';
-import { IgxTooltipSingleTargetComponent, IgxTooltipMultipleTargetsComponent } from '../../test-utils/tooltip-components.spec';
+import { IgxTooltipSingleTargetComponent, IgxTooltipMultipleTargetsComponent, IgxTooltipPlainStringComponent } 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';
@@ -21,7 +21,8 @@ describe('IgxTooltip', () => {
         TestBed.configureTestingModule({
             declarations: [
                 IgxTooltipSingleTargetComponent,
-                IgxTooltipMultipleTargetsComponent
+                IgxTooltipMultipleTargetsComponent,
+                IgxTooltipPlainStringComponent
             ],
             imports: [NoopAnimationsModule, IgxTooltipModule]
         }).compileComponents();
@@ -79,6 +80,14 @@ describe('IgxTooltip', () => {
             verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false);
         }));
 
+        it('show target tooltip when hovering its target and ignore [tooltip] input', fakeAsync(() => {
+            hoverElement(button);
+            flush();
+
+            verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true);
+            expect(tooltipNativeElement.textContent.trim()).toEqual('Hello, I am a tooltip!');
+        }));
+
         it('verify tooltip default position', fakeAsync(() => {
             hoverElement(button);
             flush();
@@ -260,6 +269,33 @@ describe('IgxTooltip', () => {
             verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false);
         }));
 
+        describe('Plain string toopltip input', () => {
+            // configureTestSuite();
+            beforeEach(waitForAsync(() => {
+                fix = TestBed.createComponent(IgxTooltipPlainStringComponent);
+                fix.detectChanges();
+                button = fix.debugElement.query(By.directive(IgxTooltipTargetDirective));
+                tooltipTarget = fix.componentInstance.tooltipTarget;
+                tooltipNativeElement = fix.debugElement.query(By.directive(IgxTooltipDirective)).nativeElement;
+            }));
+
+            it('IgxTooltip is initially hidden', () => {
+                verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false);
+            });
+    
+            it('IgxTooltip is shown/hidden when hovering/unhovering its target', fakeAsync(() => {
+                hoverElement(button);
+                flush();
+    
+                verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true);
+    
+                unhoverElement(button);
+                flush();
+    
+                verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false);
+            }));
+        });
+
         describe('Tooltip events', () => {
         // configureTestSuite();
             it('should emit the proper events when hovering/unhovering target', fakeAsync(() => {

projects/igniteui-angular/src/lib/test-utils/tooltip-components.spec.ts

@@ -7,7 +7,7 @@ import {
 @Component({
     template: `
         <div class="dummyDiv">dummy div for touch tests</div>
-        <button [igxTooltipTarget]="tooltipRef"
+        <button [igxTooltipTarget]="tooltipRef" [tooltip]="'Infragistics Inc. HQ'"
                 (tooltipShow)="showing($event)" (tooltipHide)="hiding($event)"
                 style="margin: 200px">
             Hover me
@@ -56,3 +56,15 @@ export class IgxTooltipMultipleTargetsComponent {
     @ViewChild('targetTwo', { read: IgxTooltipTargetDirective, static: true }) public targetTwo: IgxTooltipTargetDirective;
     @ViewChild(IgxTooltipDirective, { static: true }) public tooltip: IgxTooltipDirective;
 }
+
+
+@Component({
+    template: `
+        <button igxTooltipTarget [tooltip]="'Infragistics Inc. HQ'">
+                info
+        </button>
+        `
+})
+export class IgxTooltipPlainStringComponent {
+    @ViewChild(IgxTooltipTargetDirective, { static: true }) public tooltipTarget: IgxTooltipTargetDirective;
+}