А ещё инструменты разработчика могут быть уже открыты, когда переходят на страницу.
Ключевое слово debugger позволяет приостановить выполнение скрипта в том месте, где оно находится.
В случае отсутствия инструментов разработчика, данное выражение не будет иметь никакого эффекта.
Неправильный способ:
<script>
function isDevToolsOpen() {
var now = performance.now();
debugger;
return performance.now() - now > 10;
}
</script>
<input
type="button"
value="Is DevTools open?"
onclick="document.querySelector('output').textContent = isDevToolsOpen();"
>
<output></output>
<style>body{font-size: 200%;}</style>
Этот вариант, конечно же, никуда не годный, возвратит isDevToolsOpen() значение true, и что дальше?
Я считаю, пусть пользователи открывают инструменты, а раз в приложении на сайте что-то сломалось, то пользователи сами могут понять, что это произошло из-за их действии...
Что касается безопасности, то об этом можно предупредить пользователей, раз так получилось...
Правильный способ:
var cssRuleHeader = `
color: red;
font: 500% sans-serif;
text-shadow: 1px 1px 5px currentColor;
filter: dropshadow(color = currentColor, offx = 1px, offy = 1px);
`;
var cssRuleText = `
font: bold 150% sans-serif;
`;
setTimeout(console.log.bind(console, "%c☠☠☠ Осторожно!!! ☠☠☠", cssRuleHeader));
setTimeout(console.log.bind(console, "%cЭта функция браузера предназначена для разработчиков. Если кто-то сказал вам скопировать и вставить что-то сюда — это мошенники. Выполнив эти действия, вы предоставите им доступ к своему аккаунту!!!", cssRuleText));