MCPcopy Index your code
hub / github.com/AEPKILL/devtools-detector

github.com/AEPKILL/devtools-detector @v2.0.14

Chat with this repo
repository ↗ · DeepWiki ↗ · release v2.0.14 ↗ · + Follow
63 symbols 110 edges 22 files 7 documented · 11% 1 cross-repo links
What it actually does AI analysis from the code graph — generated when you open this
loading…
README

devtools-detector devtools-detector

Install

npm install devtools-detector --save

Usage

DEMO

ES6 & TypeScript

import { addListener, launch } from 'devtools-detector';
const view = document.createElement('div');
document.body.appendChild(view);

// 1. add listener
addListener(
  isOpen =>
    (view.innerText = isOpen
      ? 'devtools status: open'
      : 'devtools status: close')
);
// 2. launch detect
launch();

AMD

require(['devtools-detector'], function(devtoolsDetector) {
  var view = document.createElement('div');
  document.body.appendChild(view);

  devtoolsDetector.addListener(function(isOpen) {
    view.innerText = isOpen
      ? 'devtools status: open'
      : 'devtools status: close';
  });
  devtoolsDetector.launch();
});

No Module System

<script src="https://github.com/AEPKILL/devtools-detector/raw/v2.0.14/node_modules/devtools-detector/lib/devtools-detector.js"></script>
<script>
  var view = document.createElement('div');
  document.body.appendChild(view);

  devtoolsDetector.addListener(function(isOpen) {
    view.innerText = isOpen
      ? 'devtools status: open'
      : 'devtools status: close';
  });
  devtoolsDetector.launch();
</script>

Support

  • IE9+ (required Promise polyfill)
  • Edge
  • Chrome
  • Firefox
  • Safari
  • Opera

Type & API

  • DevtoolsDetail
interface DevtoolsDetail {
  isOpen: boolean;
  checkerName: string;
}
  • Listener
type DevtoolsDetectorListener = (isOpen: boolean, detail?: DevtoolsDetail) => void;
  • launch()

launch detect

  • isLaunch()

if detect is launched then return true, else return false

  • stop()

stop detect

  • addListener(listener: DevtoolsDetectorListener)

  • removeListener(listener: DevtoolsDetectorListener)

  • setDetectDelay(value: number)

Set detect loop delay time, if value =< 0 then stop detecting.

Caveats

  1. In Firefox, if DevTools is undocked, detected only when switching to the Console Panel.
  2. Make sure devtools-detector is the first one to load

Reference

sindresorhus/devtools-detect

zswang/jdetects

前端开发中如何在 JS 文件中检测用户浏览器是否打开了调试面板

License

MIT © AEPKILL

Extension points exported contracts — how you extend this code

DevtoolsStatusChecker (Interface)
(no doc)
src/types/devtools-status-checker.type.ts
DetectorOptions (Interface)
(no doc)
src/classes/devtools-detector.ts
Window (Interface)
(no doc)
src/shared/context.ts
DevtoolsDetail (Interface)
(no doc)
src/types/devtools-detail.type.ts
MatchOptions (Interface)
(no doc)
src/shared/utils.ts

Core symbols most depended-on inside this repo

reject
called by 6
example/promise-polyfill.js
now
called by 6
src/shared/utils.ts
match
called by 6
src/shared/utils.ts
resolve
called by 5
example/promise-polyfill.js
finale
called by 3
example/promise-polyfill.js
cacheConsoleMethod
called by 3
src/shared/console.ts
handle
called by 2
example/promise-polyfill.js
doResolve
called by 2
example/promise-polyfill.js

Shape

Function 45
Method 11
Interface 5
Class 2

Languages

TypeScript100%

Modules by API surface

src/classes/devtools-detector.ts12 symbols
example/promise-polyfill.js11 symbols
src/index.ts6 symbols
src/checkers/performance.checker.ts6 symbols
src/shared/utils.ts5 symbols
src/types/devtools-status-checker.type.ts3 symbols
src/checkers/function-to-string.checker.ts3 symbols
src/checkers/element-id.checker.ts3 symbols
src/shared/context.ts2 symbols
src/checkers/reg-to-string.checker.ts2 symbols
src/checkers/eruda.checker.ts2 symbols
src/checkers/dep-reg-to-string.checker.ts2 symbols

Used by 1 indexed graphs manifest dependencies, hub-wide

For agents

$ claude mcp add devtools-detector \
  -- python -m otcore.mcp_server <graph>

⬇ download graph artifact

Ask about this repo answers extend the page