VM : setTimeout is not working in browser runInNewContext

[ahmadalibaloch]

• Chrome 70:
• Platform Ubuntu 18.04:
• V8:
  I am executing a JS script using VM in browser like this with details below.
  vm.runInNewContext(codeToEval, sandboxObject);

setTimeout, setInterval and other interval built in methods do not work, even if I expose them in sandboxObject.

console.log('start');
setTimeout(()=> {
     console.log('hello timeout');
 }, 2000);
 
 console.log('end');

output:

start
end

It is to be noted that when I add .bind(this) , then timeout works and breaks at that line saying .bind is not a function.

console.log('start');
setTimeout(()=> {
     console.log('hello timeout');
 }, 2000).bind(this);
 
 console.log('end');

output:

start
hello timeout
// and an error in console saying setTimeout(...).bind is not a function
// and end is not printed

[addaleax]

This is happening because the result of setTimeout(...) is, indeed, not a function – independent of whether you’re using a VM context or not. Without knowing what you want to do it’s hard to tell what you need to do – usually, .bind() would be used for the function passed to setTimeout(), but since you’re using arrow functions already, using .bind(this) wouldn’t do anything, so I’m a bit confused about that.

[ahmadalibaloch]

Use case is that I have an app where I want to run some scripts provided by user in a separate scope(separate global scope than the hosting app or document) where I provide some global variables (APIs specific to app development online like app.alert() customized ).

The solution was to run those scripts in a separate context, using vm module and it works fine using
vm.runInNewContext(usersCodeString, sandboxObjectWithContext);

Only problem is that setTimeout doesn't work at all if there is one in the usersCodeString. I am sure problem is that the setTimeout has different this then the context of script, but I don't know how to solve this.

This is the code that can be used for testing:

const codeToEval = `
    console.log('start');
    setTimeout(()=> {
         console.log('hello timeout');
     }, 2000).bind(this);
     console.log('end');`
const context = {setTimeout} // just for info, otherwise setTimeout is there in new context without it too
vm.runInNewContext(codeToEval,context );

If you run this, hello timeout will not be printed in console in browser, but it works fine in node.js.

[devsnek]

are you using vm-browserify? browsers don't have a vm module. we can't really provide support for things that aren't node itself, but you can open an issue on whatever tool you're using.

[ahmadalibaloch]

There is a builtin module vm on browsers which we can import without using a lib.
It is also used in the superset to run user scripts in a separate context link.

By the way I also opened this issue in vm-browserify, and they have a separate reason why it doesn't work.

This issue is also discussed here, any workarounds are appreciated.
setTimeout and/or context issue (runInContext)
setTimeout not run in webview's Node vm

[devsnek]

There is a builtin module vm on browsers which we can import without using a lib.

this is incorrect. Additionally, if you try to use vm with webpack or browserify you will automatically receive vm-browserify.

Seems like the vm-browserify issue answered this. Feel free to re-open this if needed.

[ahmadalibaloch]

If you say that the iFrame is destroyed in which the code was running then how my custom implementation of setTimeout and setInterval is working.

const setTimeouts = [];
function customSetTimeout(cb, interval) {
  const now = window.performance.now();
  const index = setTimeouts.length;
  setTimeouts[index] = () => {
    cb();
  };
  setTimeouts[index].active = true;
  const handleMessage = (evt) => {
    if (evt.data === index) {
      if (window.performance.now() - now >= interval) {
        window.removeEventListener('message', handleMessage);
        if (setTimeouts[index].active) {
          setTimeouts[index]();
        }
      } else {
        window.postMessage(index, '*');
      }
    }
  };
  window.addEventListener('message', handleMessage);
  window.postMessage(index, '*');
  return index;
}

function customClearTimeout(setTimeoutId) {
  if (setTimeouts[setTimeoutId]) {
    setTimeouts[setTimeoutId].active = false;
  }
}

Even if I add customSetTimeout for 1 minute, it works

 const codeToEval = `console.log('start)
 var a = setTimeout(function() {
    console.log('setTimeout  async done');
 }, 10000);
 console.log('sync');`
 const sandbox = {
      setTimeout: customSetTimeout,
      clearTimeout: customClearTimeout,
    };
vm.runInNewContext(codeToEval, sandbox);