Eel: There is a way to disable developer tools?

Created on 9 May 2020  路  3Comments  路  Source: ChrisKnott/Eel

I've tried many chrome flags, but I can't disable developer tools.
Also, there is a way to make my app not run over chrome? Because in MacOS, when my app opens, there menu bar is from Chrome.

help wanted

Most helpful comment

Hi, I have disabled the opening of DevTools with Javascript. For MacOS other key codes may have to be considered. The script must be included or linked in every HTML document:

window.addEventListener("keydown", function(event) {
    if (event.keyCode == 116) {
        // block F5 (Refresh)
        event.preventDefault();
        event.stopPropagation();
        return false;

    } else if (event.keyCode == 122) {
        // block F11 (Fullscreen)
        event.preventDefault();
        event.stopPropagation();
        return false;

    } else if (event.keyCode == 123) {
        // block F12 (DevTools)
        event.preventDefault();
        event.stopPropagation();
        return false;

    } else if (event.ctrlKey && event.shiftKey && event.keyCode == 73) {
        // block Strg+Shift+I (DevTools)
        event.preventDefault();
        event.stopPropagation();
        return false;

    } else if (event.ctrlKey && event.shiftKey && event.keyCode == 74) {
        // block Strg+Shift+J (Console)
        event.preventDefault();
        event.stopPropagation();
        return false;
    }
});

Alternatively to Chrome, Electron can be used together with EEL. Electron offers a wide range of customization possibilities.

All 3 comments

Hi, I have disabled the opening of DevTools with Javascript. For MacOS other key codes may have to be considered. The script must be included or linked in every HTML document:

window.addEventListener("keydown", function(event) {
    if (event.keyCode == 116) {
        // block F5 (Refresh)
        event.preventDefault();
        event.stopPropagation();
        return false;

    } else if (event.keyCode == 122) {
        // block F11 (Fullscreen)
        event.preventDefault();
        event.stopPropagation();
        return false;

    } else if (event.keyCode == 123) {
        // block F12 (DevTools)
        event.preventDefault();
        event.stopPropagation();
        return false;

    } else if (event.ctrlKey && event.shiftKey && event.keyCode == 73) {
        // block Strg+Shift+I (DevTools)
        event.preventDefault();
        event.stopPropagation();
        return false;

    } else if (event.ctrlKey && event.shiftKey && event.keyCode == 74) {
        // block Strg+Shift+J (Console)
        event.preventDefault();
        event.stopPropagation();
        return false;
    }
});

Alternatively to Chrome, Electron can be used together with EEL. Electron offers a wide range of customization possibilities.

You can also disable the context-menu:

window.oncontextmenu = function(event) {
    // block right-click / context-menu
    event.preventDefault();
    event.stopPropagation();
    return false;
};

Hi @jerearaujo03 - disabling developer tools will be down to finding the right flag in the browser you're using. You can try workarounds like those posted above, but I'd probably question why you need to do this - and be careful arbitrarily disabling key presses/context menus as you might confuse some users. But if you're absolutely devoted to disabling developer tools and can't find a browser flag, you'll probably need to resort to something hacky like that.

I'm going to close this for now as there isn't much more advice I can offer that's related to Eel. Hope this is enough for you. :)

Was this page helpful?
0 / 5 - 0 ratings

Related issues

ClayMDMI picture ClayMDMI  路  4Comments

datainvestor picture datainvestor  路  5Comments

sameera-madushan picture sameera-madushan  路  3Comments

mattiaornaghi picture mattiaornaghi  路  5Comments

MishaTreedye picture MishaTreedye  路  4Comments