33

I created a fiddle with the following code:

var x=10;

When I try to view this in the console, I get the following:

> x
ReferenceError: x is not defined

Makes sense, as it takes Javascript to run the console. Is there a way to get this working?

Casebash
  • 114,675
  • 90
  • 247
  • 350

2 Answers2

69

If you use Chrome or Chromium, looks at the bottom of your developer console, where the string <top frame> appears. Click on it and select result(fiddle.jshell.net). This will change the current scope of the browser and you can access to all the global variables. Also, remember to change the loading option in jsFiddle to no wrap if you want to access var variables, too.

Screenshot Chrome

UPDATE: 2014.12.01

With Firefox (34+) and the new Firefox Developer Edition, it's possibile to do the same by enabling the Select a frame as the currently targeted document extra tool into the developer tools, then click on it and select http://fiddle.jshell.net/_display/.

Screenshot Firefox

Ragnarokkr
  • 2,328
  • 2
  • 21
  • 31
  • 4
    I did that, but the variable is still undefined – Casebash Jan 15 '13 at 00:10
  • 3
    I updated my answer @Casebash. If you run your code with the `onLoad` option in jsFiddle, the `var x` won't be reachable from the console, because the code will be wrapped in a closure (the function attached to the `onLoad` event) and made invisible from the console. – Ragnarokkr Jan 15 '13 at 00:14
  • 4
    @caspyin For a variable that goes out of scope, you can put a breakpoint in your code where the variable is still in scope, then when the breakpoint is hit, you can access the variable from the console since the console is in the context of where the breakpoint is paused at. – AaronLS Feb 25 '13 at 14:41
  • Change load type specifically to `No wrap - bottom of ` option. – Eido95 Mar 04 '19 at 09:42
5

The console is like it's own closure where this === window: you see only vars defined in your console (per command/script).

So you have two ways to publish data visible in your console:

  1. var x = 5; console.log(x); // out of your code, not as console command
  2. window.x = 5; // now x is global, so in console you get 5 for x.

Instead of pure console commands, you may use a debugger. In firebug and also chrome's dev tools you can set a breakpoint, refresh your page (in jsFiddle should Run do this) and now you can see the actual values of your variables in scope. (You need to reload the page once, to get the code into debugger, then the next reload you get your breakpoints in document.ready event.)

metadings
  • 3,798
  • 2
  • 28
  • 37