Revisions to Add a console to Stack Snippets

added 230 characters in body

Source Link

edited Jan 13, 2016 at 4:16

2.2k
1
24
33

<!-- results pane console output; see http://meta.stackexchange.com/a/242491 -->
<script src="http://gh-canon.github.io/stack-snippet-console/console.min.js"></script>

Here's a demo:

<!-- results pane console output; see http://meta.stackexchange.com/a/242491 -->
<script src="http://gh-canon.github.io/stack-snippet-console/console.min.js"></script>

Here's a demo:

Bounty Ended with 500 reputation awarded by T.J. Crowder

occurred Dec 18, 2015 at 14:36

Rollback to Revision 28

Source Link

edited Jul 9, 2015 at 20:56

canon

2.2k
1
24
33

// sample script to generate output
var values = [
  ["a", "b", "c"],
  function foo() {
    return "bar";
  },
  document.createElement("a"), 
  { foo: "bar" },
  false,
  "foo",
  new Date()
];

// log each value with a delay
values.forEach(function(v, i) {
  setTimeout(function() {
    // call our custom log method... logging to both the DOM and the console
    console.log("i: %d, type: %s, value: %o", i, typeof v, v);
  }, 500 * i);
});

// throw an error
setTimeout(function(){
    throw new Error("test!");
}, 3500);

<!-- Providesresults thepane `snippet`console object,output; see http://meta.stackexchange.com/a/242144 -->
<!-- To show result in the DOM instead of console, only to be used in this code snippet. Remove before using elsewhere.242491 -->
<script src="http://gh-canon.github.io/stack-snippet-console/console.min.js"></script>

// sample script to generate output
var values = [
  ["a", "b", "c"],
  function foo() {
    return "bar";
  },
  document.createElement("a"), 
  { foo: "bar" },
  false,
  "foo",
  new Date()
];

// log each value with a delay
values.forEach(function(v, i) {
  setTimeout(function() {
    // call our custom log method... logging to both the DOM and the console
    console.log("i: %d, type: %s, value: %o", i, typeof v, v);
  }, 500 * i);
});

// throw an error
setTimeout(function(){
    throw new Error("test!");
}, 3500);

<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144 -->
<!-- To show result in the DOM instead of console, only to be used in this code snippet. Remove before using elsewhere. -->
<script src="http://gh-canon.github.io/stack-snippet-console/console.min.js"></script>

// sample script to generate output
var values = [
  ["a", "b", "c"],
  function foo() {
    return "bar";
  },
  document.createElement("a"), 
  { foo: "bar" },
  false,
  "foo",
  new Date()
];

// log each value with a delay
values.forEach(function(v, i) {
  setTimeout(function() {
    // call our custom log method... logging to both the DOM and the console
    console.log("i: %d, type: %s, value: %o", i, typeof v, v);
  }, 500 * i);
});

// throw an error
setTimeout(function(){
    throw new Error("test!");
}, 3500);

<!-- results pane console output; see http://meta.stackexchange.com/a/242491 -->
<script src="http://gh-canon.github.io/stack-snippet-console/console.min.js"></script>

Edited comment for copy-pasting elsewhere

Source Link

edit approved Jul 9, 2015 at 7:00

Samuel Liew

8.1k
1
30
55

// sample script to generate output
var values = [
  ["a", "b", "c"],
  function foo() {
    return "bar";
  },
  document.createElement("a"), 
  { foo: "bar" },
  false,
  "foo",
  new Date()
];

// log each value with a delay
values.forEach(function(v, i) {
  setTimeout(function() {
    // call our custom log method... logging to both the DOM and the console
    console.log("i: %d, type: %s, value: %o", i, typeof v, v);
  }, 500 * i);
});

// throw an error
setTimeout(function(){
    throw new Error("test!");
}, 3500);

<!-- resultsProvides panethe console`snippet` output;object, see http://meta.stackexchange.com/a/242491242144 -->
<!-- To show result in the DOM instead of console, only to be used in this code snippet. Remove before using elsewhere. -->
<script src="http://gh-canon.github.io/stack-snippet-console/console.min.js"></script>

