[Feature]: DevTools Always On Top

Describe the feature/enhancement you need

I need WebView2 to be able to keep devtools on top of all other windows. Without this feature when a winform is in full screen mode and devtools is also open, clicking anywhere in the winform causes devtools to be shuffled to the back (no longer visible). This means you cannot see any console output.

The scenario/use case where you would use this feature

When you are using WebView2 to create full screen applications, but really any time that you want devtools to be on top.

How important is this request to you?

Nice to have. There are other ways to tackle this, but having official API support would be beneficial.

Suggested implementation

I actually managed to cobble together some spaghetti code that implements the feature. At its most basic, when the windows form is activated the devtools window handle is got (if not already gotten) and it is shuffled to the top. The devtools toggle hotkey (F12) is also overridden (in a manner of speaking) so that reopening the devtools window also shuffles it to the top.

The part where I get the devtools window handle is a bit concerning because it assumes that the process the WebView2 belongs to is called "msedgewebview2" and the devtools window title starts with "DevTools". It would be great if this was built into WebView2 so it would be forward compatible.

Since I was able to accomplish this task myself I feel it wouldn't be that difficult for minds greater than my own to implement as part of WebView2 ❤️

private bool WantToOpenDevTools = false;

[DllImport("user32.dll")]
[return: MarshalAs(UnmanagedType.Bool)]
static extern bool SetWindowPos(IntPtr hWnd, IntPtr hWndInsertAfter, int X, int Y, int cx, int cy, uint uFlags);

[DllImport("user32.dll")]
static extern IntPtr SendMessage(IntPtr hWnd, int msg, IntPtr wParam, IntPtr lParam);

const int WM_CLOSE = 0x0010;
const uint SWP_NOMOVE = 0x0002;
const uint SWP_NOSIZE = 0x0001;
const uint SWP_NOACTIVATE = 0x0010;
private static readonly IntPtr HWND_TOPMOST = new IntPtr(-1);
private IntPtr DevToolsHandle = IntPtr.Zero;

/// <summary>
/// Get handle to "DevTools" window if it is open.
/// </summary>
/// <returns></returns>
public bool GetDevToolsHandle()
{
    if (DevToolsHandle != IntPtr.Zero) return true; // Return if it was previously found and not reset.

    foreach (Process pList in Process.GetProcesses())
    {
        if (pList.ProcessName == "msedgewebview2" & pList.MainWindowTitle.IndexOf("DevTools") == 0)
        {
            DevToolsHandle = pList.MainWindowHandle;
            return true;
        }
    }

    DevToolsHandle = IntPtr.Zero;
    return false;
}

/// <summary>
/// If the devtools window is open, bring it to the top.
/// </summary>
private void DevToolsToFront()
{
    if (GetDevToolsHandle()) SetWindowPos(DevToolsHandle, HWND_TOPMOST, 0, 0, 0, 0, SWP_NOMOVE | SWP_NOSIZE | SWP_NOACTIVATE);
}

/// <summary>
/// Bring the devtools window to the top when the form is activated.
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void Form1_Activated(object sender, EventArgs e)
{
    DevToolsToFront();
}

private void webView_KeyDown(object sender, KeyEventArgs e)
{
    switch (e.KeyCode)
    {
        case Keys.F12:
            if (appOptions.UseDevTools) e.Handled = true;
            break;

        default:
            break;
    }
}

private void WebView_KeyUp(object sender, KeyEventArgs e)
{
    switch (e.KeyCode)
    {
        case Keys.F12:
            if (appOptions.UseDevTools)
            {
                WantToOpenDevTools = !WantToOpenDevTools;
                //ShowDevTools(DevToolsOpen);

                if (WantToOpenDevTools)
                {
                    // We want to open "DevTools".
                    if (DevToolsHandle != IntPtr.Zero)
                    {
                        DevToolsToFront(); // "DevTools" is already open, raise it to the top.
                    }
                    else
                    {
                        WebView.CoreWebView2.OpenDevToolsWindow(); // Open "DevTools".
                    }
                }
                else
                {
                    // We want to close "DevTools".
                    if (GetDevToolsHandle())
                    {
                        // If "DevTools" is open, ask it to close.
                        SendMessage(DevToolsHandle, WM_CLOSE, IntPtr.Zero, IntPtr.Zero);
                        DevToolsHandle = IntPtr.Zero;
                        WantToOpenDevTools = false;
                    }
                }
                e.Handled = true;
            }
            break;

        default:
            break;
    }
}

What does your app do? Is there a pending deadline for this request?

Of course I'd love my requested features implemented yesterday but I appreciate that these things take time. I'd just like it if this was accepted as a thing that might be of use and for it to be available at some time in the future.

AB#47606522

MicrosoftEdge / WebView2Feedback