HTML context menu remains on the screen

GoJS
8

OK, here’s a partial solution that Simon came up with. Move that hiding code to a separate function:

      function hideCX() {
        if (myDiagram.currentTool instanceof go.ContextMenuTool) {
          myDiagram.currentTool.doCancel();
        }
      }

Then in your showContextMenu function (that’s the name in the samples/customContextMenu.html` sample, but could be anything in your code) where you are showing the HTML for the context menu, add this:

      function showContextMenu(obj, diagram, tool) {
        . . .
        // Optional: Use a `window` click listener with event capture to
        //           remove the context menu if the user clicks elsewhere on the page
        window.addEventListener("click", hideCX, true);
      }

Then clean up that listener when hiding the context menu:

      function hideContextMenu() {
        cxElement.classList.remove("show-menu");
        // Optional: Use a `window` click listener with event capture to
        //           remove the context menu if the user clicks elsewhere on the page
        window.removeEventListener("click", hideCX, true);
      }

This should handle clicks anywhere else on your page, but not when changing focus to another window.