Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including devtools-detect with all npm packages installed. Try it out:

var devtoolsDetect = require("devtools-detect")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

devtools-detect v3.0.0

Detect if DevTools is open and its orientation


Detect if DevTools is open and its orientation

Useful for when you want something special to happen when DevTools is open. Like pausing canvas, adding style debug info, etc.



$ npm install devtools-detect


<script src="node_modules/devtools-detect/index.js"></script>
<script type="module">
    // Check if it's open
    console.log('Is DevTools open:', window.devtools.isOpen);

    // Check it's orientation, `undefined` if not open
    console.log('DevTools orientation:', window.devtools.orientation);

    // Get notified when it's opened/closed or orientation changes
    window.addEventListener('devtoolschange', event => {
        console.log('Is DevTools open:', event.detail.isOpen);
        console.log('DevTools orientation:', event.detail.orientation);


  • Chrome DevTools
  • Safari DevTools
  • Firefox DevTools
  • Opera DevTools


Doesn't work if DevTools is undocked and will show false positive if you toggle any kind of sidebar.


MIT © Sindre Sorhus


RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free