Как отследить DevTools состояние?

#javascript #google_chrome #браузер #google_chrome_devtools

Возможно ли по средствам JavaScript отследить что пользователь зашел на старицу с
уже открытой панелью разработчика DevTools ? (не только для Chrome но и для других
браузеров) 
    

Ответы

Ответ 1

Вот такой способ, о котором я писал ранее в комментариях.



function debuggerOpened() {
  console.log('debugger opened')
}

let last = Date.now()
setInterval(function() {
  debugger;
  let now = Date.now()
  now - last > 500 && debuggerOpened(); 
  last = now;
}, 10)


Ответ 2

Можно попробовать еще вот такой подход. 

При открытом DevTools console.log будет работать медленнее, чем при закрытом.

Данный метод не очень хорошо работает в Firefox, там надо подобрать другие функции
работы с консолью.



const arr = new Array(5000).fill(Math.random().toString('36')).join(' ');
const delay = getDelay(arr) * 2;
delayTime.textContent = delay;
var isOpen = null;
setInterval(() => {
  const arr = new Array(5000).fill(Math.random().toString('36')).join(' ');
  const time = getDelay(arr);
  isOpen = time > delay;
  currentTime.textContent = time;
  consoleStatus.innerText = isOpen ? 'opened' : 'closed';
}, 1000);

function getDelay(data) {
  var t = performance.now();
  console.log(data);
  return performance.now() - t;
}





Ответ 3

Это решение использует тот факт, что toString() не вызывается для зарегистрированных
объектов, если консоль не открыта.

var devtools = /./;
devtools.toString = function() {
  this.opened = true;
}

console.log('%c', devtools);
// devtools.opened will become true if/when the console is opened