I thought it might be useful to statically analyze the user's sketch and determine whether they're using p5.dom and/or p5.sound, and include those libraries in the preview frame if so. This has the benefit of resolving #58 without needing any extra setup or configuration on the part of the author.
escope could make the static analysis task pretty easy. (It could also make implicit-sketch.ts a lot simpler, too.)
Concerns:
This will require us to have a representation of the global symbols of p5.dom/p5.sound in the widget source code, and they could go out of date.
I'm not sure how much extra weight escope will add to the bundled code.
Below is an example snippet I wrote while playing around with escope.
Example `escope` snippet
``` js
"use strict";
let esprima = require('esprima');
let escope = require('escope');
let ast = esprima.parse(`
var a = 1;
function boop() {
a += b;
}
boop
`);
let scopeManager = escope.analyze(ast);
function isInScope(ref, scope) {
if (scope.set.has(ref.identifier.name)) {
return true;
}
if (!scope.upper) {
return false;
}
return isInScope(ref, scope.upper);
}
scopeManager.scopes.forEach(scope => {
scope.references.forEach(ref => {
console.log(ref.identifier.name, isInScope(ref, scope));
});
});
```
I thought it might be useful to statically analyze the user's sketch and determine whether they're using p5.dom and/or p5.sound, and include those libraries in the preview frame if so. This has the benefit of resolving #58 without needing any extra setup or configuration on the part of the author.
escopecould make the static analysis task pretty easy. (It could also makeimplicit-sketch.tsa lot simpler, too.)Concerns:
escopewill add to the bundled code.Below is an example snippet I wrote while playing around with
escope.Example `escope` snippet
``` js "use strict"; let esprima = require('esprima'); let escope = require('escope'); let ast = esprima.parse(` var a = 1; function boop() { a += b; } boop `); let scopeManager = escope.analyze(ast); function isInScope(ref, scope) { if (scope.set.has(ref.identifier.name)) { return true; } if (!scope.upper) { return false; } return isInScope(ref, scope.upper); } scopeManager.scopes.forEach(scope => { scope.references.forEach(ref => { console.log(ref.identifier.name, isInScope(ref, scope)); }); }); ```