# devtools-detect

**Repository Path**: ayuLiao/devtools-detect

## Basic Information

- **Project Name**: devtools-detect
- **Description**: 检测devtools是否打开
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 2
- **Forks**: 1
- **Created**: 2021-06-14
- **Last Updated**: 2024-05-10

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# devtools-detect

> 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.


## [Demo](https://sindresorhus.com/devtools-detect)


## Install

```
$ npm install devtools-detect
```


## Usage

```html
<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);
	});
</script>
```


## Support

- Chrome DevTools
- Safari DevTools
- Firefox DevTools
- Opera DevTools


## Caveats

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


## License

MIT © [Sindre Sorhus](https://sindresorhus.com)