Functions defined in nested blocks in sloppy mode not recognised as in scope

[overlookmotel]

Binding location of functions nested in blocks is dependent on strict/sloppy mode.

Function declarations are bound:

• Strict mode: to statement block they are in.
• Sloppy mode: to body of enclosing function or program.

// Sloppy mode
{
  function f() {}
}
module.exports = () => typeof f; // 'function'

'use strict';
{
  function f() {}
}
module.exports = () => typeof f; // 'undefined'

Livepack does not currently handle the sloppy mode case. Babel plugin does not recognise that f is in scope of the exported function and so f does not get captured.

This is at least in part down to a bug in Babel. babel/babel#13549

Probably also a bug in Livepack.

[overlookmotel]

There's a further complication. Even in sloppy mode, a function will be bound within its own block if there's an existing var in the scope it would otherwise be hoisted to defined with const, let, a class declaration, or a function param.

In these cases, the inner x is bound to it's "home" block:

// Sloppy mode
const x = () => 1;
{
  {
    function x() { return 2; }
    console.log(x()); // Logs 2
  }
  console.log(x()); // Logs 1
}

// Sloppy mode
let x = () => 1;
{
  {
    function x() { return 2; }
    console.log(x()); // Logs 2
  }
  console.log(x()); // Logs 1
}

// Sloppy mode
class x {
  constructor() { this.y = 1; }
}

{
  {
    function x() { return 2; }
    console.log(x()); // Logs 2
  }
  console.log(new x().y); // Logs 1
}

function outer(x) {
  {
    function x() { return 2; }
    console.log(x()); // Logs 2
  }
  console.log(x()); // Logs 1
}
outer(() => 1);

Whereas in these cases it's hoisted to the outer block:

// Sloppy mode
var x = () => 1;
{
  {
    function x() { return 2; }
    console.log(x()); // Logs 2
  }
  console.log(x()); // Logs 2
}

// Sloppy mode
function x() { return 1; }
{
  {
    function x() { return 2; }
    console.log(x()); // Logs 2
  }
  console.log(x()); // Logs 2
}

These observations made on Node v16.10.0. Have not checked behavior on previous Node versions.

[overlookmotel]

A const, let or class declaration in an intermediate scope also prevents function being hoisted.

// Sloppy mode
{
  const x = () => 1;
  {
    function x() { return 2; }
    console.log(x()); // Logs 2
  }
  console.log(x()); // Logs 1
}
console.log(typeof x); // Logs undefined

// Sloppy mode
{
  let x = () => 1;
  {
    function x() { return 2; }
    console.log(x()); // Logs 2
  }
  console.log(x()); // Logs 1
}
console.log(typeof x); // Logs undefined

// Sloppy mode
{
  class x {
    constructor() { this.y = 1; }
  }

  {
    function x() { return 2; }
    console.log(x()); // Logs 2
  }
  console.log(new x().y); // Logs 1
}
console.log(typeof x); // Logs undefined

In all cases, whether the other var is in TDZ when function is defined makes no difference:

// Sloppy mode
{
  {
    function x() { return 2; }
    console.log(x()); // Logs 2
  }
  const x = () => 1;
  console.log(x()); // Logs 1
}
console.log(typeof x); // Logs undefined

[overlookmotel]

I think fixed in b2a0a09. Needs tests.