ESM compatibility workaround

lib/babel.js

@@ -37,9 +37,11 @@ const TRACKER_PATH = pathJoin(__dirname, 'tracker.js'),
 	BLOCK_NAME = Symbol('livepack.BLOCK_NAME'),
 	FUNCTION_PROPS = Symbol('livepack.FUNCTION_PROPS'),
 	HAS_CONSTRUCTOR = Symbol('livepack.HAS_CONSTRUCTOR'),
+	PROGRAM_PATH = Symbol('livepack.PROGRAM_PATH'),
 	PARENT_FUNCTION_PATH = Symbol('livepack.PARENT_FUNCTION_PATH'),
 	PARENT_FULL_FUNCTION_PATH = Symbol('livepack.PARENT_FULL_FUNCTION_PATH'),
 	SUPER_VAR_NODE = Symbol('livepack.SUPER_VAR_NODE'),
+	TOP_LEVEL_VAR_NAMES = Symbol('livepack.TOP_LEVEL_VARS'),
 	IS_INTERNAL = Symbol('livepack.IS_INTERNAL'),
 	COMMON_JS_VARS = new Set(COMMON_JS_VAR_NAMES);
 
@@ -155,10 +157,16 @@ function programEnterVisitor(path, state) {
 	state[TEMP_VAR_NUMS_USED] = [];
 	state[TEMP_VAR_NODES] = [];
 
+	// Record program path
+	state[PROGRAM_PATH] = path;
+
 	// Init parent function state vars
 	state[PARENT_FUNCTION_PATH] = null;
 	state[PARENT_FULL_FUNCTION_PATH] = null;
 
+	// Init set of top level var names
+	state[TOP_LEVEL_VAR_NAMES] = new Set();
+
 	// Init block ID counter
 	state[BLOCK_ID] = TOP_BLOCK_ID;
 
@@ -443,7 +451,7 @@ function blockStatementExitVisitor(blockPath, state) {
  */
 function identifierVisitor(identifierPath, state) {
 	// Skip internally-created identifiers
-	const {node} = identifierPath;
+	const {node, parentPath} = identifierPath;
 	if (node[IS_INTERNAL]) return;
 
 	// Skip identifiers not used as vars e.g. `{a: 1}`
@@ -462,7 +470,22 @@ function identifierVisitor(identifierPath, state) {
 
 	// Find enclosing function
 	let functionPath = state[PARENT_FUNCTION_PATH];
-	if (!functionPath) return;
+	if (!functionPath) {
+		// If is top-level var declaration, record it
+		// This is a hack to work around Babel not seeing vars created by
+		// `@babel/plugin-transform-modules-commonjs` when binding is searched for later.
+		// `.scope.getBinding()` returns undefined. So catalog them here and use the list
+		// to identify their scope when they're encountered later.
+		// TODO Find a better way to do this.
+		if (
+			parentPath.isVariableDeclarator() && identifierPath.key === 'id'
+			&& parentPath.parentPath.parentPath.isProgram()
+		) {
+			state[TOP_LEVEL_VAR_NAMES].add(name);
+		}
+
+		return;
+	}
 
 	// If is method key (e.g. `{ [x]() {} }`), treat as used in parent function
 	if (functionPath.isMethod() && functionPath.node.computed) {
@@ -479,7 +502,7 @@ function identifierVisitor(identifierPath, state) {
 	}
 
 	// Skip function's own name
-	if (identifierPath.parentPath === functionPath && identifierPath.key === 'id') return;
+	if (parentPath === functionPath && identifierPath.key === 'id') return;
 
 	// Skip class's own name in constructor
 	if (functionPath.node.kind === 'constructor') {
@@ -506,9 +529,9 @@ function identifierVisitor(identifierPath, state) {
 			return;
 		}
 
-		if (COMMON_JS_VARS.has(name)) {
-			// Treat `exports` etc as external vars, not globals
-			bindingBlockPath = functionPath.findParent(path => path.isProgram());
+		if (state[TOP_LEVEL_VAR_NAMES].has(name) || COMMON_JS_VARS.has(name)) {
+			// Treat `exports` etc as external vars, not globals + identify top-level vars.
+			bindingBlockPath = state[PROGRAM_PATH];
 		} else {
 			// Global var
 			return;