Super User is a question and answer site for computer enthusiasts and power users. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I am debugging javascript on a web page using Chrome Web Developer Tools. On Windows, I can use F11 to step into a function while using the debugger.

However, when I press F11 on my Mac, The volume just increases. F11 + fn doesn't do it either. How can I use Chrome Web Developer keyboard shortcuts on a Mac?

share|improve this question
    
Other alternative to Step into on Mac is Command+; (semi-colon) and to Step out is Shift+Command+; (semi-colon) – Ricardo Oct 8 '15 at 17:00
1  
I like my mac, but i hate their shortcuts. all of them are terrible – Robotsushi Feb 11 at 22:33
up vote 15 down vote accepted
  • Continue: F8 or Command-/ (forward slash) on Mac or Control-/ (forward slash) on other platforms.
  • Step over: F10 or Command-' (apostrophe) on Mac or Control-' (apostrophe) on other platforms.
  • Step into: F11 or Command-; (semi-colon) on Mac or Control-; (semi-colon); on other platforms.
  • Step out: Shift-F11 or Shift-Command-; (semi-colon) on Mac or Shift-Control-; (semi-colon) on other platforms.
  • Next call frame: Control-. (period) on all platforms.
  • Previous call frame: Control-, (comma) on all platforms.

Source

share|improve this answer
3  
in OSX fn-F11 shows the desktop or something like that -- all the windows fly away to the sides of the screen – jcollum Jun 18 '15 at 16:43

It works:

  1. Go to System setting -> Keyborad -> Keyboard. Make sure you have Enabled Use F1/F2 as standard function keys.

  2. Go to System setting -> Keyborad -> Keyboard Shortcuts. Choose Mission Control on the left panel, then look to the right panel and disable F11 to Show Desktop.

share|improve this answer
1  
Coming from Windows to OS X, this is one of the biggest annoyances I have struggled with the past two weeks... Now I can debug properly lol. FANKOOOOOO! – Gavin Jul 10 '13 at 15:07
    
This should be the accepted answer. – JohnnyO Oct 26 '14 at 6:16

This can be accomplished with Karabiner as well. The keymap for a full-sized keyboard looks like:

<?xml version="1.0"?>
<root>
  <appdef>
    <appname>CHROME</appname>
    <equal>com.google.Chrome</equal>
  </appdef>

  <item>
    <name>CHROMEDEBUGGINGKEY</name>
    <appendix>This maps the F13, F14 and F15 keys to Chrome debugging keys</appendix>
    <identifier>private.swap_chrome_to_debug_settings</identifier>
    <only>CHROME</only>
    <!--<autogen>__KeyToKey__ KeyCode::SPACE, KeyCode::TAB</autogen>-->
    <autogen>
      __KeyToKey__
      KeyCode::F13, KeyCode::F8
    </autogen>
    <autogen>
      __KeyToKey__
      KeyCode::F14, KeyCode::F10
    </autogen>
    <autogen>
      __KeyToKey__
      KeyCode::F15, KeyCode::SEMICOLON, ModifierFlag::COMMAND_L
    </autogen>
    <autogen>
      __KeyToKey__
      KeyCode::F16, KeyCode::SEMICOLON, ModifierFlag::COMMAND_L, ModifierFlag::SHIFT_L,
    </autogen>
  </item>
</root>
share|improve this answer

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .