This tool provides a simple solution to disable developer tools when they are docked, making it more challenging for candidates and participants to easily look up answers within the code during selections or workshops.
npm i devtools-disabler
<script src="../project-root/node_modules/devtools-disabler/dist/devtools-disabler.js" defer></script>
[!IMPORTANT]
- This will not work when the developer tools are undocked.
- The tool is not supported by Brave browser (only the shortcuts).
- Edge
- Firefox
- Chrome
- Right-click disabled
- Disables menu option in the browser.
- When accessing developer tools from the menu, the tool displays a message and blocks the original page content, prompting you to close the developer tools to restore the original content.
Shortcuts that are disabled
- F12
- ctrl + shift + i
- ctrl + shift + j
- ctrl + shift + c
- shift + F3
- shift + F5
- shift + F7
- shift + F9
- shift + e
- shift + m
- shift + k
- ctrl + u
If you also want to make sure that the user can't select like text, etc. Use the following property in your CSS
body {
user-select: none;
}