Source/WebInspectorUI/UserInterface/Views/SoftContextMenu.js - WebKit - Git at Google

 /*
  * Copyright (C) 2011 Google Inc. All Rights Reserved.
  * Copyright (C) 2017 Sony Interactive Entertainment Inc.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  * 1. Redistributions of source code must retain the above copyright
  *    notice, this list of conditions and the following disclaimer.
  * 2. Redistributions in binary form must reproduce the above copyright
  *    notice, this list of conditions and the following disclaimer in the
  *    documentation and/or other materials provided with the distribution.
  *
  * THIS SOFTWARE IS PROVIDED BY APPLE INC. ``AS IS'' AND ANY
  * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
  * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
  * PURPOSE ARE DISCLAIMED.  IN NO EVENT SHALL APPLE INC. OR
  * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
  * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
  * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
  * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
  * OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
  * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
  * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  */

 WI.SoftContextMenu = class SoftContextMenu
 {
     constructor(items, parentMenu)
     {
         this._items = items;
         this._parentMenu = parentMenu;
     }

     // Public

     show(event)
     {
         const isSubMenu = !!this._parentMenu;

         this._contextMenuElement = document.createElement("div");
         this._contextMenuElement.className = "soft-context-menu";
         this._contextMenuElement.style.left = event.pageX + "px";
         this._contextMenuElement.style.top = event.pageY + "px";
         this._contextMenuElement.tabIndex = 0;
         this._contextMenuElement.addEventListener("keydown", this._menuKeyDown.bind(this), false);
         for (let item of this._items)
             this._contextMenuElement.appendChild(this._createMenuItem(item));

         // Install glass pane capturing events.
         if (!isSubMenu) {
             this._glassPaneElement = document.createElement("div");
             this._glassPaneElement.className = "soft-context-menu-glass-pane";
             this._glassPaneElement.addEventListener("mousedown", this._glassPaneMouseDown.bind(this), false);
             this._glassPaneElement.appendChild(this._contextMenuElement);
             document.body.appendChild(this._glassPaneElement);
             this._focus();
             this._consumeEvent(event, true);
         } else
             this._parentGlassPaneElement().appendChild(this._contextMenuElement);

         this._repositionMenuOnScreen(isSubMenu);
     }

     // Private

     _consumeEvent(event, preventDefault)
     {
         event.stopImmediatePropagation();

         if (preventDefault)
             event.preventDefault();

         event.handled = true;
     }

     _parentGlassPaneElement()
     {
         if (!this._parentMenu)
             return null;

         if (this._parentMenu._glassPaneElement)
             return this._parentMenu._glassPaneElement;

         return this._parentMenu._parentGlassPaneElement();
     }

     _createMenuItem(item)
     {
         if (item.type === "separator")
             return this._createSeparator();

         const checkmark = "\u2713";
         const blackRightPointingTriangle = "\u25b6";

         const menuItemElement = document.createElement("div");
         menuItemElement.className = "item";
         if (!item.enabled)
             menuItemElement.classList.add("disabled");

         const checkMarkElement = document.createElement("span");
         checkMarkElement.textContent = item.checked ? checkmark : "";
         checkMarkElement.className = "checkmark";
         menuItemElement.appendChild(checkMarkElement);

         const labelElement = document.createElement("span");
         labelElement.textContent = item.label;
         labelElement.className = "label";
         menuItemElement.appendChild(labelElement);

         if (item.type === "subMenu") {
             const subMenuArrowElement = document.createElement("span");
             subMenuArrowElement.textContent = blackRightPointingTriangle;
             subMenuArrowElement.className = "submenu-arrow";
             menuItemElement.appendChild(subMenuArrowElement);

             menuItemElement._subItems = item.subItems;
         } else
             menuItemElement._actionId = item.id;

         menuItemElement.addEventListener("contextmenu", this._menuItemContextMenu.bind(this), false);
         menuItemElement.addEventListener("mousedown", this._menuItemMouseDown.bind(this), false);
         menuItemElement.addEventListener("mouseup", this._menuItemMouseUp.bind(this), false);
         menuItemElement.addEventListener("mouseover", this._menuItemMouseOver.bind(this), false);
         menuItemElement.addEventListener("mouseout", this._menuItemMouseOut.bind(this), false);

         return menuItemElement;
     }

     _createSeparator()
     {
         const separatorElement = document.createElement("div");
         separatorElement.className = "separator";
         separatorElement._isSeparator = true;
         separatorElement.createChild("div", "line");

         separatorElement.addEventListener("contextmenu", this._menuItemContextMenu.bind(this), false);
         separatorElement.addEventListener("mousedown", this._menuItemMouseDown.bind(this), false);
         separatorElement.addEventListener("mouseup", this._menuItemMouseUp.bind(this), false);
         separatorElement.addEventListener("mouseover", this._menuItemMouseOver.bind(this), false);

         return separatorElement;
     }

     _repositionMenuOnScreen(isSubMenu)
     {
         if (this._contextMenuElement.offsetLeft + this._contextMenuElement.offsetWidth > document.body.offsetWidth) {
             if (isSubMenu) {
                 const parentContextMenuElement = this._parentMenu._contextMenuElement;
                 const leftOfParent = parentContextMenuElement.offsetLeft - this._contextMenuElement.offsetWidth + 2;
                 const fromParentRight = this._contextMenuElement.offsetLeft - this._contextMenuElement.offsetWidth + 2;
                 this._contextMenuElement.style.left = (leftOfParent >= 0 ? leftOfParent : fromParentRight) + "px";
             } else {
                 const leftOfCursor = this._contextMenuElement.offsetLeft - this._contextMenuElement.offsetWidth;
                 const fromRightEdge = document.body.offsetWidth - this._contextMenuElement.offsetWidth;
                 this._contextMenuElement.style.left = (leftOfCursor >= 0 ? leftOfCursor : fromRightEdge) + "px";
             }
         }

         if (this._contextMenuElement.offsetTop + this._contextMenuElement.offsetHeight > document.body.offsetHeight) {
             const aboveCursor = this._contextMenuElement.offsetTop - this._contextMenuElement.offsetHeight;
             const fromBottomEdge = document.body.offsetHeight - this._contextMenuElement.offsetHeight;
             this._contextMenuElement.style.top = (!isSubMenu && aboveCursor >= 0 ? aboveCursor : fromBottomEdge) + "px";
         }
     }

     _showSubMenu(menuItemElement)
     {
         if (menuItemElement._subMenuTimer) {
             clearTimeout(menuItemElement._subMenuTimer);
             menuItemElement._subMenuTimer = 0;
         }

         if (this._subMenu)
             return;

         this._subMenu = new WI.SoftContextMenu(menuItemElement._subItems, this);
         this._subMenu.show({
             pageX: this._contextMenuElement.offsetLeft + menuItemElement.offsetWidth,
             pageY: this._contextMenuElement.offsetTop + menuItemElement.offsetTop - 4
         });
     }

     _hideSubMenu()
     {
         if (!this._subMenu)
             return;

         this._subMenu._discardSubMenus();
         this._focus();
     }

     _menuItemContextMenu(event)
     {
         // Prevent our non-native context menu from getting a native context menu on right-click.
         this._consumeEvent(event, true);
     }

     _menuItemMouseDown(event)
     {
         // Prevent menu from disappearing before mouseup.
         this._consumeEvent(event, true);
     }

     _menuItemMouseUp(event)
     {
         this._triggerAction(event.target, event);
         this._consumeEvent(event);
     }

     _menuItemMouseOver(event)
     {
         this._highlightMenuItem(event.target._isSeparator ? null : event.target);
     }

     _menuItemMouseOut(event)
     {
         const shouldUnhighlight = !this._subMenu || !event.relatedTarget ||
             this._contextMenuElement.contains(event.relatedTarget) ||
             event.relatedTarget.classList.contains("soft-context-menu-glass-pane");

         if (shouldUnhighlight)
             this._highlightMenuItem(null);
     }

     _menuKeyDown(event)
     {
         switch (event.keyIdentifier) {
         case "Up":
             this._highlightPrevious();
             break;
         case "Down":
             this._highlightNext();
             break;
         case "Left":
             if (this._parentMenu) {
                 this._highlightMenuItem(null);
                 this._parentMenu._hideSubMenu();
             }
             break;
         case "Enter":
             if (!isEnterKey(event))
                 break;
             // falls through
         case "U+0020": // Space
             if (this._highlightedMenuItemElement && !this._highlightedMenuItemElement._subItems)
                 this._triggerAction(this._highlightedMenuItemElement, event);
             // falls through
         case "Right":
             if (this._highlightedMenuItemElement && this._highlightedMenuItemElement._subItems) {
                 this._showSubMenu(this._highlightedMenuItemElement);
                 this._subMenu._focus();
                 this._subMenu._highlightNext();
             }
             break;
         case "U+001B": // Escape
             this._discardMenu(true, event);
             break;
         }
         this._consumeEvent(event, true);
     }

     _glassPaneMouseDown(event)
     {
         this._discardMenu(true, event);
         this._consumeEvent(event);
     }

     _focus()
     {
         this._contextMenuElement.focus();
     }

     _triggerAction(menuItemElement, event)
     {
         if (!menuItemElement._subItems) {
             this._discardMenu(true, event);
             if (typeof menuItemElement._actionId === "number") {
                 WI.ContextMenu.contextMenuItemSelected(menuItemElement._actionId);
                 menuItemElement._actionId = null;
             }
             return;
         }

         this._showSubMenu(menuItemElement);
         this._consumeEvent(event);
     }

     _highlightMenuItem(menuItemElement, skipSubMenuExpansion)
     {
         if (this._highlightedMenuItemElement === menuItemElement)
             return;

         this._hideSubMenu();
         if (this._highlightedMenuItemElement) {
             this._highlightedMenuItemElement.classList.remove("highlighted");

             if (this._highlightedMenuItemElement._subItems && this._highlightedMenuItemElement._subMenuTimer) {
                 clearTimeout(this._highlightedMenuItemElement._subMenuTimer);
                 this._highlightedMenuItemElement._subMenuTimer = 0;
             }
         }

         this._highlightedMenuItemElement = menuItemElement;
         if (this._highlightedMenuItemElement) {
             this._highlightedMenuItemElement.classList.add("highlighted");
             this._contextMenuElement.focus();

             if (!skipSubMenuExpansion && this._highlightedMenuItemElement._subItems && !this._highlightedMenuItemElement._subMenuTimer)
                 this._highlightedMenuItemElement._subMenuTimer = setTimeout(this._showSubMenu.bind(this, this._highlightedMenuItemElement), 150);
         }
     }

     _highlightPrevious()
     {
         let menuItemElement = this._highlightedMenuItemElement ? this._highlightedMenuItemElement.previousSibling : this._contextMenuElement.lastChild;

         while (menuItemElement && menuItemElement._isSeparator)
             menuItemElement = menuItemElement.previousSibling;

         if (menuItemElement)
             this._highlightMenuItem(menuItemElement, true);
     }

     _highlightNext()
     {
         let menuItemElement = this._highlightedMenuItemElement ? this._highlightedMenuItemElement.nextSibling : this._contextMenuElement.firstChild;

         while (menuItemElement && menuItemElement._isSeparator)
             menuItemElement = menuItemElement.nextSibling;

         if (menuItemElement)
             this._highlightMenuItem(menuItemElement, true);
     }

     _discardMenu(closeParentMenus, event)
     {
         if (this._subMenu && !closeParentMenus)
             return;

         if (this._glassPaneElement) {
             const glassPane = this._glassPaneElement;
             this._glassPaneElement = null;
             // This can re-enter discardMenu due to blur.
             document.body.removeChild(glassPane);

             if (this._parentMenu) {
                 this._parentMenu._subMenu = null;
                 if (closeParentMenus)
                     this._parentMenu._discardMenu(closeParentMenus, event);
             }

             if (event)
                 this._consumeEvent(event, true);
         } else if (this._parentMenu && this._contextMenuElement.parentElement) {
             this._discardSubMenus();

             if (closeParentMenus)
                 this._parentMenu._discardMenu(closeParentMenus, event);

             if (event)
                 this._consumeEvent(event, true);
         }
     }

     _discardSubMenus()
     {
         if (this._subMenu)
             this._subMenu._discardSubMenus();

         if (this._contextMenuElement.parentElement)
             this._contextMenuElement.parentElement.removeChild(this._contextMenuElement);

         if (this._parentMenu)
             this._parentMenu._subMenu = null;
     }
 };
	/*
	* Copyright (C) 2011 Google Inc. All Rights Reserved.
	* Copyright (C) 2017 Sony Interactive Entertainment Inc.
	*
	* Redistribution and use in source and binary forms, with or without
	* modification, are permitted provided that the following conditions
	* are met:
	* 1. Redistributions of source code must retain the above copyright
	* notice, this list of conditions and the following disclaimer.
	* 2. Redistributions in binary form must reproduce the above copyright
	* notice, this list of conditions and the following disclaimer in the
	* documentation and/or other materials provided with the distribution.
	*
	* THIS SOFTWARE IS PROVIDED BY APPLE INC. ``AS IS'' AND ANY
	* EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
	* IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
	* PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR
	* CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
	* EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
	* PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
	* PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
	* OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
	* (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
	* OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
	*/

	WI.SoftContextMenu = class SoftContextMenu
	{
	constructor(items, parentMenu)
	{
	this._items = items;
	this._parentMenu = parentMenu;
	}

	// Public

	show(event)
	{
	const isSubMenu = !!this._parentMenu;

	this._contextMenuElement = document.createElement("div");
	this._contextMenuElement.className = "soft-context-menu";
	this._contextMenuElement.style.left = event.pageX + "px";
	this._contextMenuElement.style.top = event.pageY + "px";
	this._contextMenuElement.tabIndex = 0;
	this._contextMenuElement.addEventListener("keydown", this._menuKeyDown.bind(this), false);
	for (let item of this._items)
	this._contextMenuElement.appendChild(this._createMenuItem(item));

	// Install glass pane capturing events.
	if (!isSubMenu) {
	this._glassPaneElement = document.createElement("div");
	this._glassPaneElement.className = "soft-context-menu-glass-pane";
	this._glassPaneElement.addEventListener("mousedown", this._glassPaneMouseDown.bind(this), false);
	this._glassPaneElement.appendChild(this._contextMenuElement);
	document.body.appendChild(this._glassPaneElement);
	this._focus();
	this._consumeEvent(event, true);
	} else
	this._parentGlassPaneElement().appendChild(this._contextMenuElement);

	this._repositionMenuOnScreen(isSubMenu);
	}

	// Private

	_consumeEvent(event, preventDefault)
	{
	event.stopImmediatePropagation();

	if (preventDefault)
	event.preventDefault();

	event.handled = true;
	}

	_parentGlassPaneElement()
	{
	if (!this._parentMenu)
	return null;

	if (this._parentMenu._glassPaneElement)
	return this._parentMenu._glassPaneElement;

	return this._parentMenu._parentGlassPaneElement();
	}

	_createMenuItem(item)
	{
	if (item.type === "separator")
	return this._createSeparator();

	const checkmark = "\u2713";
	const blackRightPointingTriangle = "\u25b6";

	const menuItemElement = document.createElement("div");
	menuItemElement.className = "item";
	if (!item.enabled)
	menuItemElement.classList.add("disabled");

	const checkMarkElement = document.createElement("span");
	checkMarkElement.textContent = item.checked ? checkmark : "";
	checkMarkElement.className = "checkmark";
	menuItemElement.appendChild(checkMarkElement);

	const labelElement = document.createElement("span");
	labelElement.textContent = item.label;
	labelElement.className = "label";
	menuItemElement.appendChild(labelElement);

	if (item.type === "subMenu") {
	const subMenuArrowElement = document.createElement("span");
	subMenuArrowElement.textContent = blackRightPointingTriangle;
	subMenuArrowElement.className = "submenu-arrow";
	menuItemElement.appendChild(subMenuArrowElement);

	menuItemElement._subItems = item.subItems;
	} else
	menuItemElement._actionId = item.id;

	menuItemElement.addEventListener("contextmenu", this._menuItemContextMenu.bind(this), false);
	menuItemElement.addEventListener("mousedown", this._menuItemMouseDown.bind(this), false);
	menuItemElement.addEventListener("mouseup", this._menuItemMouseUp.bind(this), false);
	menuItemElement.addEventListener("mouseover", this._menuItemMouseOver.bind(this), false);
	menuItemElement.addEventListener("mouseout", this._menuItemMouseOut.bind(this), false);

	return menuItemElement;
	}

	_createSeparator()
	{
	const separatorElement = document.createElement("div");
	separatorElement.className = "separator";
	separatorElement._isSeparator = true;
	separatorElement.createChild("div", "line");

	separatorElement.addEventListener("contextmenu", this._menuItemContextMenu.bind(this), false);
	separatorElement.addEventListener("mousedown", this._menuItemMouseDown.bind(this), false);
	separatorElement.addEventListener("mouseup", this._menuItemMouseUp.bind(this), false);
	separatorElement.addEventListener("mouseover", this._menuItemMouseOver.bind(this), false);

	return separatorElement;
	}

	_repositionMenuOnScreen(isSubMenu)
	{
	if (this._contextMenuElement.offsetLeft + this._contextMenuElement.offsetWidth > document.body.offsetWidth) {
	if (isSubMenu) {
	const parentContextMenuElement = this._parentMenu._contextMenuElement;
	const leftOfParent = parentContextMenuElement.offsetLeft - this._contextMenuElement.offsetWidth + 2;
	const fromParentRight = this._contextMenuElement.offsetLeft - this._contextMenuElement.offsetWidth + 2;
	this._contextMenuElement.style.left = (leftOfParent >= 0 ? leftOfParent : fromParentRight) + "px";
	} else {
	const leftOfCursor = this._contextMenuElement.offsetLeft - this._contextMenuElement.offsetWidth;
	const fromRightEdge = document.body.offsetWidth - this._contextMenuElement.offsetWidth;
	this._contextMenuElement.style.left = (leftOfCursor >= 0 ? leftOfCursor : fromRightEdge) + "px";
	}
	}

	if (this._contextMenuElement.offsetTop + this._contextMenuElement.offsetHeight > document.body.offsetHeight) {
	const aboveCursor = this._contextMenuElement.offsetTop - this._contextMenuElement.offsetHeight;
	const fromBottomEdge = document.body.offsetHeight - this._contextMenuElement.offsetHeight;
	this._contextMenuElement.style.top = (!isSubMenu && aboveCursor >= 0 ? aboveCursor : fromBottomEdge) + "px";
	}
	}

	_showSubMenu(menuItemElement)
	{
	if (menuItemElement._subMenuTimer) {
	clearTimeout(menuItemElement._subMenuTimer);
	menuItemElement._subMenuTimer = 0;
	}

	if (this._subMenu)
	return;

	this._subMenu = new WI.SoftContextMenu(menuItemElement._subItems, this);
	this._subMenu.show({
	pageX: this._contextMenuElement.offsetLeft + menuItemElement.offsetWidth,
	pageY: this._contextMenuElement.offsetTop + menuItemElement.offsetTop - 4
	});
	}

	_hideSubMenu()
	{
	if (!this._subMenu)
	return;

	this._subMenu._discardSubMenus();
	this._focus();
	}

	_menuItemContextMenu(event)
	{
	// Prevent our non-native context menu from getting a native context menu on right-click.
	this._consumeEvent(event, true);
	}

	_menuItemMouseDown(event)
	{
	// Prevent menu from disappearing before mouseup.
	this._consumeEvent(event, true);
	}

	_menuItemMouseUp(event)
	{
	this._triggerAction(event.target, event);
	this._consumeEvent(event);
	}

	_menuItemMouseOver(event)
	{
	this._highlightMenuItem(event.target._isSeparator ? null : event.target);
	}

	_menuItemMouseOut(event)
	{
	const shouldUnhighlight = !this._subMenu \|\| !event.relatedTarget \|\|
	this._contextMenuElement.contains(event.relatedTarget) \|\|
	event.relatedTarget.classList.contains("soft-context-menu-glass-pane");

	if (shouldUnhighlight)
	this._highlightMenuItem(null);
	}

	_menuKeyDown(event)
	{
	switch (event.keyIdentifier) {
	case "Up":
	this._highlightPrevious();
	break;
	case "Down":
	this._highlightNext();
	break;
	case "Left":
	if (this._parentMenu) {
	this._highlightMenuItem(null);
	this._parentMenu._hideSubMenu();
	}
	break;
	case "Enter":
	if (!isEnterKey(event))
	break;
	// falls through
	case "U+0020": // Space
	if (this._highlightedMenuItemElement && !this._highlightedMenuItemElement._subItems)
	this._triggerAction(this._highlightedMenuItemElement, event);
	// falls through
	case "Right":
	if (this._highlightedMenuItemElement && this._highlightedMenuItemElement._subItems) {
	this._showSubMenu(this._highlightedMenuItemElement);
	this._subMenu._focus();
	this._subMenu._highlightNext();
	}
	break;
	case "U+001B": // Escape
	this._discardMenu(true, event);
	break;
	}
	this._consumeEvent(event, true);
	}

	_glassPaneMouseDown(event)
	{
	this._discardMenu(true, event);
	this._consumeEvent(event);
	}

	_focus()
	{
	this._contextMenuElement.focus();
	}

	_triggerAction(menuItemElement, event)
	{
	if (!menuItemElement._subItems) {
	this._discardMenu(true, event);
	if (typeof menuItemElement._actionId === "number") {
	WI.ContextMenu.contextMenuItemSelected(menuItemElement._actionId);
	menuItemElement._actionId = null;
	}
	return;
	}

	this._showSubMenu(menuItemElement);
	this._consumeEvent(event);
	}

	_highlightMenuItem(menuItemElement, skipSubMenuExpansion)
	{
	if (this._highlightedMenuItemElement === menuItemElement)
	return;

	this._hideSubMenu();
	if (this._highlightedMenuItemElement) {
	this._highlightedMenuItemElement.classList.remove("highlighted");

	if (this._highlightedMenuItemElement._subItems && this._highlightedMenuItemElement._subMenuTimer) {
	clearTimeout(this._highlightedMenuItemElement._subMenuTimer);
	this._highlightedMenuItemElement._subMenuTimer = 0;
	}
	}

	this._highlightedMenuItemElement = menuItemElement;
	if (this._highlightedMenuItemElement) {
	this._highlightedMenuItemElement.classList.add("highlighted");
	this._contextMenuElement.focus();

	if (!skipSubMenuExpansion && this._highlightedMenuItemElement._subItems && !this._highlightedMenuItemElement._subMenuTimer)
	this._highlightedMenuItemElement._subMenuTimer = setTimeout(this._showSubMenu.bind(this, this._highlightedMenuItemElement), 150);
	}
	}

	_highlightPrevious()
	{
	let menuItemElement = this._highlightedMenuItemElement ? this._highlightedMenuItemElement.previousSibling : this._contextMenuElement.lastChild;

	while (menuItemElement && menuItemElement._isSeparator)
	menuItemElement = menuItemElement.previousSibling;

	if (menuItemElement)
	this._highlightMenuItem(menuItemElement, true);
	}

	_highlightNext()
	{
	let menuItemElement = this._highlightedMenuItemElement ? this._highlightedMenuItemElement.nextSibling : this._contextMenuElement.firstChild;

	while (menuItemElement && menuItemElement._isSeparator)
	menuItemElement = menuItemElement.nextSibling;

	if (menuItemElement)
	this._highlightMenuItem(menuItemElement, true);
	}

	_discardMenu(closeParentMenus, event)
	{
	if (this._subMenu && !closeParentMenus)
	return;

	if (this._glassPaneElement) {
	const glassPane = this._glassPaneElement;
	this._glassPaneElement = null;
	// This can re-enter discardMenu due to blur.
	document.body.removeChild(glassPane);

	if (this._parentMenu) {
	this._parentMenu._subMenu = null;
	if (closeParentMenus)
	this._parentMenu._discardMenu(closeParentMenus, event);
	}

	if (event)
	this._consumeEvent(event, true);
	} else if (this._parentMenu && this._contextMenuElement.parentElement) {
	this._discardSubMenus();

	if (closeParentMenus)
	this._parentMenu._discardMenu(closeParentMenus, event);

	if (event)
	this._consumeEvent(event, true);
	}
	}

	_discardSubMenus()
	{
	if (this._subMenu)
	this._subMenu._discardSubMenus();

	if (this._contextMenuElement.parentElement)
	this._contextMenuElement.parentElement.removeChild(this._contextMenuElement);

	if (this._parentMenu)
	this._parentMenu._subMenu = null;
	}
	};