油猴脚本：快捷键触发 debugger

调试网页时经常遇到一个烦人的问题：dropdown、tooltip 之类的浮层元素，鼠标一移开或者切个窗口就消失了，想审查它的 DOM 结构非常困难。打 DOM 断点虽然可行但操作麻烦，不如直接用快捷键把页面冻住。

安装以下油猴脚本后，按下 Command+F12 即可触发 debugger 断点，页面会在当前状态停住，方便在 DevTools 中从容检查：

// ==UserScript==
// @name         Debugger Hotkey
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  Press Command+F12 to trigger debugger
// @author       Mufanc
// @match        *://*/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    document.addEventListener('keydown', function(e) {
        if (e.metaKey && e.key === 'F12') {
            e.preventDefault();
            debugger;
        }
    });
})();

使用前记得先打开 DevTools，否则 debugger 语句不会生效。