diff --git a/packages/mosaic-dev/popover/template.html b/packages/mosaic-dev/popover/template.html
index 23afa2136..fa2de398c 100644
--- a/packages/mosaic-dev/popover/template.html
+++ b/packages/mosaic-dev/popover/template.html
@@ -130,6 +130,7 @@
(click)="changePopoverVisibilityRightBottom()">
rightBottom
+
diff --git a/packages/mosaic/popover/popover.spec.ts b/packages/mosaic/popover/popover.spec.ts
index 92edaf850..7facecfbb 100644
--- a/packages/mosaic/popover/popover.spec.ts
+++ b/packages/mosaic/popover/popover.spec.ts
@@ -3,7 +3,7 @@ import { fakeAsync, inject, tick, TestBed, flush } from '@angular/core/testing';
import { By } from '@angular/platform-browser';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { OverlayContainer } from '@ptsecurity/cdk/overlay';
-import { dispatchMouseEvent } from '@ptsecurity/cdk/testing';
+import { dispatchMouseEvent, dispatchFakeEvent } from '@ptsecurity/cdk/testing';
import { McPopoverModule } from './popover.module';
@@ -46,6 +46,7 @@ describe('McPopover', () => {
it('mcPopoverTrigger = hover', fakeAsync(() => {
const expectedValue = '_TEST1';
const triggerElement = component.test1.nativeElement;
+ console.log(overlayContainerElement.textContent, 123123);
expect(overlayContainerElement.textContent).not.toEqual(expectedValue);
@@ -55,9 +56,15 @@ describe('McPopover', () => {
expect(overlayContainerElement.textContent).toEqual(expectedValue);
dispatchMouseEvent(triggerElement, 'mouseleave');
- tick();
componentFixture.detectChanges();
- console.log(overlayContainerElement.textContent);
+ dispatchMouseEvent(overlayContainerElement, 'mouseenter');
+ componentFixture.detectChanges();
+ expect(overlayContainerElement.textContent).toContain(expectedValue);
+ // Move out from the tooltip element to hide it
+ dispatchMouseEvent(overlayContainerElement, 'mouseleave');
+ tick(100); // tslint:disable-line
+ componentFixture.detectChanges();
+ tick(); // wait for next tick to hide
expect(overlayContainerElement.textContent).not.toEqual(expectedValue);
}));
@@ -81,21 +88,18 @@ describe('McPopover', () => {
}));
it('mcPopoverTrigger = focus', fakeAsync(() => {
- const expectedValue = '_TEST3';
+ const featureKey = '_TEST3';
const triggerElement = component.test3.nativeElement;
-
- expect(overlayContainerElement.textContent).not.toEqual(expectedValue);
-
- dispatchMouseEvent(triggerElement, 'focus');
- tick();
+ dispatchFakeEvent(triggerElement, 'focus');
componentFixture.detectChanges();
- expect(overlayContainerElement.textContent).toEqual(expectedValue);
-
- dispatchMouseEvent(triggerElement, 'blur');
- tick();
+ expect(overlayContainerElement.textContent).toContain(featureKey);
+ dispatchFakeEvent(triggerElement, 'blur');
+ tick(100); // tslint:disable-line
componentFixture.detectChanges();
- console.log(overlayContainerElement.textContent);
- expect(overlayContainerElement.textContent).not.toEqual(expectedValue);
+ tick(); // wait for next tick to hide
+ componentFixture.detectChanges();
+ tick(); // wait for next tick to hide
+ expect(overlayContainerElement.textContent).not.toContain(featureKey);
}));
it('Can set mcPopoverHeader', fakeAsync(() => {
@@ -159,15 +163,15 @@ describe('McPopover', () => {
@Component({
selector: 'mc-popover-test-component',
template: `
-
-
-
+
+
+
-
-
-
+
+
+
-
+
`
})
class McPopoverTestComponent {