11

I just got a new Mac and it comes with Safari 6 installed. I've opened up the Safari 6 web inspector tools and now I can't find some of the tools I used before in Safari 5.

In Safari 5 you can press esc and have the console pop up and type in javascript. In Safari 6 I can't find it.

  • Welcome to Ask Different! You had two questions in here. This site works better when there is only one question per question. That way, it's easier for other people to find solutions if they have the same problem. I've edited out your second question, but feel free to ask it separately. Please take a look at the FAQs for more info. Thanks. – Nathan Greenstein Aug 1 '12 at 18:51
  • I'd disagree and your answer has made it more clear that the two questions are so inter-related as to be pretty much one thing. The other question was how do I debug a js file? It seems that you do that by selecting the js in the files list and simply adding breakpoints etc. So the real answer to my question is to select a js file in the file list and drag the quick console to make it bigger. Then you can do as before, and esc will get you into the quick console. – radixhound Aug 1 '12 at 21:53
7

The console still exists, but it has moved.

Click the speech bubble tab at the top of the sidebar on the left side of the screen and then click on the Current Log entry in the sidebar.

enter image description here

The keyboard shortcut to jump to this tab is cmd+opt+c.

Note that the quick console is always available at the bottom of the screen and can be enlarged by dragging its top border upwards.

I recommend giving the About Safari Web Inspector a good read to familiarize yourself with the new Dev Tools.

  • 1
    sorry for asking a question but cmd+opt+c is not really working for me... is there any other way? – user76201 Apr 20 '14 at 3:58
21

Open Safari and choose Safari > Preferences > Advanced. Then select the checkbox 'Show Develop menu' in menu bar.

Choose Develop > Show Error Console.

0

In Safari 10, how to get to the console a few ways:

right click "anywhere on the web page" -> "inspect" and the dev tools open up.

right click on toolbar (or "view" menu) -> customize toolbar, then add "inspect element" button. When you subsequently use it, it pops up the standard dev tools.

  • downvoters please leave why thanks. – rogerdpack Sep 28 '16 at 15:44
  • It is worth to mention that the inspect option in the context menu only appears if the main menu of development is enabled (as comments @Evangelin) – gmo Apr 12 '17 at 15:18

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Not the answer you're looking for? Browse other questions tagged or ask your own question.