added tests

src/api/menu/MenuAPISpec.js

@@ -22,32 +22,49 @@
 
 import MenuAPI from './MenuAPI';
 import Menu from './menu';
-import { createOpenMct, resetApplicationState } from '../../utils/testing';
+import { createOpenMct, createMouseEvent, resetApplicationState } from '../../utils/testing';
 
 describe ('The Menu API', () => {
     let openmct;
+    let element;
     let menuAPI;
     let actionsArray;
     let x;
     let y;
     let result;
     let onDestroy;
 
-    beforeEach(() => {
+    beforeEach((done) => {
+        const appHolder = document.createElement('div');
+        appHolder.style.display = 'block';
+        appHolder.style.width = '1920px';
+        appHolder.style.height = '1080px';
+
         openmct = createOpenMct();
+
+        element = document.createElement('div');
+        element.style.display = 'block';
+        element.style.width = '1920px';
+        element.style.height = '1080px';
+
+        openmct.on('start', done);
+        openmct.startHeadless(appHolder);
+
         menuAPI = new MenuAPI(openmct);
         actionsArray = [
             {
+                key: 'test-css-class-1',
                 name: 'Test Action 1',
-                cssClass: 'test-css-class-1',
+                cssClass: 'icon-clock',
                 description: 'This is a test action',
                 callBack: () => {
                     result = 'Test Action 1 Invoked';
                 }
             },
             {
+                key: 'test-css-class-2',
                 name: 'Test Action 2',
-                cssClass: 'test-css-class-2',
+                cssClass: 'icon-clock',
                 description: 'This is a test action',
                 callBack: () => {
                     result = 'Test Action 2 Invoked';
@@ -135,4 +152,62 @@ describe ('The Menu API', () => {
             });
         });
     });
+
+    describe("superMenu method", () => {
+        it("creates a superMenu", () => {
+            menuAPI.showSuperMenu(x, y, actionsArray);
+
+            const superMenu = document.querySelector('.c-super-menu__menu');
+
+            expect(superMenu).not.toBeNull();
+        });
+
+        it("Mouse over a superMenu shows correct description", (done) => {
+            menuAPI.showSuperMenu(x, y, actionsArray);
+
+            const superMenu = document.querySelector('.c-super-menu__menu');
+            const superMenuItem = superMenu.querySelector('li');
+            const mouseOverEvent = createMouseEvent('mouseover');
+
+            superMenuItem.dispatchEvent(mouseOverEvent);
+            const itemDescription = document.querySelector('.l-item-description__description');
+
+            setTimeout(() => {
+                expect(itemDescription.innerText).toEqual(actionsArray[0].description);
+                expect(superMenu).not.toBeNull();
+                done();
+            }, 300);
+        });
+    });
+
+    describe("Menu Placements", () => {
+        it("default menu position BOTTOM_RIGHT", () => {
+            menuAPI.showMenu(x, y, actionsArray);
+
+            const menu = document.querySelector('.c-menu');
+
+            const boundingClientRect = menu.getBoundingClientRect();
+            const left = boundingClientRect.left;
+            const top = boundingClientRect.top;
+
+            expect(left).toEqual(x);
+            expect(top).toEqual(y);
+        });
+
+        it("menu position BOTTOM_RIGHT", () => {
+            const menuOptions = {
+                placement: openmct.menus.menuPlacement.BOTTOM_RIGHT
+            };
+
+            menuAPI.showMenu(x, y, actionsArray, menuOptions);
+
+            const menu = document.querySelector('.c-menu');
+            const boundingClientRect = menu.getBoundingClientRect();
+            const left = boundingClientRect.left;
+            const top = boundingClientRect.top;
+
+            expect(left).toEqual(x);
+            expect(top).toEqual(y);
+        });
+    });
 });