Not able to understand why JS Code is not running in JS Bin

Question

Not able to understand why JS Code is not running in JS Bin

1.1k Views Asked by Sayan At 27 March 2020 at 08:55

Getting the below error code in JS Bin when I am trying to run the following code, am I doing anything wrong??

let myTodos = {
  day: "Monday",
  meetings: 0,
  meetDone: 0,
}

let addMeeting = function(todo, meet = 0) {
  todo.meetings = todo.meetings + meet;  
}


let meetDone = function (todo, meet = 0) {
  todo.meetDone = todo.meetDone - meet; 

}

let resetDay = function (todo) {
  todo.meetings = 0;
  todo.meetDone = 0;
}

let getSummaryOfDay = function (todo) {
  let meetleft = todo.meetings + todo.meetDone;
  return `You have ${meetleft} meetings for today.!`;
}

addMeeting(myTodos, 4);
addMeeting(myTodos, 2);
meetDone(myTodos, 5);
console.log(getSummaryOfDay(myTodos));
console.log (myTodos);

And the error that I am getting in JS Bin is as follows.

"error"
 "SyntaxError: Unexpected token '{'
  at https://static.jsbin.com/js/prod/runner-4.1.7.min.js:1:13924
  at https://static.jsbin.com/js/prod/runner-4.1.7.min.js:1:10866"

Original Q&A

There are 2 best solutions below

**VLAZ** · Answer 1 · 2020-03-27T09:27:50.143000

This is a bug in JSBin's loop protection.

When you use this code (JSBin link):

let myTodos = {
  day: "Monday",
  meetings: 0,
  meetDone: 0,
}

let addMeeting = function(todo, meet = 0) {
  todo.meetings = todo.meetings + meet;  
}


let meetDone = function (todo, meet = 0) {
  todo.meetDone = todo.meetDone - meet; 

}

let resetDay = function (todo) {
  todo.meetings = 0;
  todo.meetDone = 0;
}

let getSummaryOfDay = function (todo) {
  let meetleft = todo.meetings + todo.meetDone;
  return `You have ${meetleft} meetings for today.!`;
}

addMeeting(myTodos, 4);
addMeeting(myTodos, 2);
meetDone(myTodos, 5);
console.log(getSummaryOfDay(myTodos));
console.log (myTodos);

JSBin produces the following document that will be executed:

<!DOCTYPE html>

<html>
<head>
  <meta charset=\"utf-8\">
  <meta name=\"viewport\" content=\"width=device-width\">
  <title>JS Bin</title>
<style id=\"jsbin-css\">

</style>
</head>
<body>

<script>try {let myTodos = {
  day: \"Monday\",
  meetings: 0,
  meetDone: 0,
}

let addMeeting = function(todo, meet = 0) {
  todo.meetings = todo.meetings + meet;  
}

let meetDone = function (todo, meet = 0) {
  todo.meetDone = todo.meetDone - meet; 

}

let resetDay = function (todo) {
  todo.meetings = 0;
  todo.meetDone = 0;
}

let getSummaryOfDay = function (todo) {
  let meetleft = todo.meetings + todo.meetDone;
 {
if (window.runnerWindow.protect.prote{;window.runnerWindow.protect.protect({ line: 23, reset: true }); ct({ line: 23 })) break;
 return `You have ${meetleft} meetings for today.!`;
}}

}

addMeeting(myTodos, 4);
addMeeting(myTodos, 2);
meetDone(myTodos, 5);
window.runnerWindow.proxyConsole.log(getSummaryOfDay(myTodos));
window.runnerWindow.proxyConsole.log (myTodos);
} catch (error) { throw error; }

//# sourceURL=xibavicide.js
</script>
</body>
</html>

Note how the template literal is wrapped in the protection code and now it's not syntactically correct.

Presumably, the protection is there to stop infinite loops.

If you just remove for (JSBin link) then you don't trigger the protection and the document produced is syntactically correct:

<!DOCTYPE html>

<html>
<head>
  <meta charset=\"utf-8\">
  <meta name=\"viewport\" content=\"width=device-width\">
  <title>JS Bin</title>
<style id=\"jsbin-css\">

</style>
</head>
<body>

<script>try {let myTodos = {
  day: \"Monday\",
  meetings: 0,
  meetDone: 0,
}

let addMeeting = function(todo, meet = 0) {
  todo.meetings = todo.meetings + meet;  
}

let meetDone = function (todo, meet = 0) {
  todo.meetDone = todo.meetDone - meet; 

}

let resetDay = function (todo) {
  todo.meetings = 0;
  todo.meetDone = 0;
}

let getSummaryOfDay = function (todo) {
  let meetleft = todo.meetings + todo.meetDone;
  return `You have ${meetleft} meetings  today.!`;
}

addMeeting(myTodos, 4);
addMeeting(myTodos, 2);
meetDone(myTodos, 5);
window.runnerWindow.proxyConsole.log(getSummaryOfDay(myTodos));
window.runnerWindow.proxyConsole.log (myTodos);
} catch (error) { throw error; }

//# sourceURL=roqosiyasa.js
</script>
</body>
</html>

You can use a workaround suggested in the bug - adding a // noprotect comment anywhere in the JavaScript area will stop the loop protection from triggering. JSBin link

**Raj** · Answer 2 · 2023-02-05T11:43:44.130000

Switching from Firefox browser to Chrome while using jsbin fixed this error for me.

If code did not have any issues, it worked fine in both browsers. If it had any issues , errors reason in Firefox was displayed like in question. In Chrome the correct reason was shown.

Not able to understand why JS Code is not running in JS Bin

There are 2 best solutions below

Related Questions in JAVASCRIPT

Related Questions in JSBIN

Trending Questions

Popular # Hahtags

Popular Questions