devtools-detector
npm install @innei/devtools-detectornpm install devtools-detector --save
javascript
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();
`
$3
`javascript
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();
});
`
$3
`html
`
Support
- IE9+ (required Promise polyfill)
- Edge
- Chrome
- Firefox
- Safari
- Opera
Type & API
- DevtoolsDetail
`typescript
interface DevtoolsDetail {
isOpen: boolean;
checkerName: string;
}
`
- Listener
`typescript
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