// sample script to generate output
var values = [
  ["a", "b", "c"],
  function foo() {
    return "bar";
  },
  document.createElement("a"), 
  { foo: "bar" },
  false,
  "foo",
  new Date()
];

// log each value with a delay
values.forEach(function(v, i) {
  setTimeout(function() {
    // call our custom log method... logging to both the DOM and the console
    console.log("i: %d, type: %s, value: %o", i, typeof v, v);
  }, 500 * i);
});

// throw an error
setTimeout(function(){
    throw new Error("test!");
}, 3500);

<!-- results pane console output; see http://meta.stackexchange.com/a/242491 -->
<script src="http://gh-canon.github.io/stack-snippet-console/console.min.js"></script>

// sample script to generate output
var values = [
  ["a", "b", "c"],
  function foo() {
    return "bar";
  },
  document.createElement("a"), 
  { foo: "bar" },
  false,
  "foo",
  new Date()
];

// log each value with a delay
values.forEach(function(v, i) {
  setTimeout(function() {
    // call our custom log method... logging to both the DOM and the console
    console.log("i: %d, type: %s, value: %o", i, typeof v, v);
  }, 500 * i);
});

// throw an error
setTimeout(function(){
    throw new Error("test!");
}, 3500);

<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144 -->
<!-- To show result in the DOM instead of console, only to be used in this code snippet. Remove before using elsewhere. -->
<script src="http://gh-canon.github.io/stack-snippet-console/console.min.js"></script>

added 45 characters in body

Source Link

edited May 26, 2015 at 17:12

canon

2.2k
1
24
33

Loading

Added some comments to the sample.

Source Link

edited May 13, 2015 at 18:50

canon

2.2k
1
24
33

Loading

added 62 characters in body

Source Link

edited May 12, 2015 at 13:33

canon

2.2k
1
24
33

Loading

Bounty Ended with 500 reputation awarded by T.J. Crowder

occurred May 12, 2015 at 7:13

deleted 36 characters in body

Source Link

edited May 9, 2015 at 17:42

canon

2.2k
1
24
33

Loading

added 46 characters in body

Source Link

edited May 9, 2015 at 16:35

canon

2.2k
1
24
33

Loading

added 102 characters in body

Source Link

edited May 8, 2015 at 20:25

canon

2.2k
1
24
33

Loading

added 49 characters in body

Source Link

edited May 7, 2015 at 14:12

canon

2.2k
1
24
33

Loading

added 30 characters in body

Source Link

edited Apr 25, 2015 at 15:29

canon

2.2k
1
24
33

Loading

added 299 characters in body

Source Link

edited Feb 23, 2015 at 21:52

canon

2.2k
1
24
33

Loading

Updated links.

Source Link

edited Feb 11, 2015 at 19:01

canon

2.2k
1
24
33

Loading

Copied script over to github as it's presumably a more reliable host.

Source Link

edited Feb 11, 2015 at 18:48

canon

2.2k
1
24
33

Loading

Logging the error last to highlight the new change.

Source Link

edited Feb 10, 2015 at 18:43

canon

2.2k
1
24
33

Loading

No longer logging an error to the native console; it's doing that already.

Source Link

edited Feb 10, 2015 at 18:29

canon

2.2k
1
24
33

Loading

added 31 characters in body

Source Link

edited Feb 10, 2015 at 17:43

canon

2.2k
1
24
33

Loading

Showing errors in console.

Source Link

edited Feb 10, 2015 at 16:11

canon

2.2k
1
24
33

Loading

deleted 8 characters in body

Source Link

edited Feb 10, 2015 at 14:36

canon

2.2k
1
24
33

Loading

edited body

Source Link

edited Feb 9, 2015 at 21:21

canon

2.2k
1
24
33

Loading

added 70 characters in body

Source Link

edited Feb 9, 2015 at 20:29

canon

2.2k
1
24
33

Loading

added 41 characters in body

Source Link

edited Dec 1, 2014 at 19:25

canon

2.2k
1
24
33

Loading

deleted 1 character in body

Source Link

edited Oct 24, 2014 at 15:56

canon

2.2k
1
24
33

Loading

Stack Exchange Network

Return to Answer