Error generating code with escodegen after node removal - javascript

First I created an esprima AST, then I want to remove a node using estraverse and finally regenerate the code with escodegen.
But I get an error.
The code I'm trying is:
var esprima = require('esprima');
var estraverse = require('estraverse');
var escodegen = require('escodegen');
(function () {
//build an ast with 2 lines of code
var ast = esprima.parse("console.log('1');\n console.log('2');")
console.log("original code:\n" + escodegen.generate(ast));
console.log();
//change one of the lines, works
ast = estraverse.replace(ast, {
enter: function (node) {
},
leave: function (node) {
if (node.type === esprima.Syntax.CallExpression) {
this.break();
return esprima.parse("console.log('patch');").body[0].expression;
}
}
});
console.log("patched code:\n" + escodegen.generate(ast));
console.log();
//remove one of the lines, error
ast = estraverse.replace(ast, {
enter: function (node) {
},
leave: function (node) {
if (node.type === esprima.Syntax.CallExpression) {
this.break();
return this.remove();
}
}
});
console.log("removed node:\n" + escodegen.generate(ast));
})()
The error trace is:
C:\temp\node_modules\escodegen\escodegen.js:2450
type = expr.type || Syntax.Property;
^
TypeError: Cannot read property 'type' of null
at CodeGenerator.generateExpression (C:\temp\node_modules\escodegen\escodegen.js:2450:20)
at CodeGenerator.ExpressionStatement (C:\temp\node_modules\escodegen\escodegen.js:1335:28)
at CodeGenerator.generateStatement (C:\temp\node_modules\escodegen\escodegen.js:2469:33)
at CodeGenerator.Program (C:\temp\node_modules\escodegen\escodegen.js:1717:43)
at CodeGenerator.generateStatement (C:\temp\node_modules\escodegen\escodegen.js:2469:33)
at generateInternal (C:\temp\node_modules\escodegen\escodegen.js:2490:28)
at Object.generate (C:\temp\node_modules\escodegen\escodegen.js:2558:18)
at C:\temp\bug1.js:35:45
at Object.<anonymous> (C:\temp\bug1.js:38:3)
at Module._compile (module.js:570:32)
Am I doing something wrong? Is this an error in escodegen or maybe in estraverse?
Thanks in advance.

I put an issue on github and I got an answer, I was making an invalid AST.
Deleting the CallExpression was leaving his parent ExpressionStatement empty and therefore invalid. The solution is simply deleting the ExpressionStatement.
This code works as expected:
var esprima = require('esprima');
var estraverse = require('estraverse');
var escodegen = require('escodegen');
(function () {
//build an ast with 2 lines of code
var ast = esprima.parse("console.log('1');\n console.log('2');")
console.log("original code:\n" + escodegen.generate(ast));
console.log();
//remove one of the lines, works!
var done = false;
ast = estraverse.replace(ast, {
enter: function (node) {
if (done)
return this.break();
if (node.type === esprima.Syntax.ExpressionStatement) {
done = true;
this.remove();
}
},
leave: function (node) {
if (done)
return this.break();
}
});
console.log("removed node:\n" + escodegen.generate(ast));
})()
The output:
original code:
console.log('1');
console.log('2');
removed node:
console.log('2');

It appears as though one reason this can occur is when code is removed that leaves an empty arrow function body. For example, the original code:
() => console.log(1);
Resulting in:
() =>
With one solution being:
() => { console.log(1); }
Arguably the parent should be removed too in this instance, just might be a little tricky if it was in practice something like
useEffect(() => console.log(1))

Related

Adding [0] causes callback to be called twice?

I'm writing utility for some minecraft stuff, whatever... So, first of all I have a code that can extract specified files from archive and give there content in callback:
const unzip = require("unzip-stream");
const Volume = require("memfs").Volume;
const mfs = new Volume();
const fs = require("fs");
function getFile(archive, path, cb) {
let called = false;
fs.createReadStream(archive)
.pipe(unzip.Parse())
.on("entry", function(entity) {
if (path.includes(entity.path)) {
entity.pipe(mfs.createWriteStream("/" + path))
.on("close", function() {
mfs.readFile("/" + path, function(err, content) {
if (!called) cb(content);
called = true;
mfs.reset();
});
}).on("err", () => {});
} else {
entity.autodrain();
}
});
}
module.exports = { getFile };
It works perfect when I test it in interactive console:
require("./zip").getFile("minecraft-mod.jar", ["mcmod.info", "cccmod.info"], console.log); // <= Works fine! Calls callback ONCE!
When I started to develop utility using this code I discovered a VERY strange thing.
So I have filenames in files array.
I'm using async/eachSeries to iterate over it. I have no callback function - only iterate one.
I have this code to parse .json files in mods:
let modinfo = Object.create(JSON.parse(content.replace(/(\r\n|\n|\r)/gm,"")));
It also works fine. But here comes magic...
So, .json files can contain array or object. If it's array we need to take first element of it:
if (modinfo[0]) modinfo = modinfo[0];
It works.
But, if it's object we need to take first element of modlist property in in:
else modinfo = modinfo.modlist[0];
And if modinfo was and object boom - callback now fires TWICE! WHAT?
But, if I remove [0] from else condition:
else modinfo = moninfo.modlist; // <= No [0]
Callback will be called ONCE! ???
If I try to do something like this:
if (modinfo[0]) modinfo = modinfo[0];
else {
const x = modinfo.modlist;
modinfo = x[0];
}
Same thing happens...
Also, it's called without arguments.
I tried to investigate - where callback is called twice. Read the zip extractor code again... It has those lines:
This:
let called = false;
And those:
if (!called) cb(content);
called = true;
So, if for some reason even this condition fires up two times:
if (path.includes(entity.path)) {
It should not call callback, right? No! Not only that, but if I try to
console.log(called);
It will log false two times!
NodeJS version: v8.0.0
Full code:
function startSignCheck() {
clear();
const files = fs.readdirSync("../mods");
async.eachSeries(files, function(file, cb) {
console.log("[>]", file);
zip.getFile("../mods/" + file, ["mcmod.info", "cccmod.info"], function(content) {
console.log(content);
console.log(Buffer.isBuffer(content));
if (content != undefined) content = content.toString();
if (!content) return cb();
let modinfo = Object.create(JSON.parse(content.replace(/(\r\n|\n|\r)/gm, "")));
if (modinfo[0]) modinfo = modinfo[0];
else modinfo = modinfo.modlist[0];
//if (!modinfo.name) return cb();
/*curse.searchMod(modinfo.name, modinfo.version, curse.versions[modinfo.mcversion], function(link) {
if (!link) return cb();
signature.generateMD5("../mods/" + file, function(localSignature) {
signature.URLgenerateMD5(link, function(curseSignature) {
if (localSignature === curseSignature) {
console.log(file, "- Подпись верна".green);
} else {
console.log(file.bgWhite.red + " - Подпись неверна".bgWhite.red);
}
cb();
});
});
});*/
});
});
}
Example contents of mcmod.info is:
{
"modListVersion": 2,
"modList": [{
"modid": "journeymap",
"name": "JourneyMap",
"description": "JourneyMap Unlimited Edition: Real-time map in-game or in a web browser as you explore.",
"version": "1.7.10-5.1.4p2",
"mcversion": "1.7.10",
"url": "http://journeymap.info",
"updateUrl": "",
"authorList": ["techbrew", "mysticdrew"],
"logoFile": "assets/journeymap/web/img/ico/journeymap144.png",
"screenshots": [],
"dependants":[],
"dependencies": ["Forge#[10.13.4.1558,)"],
"requiredMods": ["Forge#[10.13.4.1558,)"],
"useDependencyInformation": true
}]
}
Problem was that I was using modlist instead of modList. Not it works! Thanks for solution, Barmar

Why does escodegen and esprima generate a parenthesis wrapper on my source code?

I am using escodegen to add an ending code on my statement as below. In the leave method, I append a .toArray() call on the end of the statement.
const esprima = require('esprima');
const estraverse = require('estraverse');
const escodegen = require('escodegen');
const ast = esprima.parse('db.find()');
let finished = false;
estraverse.traverse(ast, {
leave: (node, parent) => {
if (node.type === esprima.Syntax.ExpressionStatement && !finished) {
finished = true;
let statement = escodegen.generate(node);
statement = `${statement.substring(0, statement.lastIndexOf(';'))}.toArray()`;
const findAst = esprima.parse(statement);
node.arguments = findAst.body[0].expression.arguments;
node.callee = findAst.body[0].expression.callee;
node.type = findAst.body[0].expression.type;
}
},
});
const generated = escodegen.generate(ast);
console.log('generated code:', generated);
The output from above code is: generated code: (db.find().toArray()).
I don't understand why it wraps a parenthesis on my source code. Is there anything wrong in my source code?
You are generating an incorrect AST. An ExpressionStatement has the form {type: "ExpressionStatement", expression... } .
You are modifying your ExpressionStatement, attaching to it arguments and callee and you are changing its type (to CallExpression). Here:
node.arguments = findAst.body[0].expression.arguments;
node.callee = findAst.body[0].expression.callee;
node.type = findAst.body[0].expression.type;
Resulting a weird AST.
You can see it simply with : console.log('generated ast: %j', ast);
A quick solution is attach mentioned parts where them belong (to expression). Resulting:
let finished = false;
estraverse.traverse(ast, {
leave: (node, parent) => {
if (node.type === esprima.Syntax.ExpressionStatement && !finished) {
finished = true;
let statement = escodegen.generate(node);
statement = `${statement.substring(0, statement.lastIndexOf(';'))}.toArray()`;
console.log(statement);
const findAst = esprima.parse(statement);
node.expression.arguments = findAst.body[0].expression.arguments;
node.expression.callee = findAst.body[0].expression.callee;
node.expression.type = findAst.body[0].expression.type;
}
},
});
It will generate a correct AST, that will output the expected db.find().toArray();.
But I think the code is a bit complicated and does too much work, it parses db.find() then it generates code and parses it again.
Additionally you can return this.break() in leave to stop the traverse.
In my humble opinion it would be much clear:
var new_expr = {
type: "CallExpression",
callee: {
type: "MemberExpression",
computed: false,
object: null,
property: {
type: "Identifier",
name: "toArray"
}
},
arguments: []
};
const ast3 = esprima.parse('db.find()');
estraverse.traverse(ast3, {
leave: function(node, parent) {
if (node.type === esprima.Syntax.ExpressionStatement) {
new_expr.callee.object = node.expression;
node.expression = new_expr;
return this.break();
}
},
});
I hope you find this useful.

How can I rewrite this while loop in a JSLint-approved way?

Looking at the the "Streams 2 & 3 (pull) example" from: https://github.com/jprichardson/node-fs-extra#walk
var items = [] // files, directories, symlinks, etc
var fs = require('fs-extra')
fs.walk(TEST_DIR)
.on('readable', function () {
var item
while ((item = this.read())) {
items.push(item.path)
}
})
.on('end', function () {
console.dir(items) // => [ ... array of files]
})
Latest version of JSLint complaints about the while:
Unexpected statement '=' in expression position.
while ((item = this.read())) {
Unexpected 'this'.
while ((item = this.read())) {
I'm trying to figure out how to write this in a JSLint-approved way. Any suggestions?
(Note: I'm aware there are other JSLint violations in this code ... I know how to fix those ...)
If you're really interested in writing this code like Douglas Crockford (the author of JSLint), you would use recursion instead of a while loop, since there are tail call optimizations in ES6.
var items = [];
var fs = require("fs-extra");
var files = fs.walk(TEST_DIR);
files.on("readable", function readPaths() {
var item = files.read();
if (item) {
items.push(item.path);
readPaths();
}
}).on("end", function () {
console.dir(items);
});

Matching text in element with Protractor

I have an element on page. And there could be different text. I am trying to do like (code is below), and it is not printed to console.
this.checkStatus = function () {
var element = $('.message')
browser.wait(EC.visibilityOf(element), 5000).then(function () {
browser.wait(EC.textToBePresentInElement(conStatus, 'TEXT1'), 500).then(function () {
console.log('TEXT1');
})
browser.wait(EC.textToBePresentInElement(element, 'TEXT2'), 500).then(function () {
console.log('TEXT2');
})
browser.wait(EC.textToBePresentInElement(element, 'TEXT3'), 500).then(function () {
console.log('TEXT3');
})
browser.wait(EC.textToBePresentInElement(element, 'TEXT4'), 500).then(function () {
console.log('TEXT4');
})
})
return this;
}
thanks
I see two problems. first, not sure what 'constatus' is? you need to correct that. second, browser.wait will be throwing error/exceptions when it is not able to find matching condition and timeout expires, So, if your first condition doesn't meet, it will throw timeout exception and will never go to second one. Instead, try something like below
var section = "";
this.checkStatus = function () {
var element = $('.message')
browser.wait(EC.visibilityOf(element), 5000).then(function () {
browser.wait(()=>{
if(EC.textToBePresentInElement(element, 'TEXT1')){
section = "Text1";
}
else if(EC.textToBePresentInElement(element, 'TEXT2')) {
section = "Text2";
}
else if(EC.textToBePresentInElement(element, 'TEXT3')) {
section = "Text3";
}
else if(EC.textToBePresentInElement(element, 'TEXT4')) {
section = "Text4";
}
if(section !== "")
return true;
}, 5000).then(()=>{
<here you can do anything based on 'section'>
}
Note - I haven't verified compilation errors.. so check for that.
Not sure what are you up to, but you can join multiple expected conditions with "or":
var conStatus = $('.message');
var containsText1 = EC.textToBePresentInElement(conStatus, 'TEXT1');
var containsText2 = EC.textToBePresentInElement(conStatus, 'TEXT2');
var containsText3 = EC.textToBePresentInElement(conStatus, 'TEXT3');
var containsText4 = EC.textToBePresentInElement(conStatus, 'TEXT4');
browser.wait(EC.or(containsText1, containsText2, containsText3, containsText4), 5000);

Uglify JS - compressing unused variables

Uglify has a "compression" option that can remove unused variables...
However, if I stored some functions in an object like this....
helpers = {
doSomething: function () { ... },
doSomethingElese: function () { ... }
}
... is there a way to remove helpers.doSomething() if it's never accessed?
Guess I want to give the compressor permission to change my object.
Any ideas if it's possible? Or any other tools that can help?
Using a static analyzer like Uglify2 or Esprima to accomplish this task is somewhat nontrivial, because there are lots of situations that will call a function that are difficult to determine. To show the complexity, there's this website:
http://sevinf.github.io/blog/2012/09/29/esprima-tutorial/
Which attempts to at least identify unused functions. However the code as provided on that website will not work against your example because it is looking for FunctionDeclarations and not FunctionExpressions. It is also looking for CallExpression's as Identifiers while ignoring CallExpression's that are MemberExpression's as your example uses. There's also a problem of scope there, it doesn't take into account functions in different scopes with the same name - perfectly legal Javascript, but you lose fidelity using that code as it'll miss some unused functions thinking they were called when they were not.
To handle the scope problem, you might be able to employ ESTR (https://github.com/clausreinke/estr), to help figure out the scope of the variables and from there the unused functions. Then you'll need to use something like escodegen to remove the unused functions.
As a starting point for you I've adapted the code on that website to work for your very specific situation provided, but be forwarned, it will have scope issue.
This is written for Node.js, so you'll need to get esprima with npm to use the example as provided, and of course execute it with node.
var fs = require('fs');
var esprima = require('esprima');
if (process.argv.length < 3) {
console.log('Usage: node ' + process.argv[1] + ' <filename>');
process.exit(1);
}
notifydeadcode = function(data){
function traverse(node, func) {
func(node);
for (var key in node) {
if (node.hasOwnProperty(key)) {
var child = node[key];
if (typeof child === 'object' && child !== null) {
if (Array.isArray(child)) {
child.forEach(function(node) {
traverse(node, func);
});
} else {
traverse(child, func);
}
}
}
}
}
function analyzeCode(code) {
var ast = esprima.parse(code);
var functionsStats = {};
var addStatsEntry = function(funcName) {
if (!functionsStats[funcName]) {
functionsStats[funcName] = {calls: 0, declarations:0};
}
};
var pnode = null;
traverse(ast, function(node) {
if (node.type === 'FunctionExpression') {
if(pnode.type == 'Identifier'){
var expr = pnode.name;
addStatsEntry(expr);
functionsStats[expr].declarations++;
}
} else if (node.type === 'FunctionDeclaration') {
addStatsEntry(node.id.name);
functionsStats[node.id.name].declarations++;
} else if (node.type === 'CallExpression' && node.callee.type === 'Identifier') {
addStatsEntry(node.callee.name);
functionsStats[node.callee.name].calls++;
}else if (node.type === 'CallExpression' && node.callee.type === 'MemberExpression'){
var lexpr = node.callee.property.name;
addStatsEntry(lexpr);
functionsStats[lexpr].calls++;
}
pnode = node;
});
processResults(functionsStats);
}
function processResults(results) {
//console.log(JSON.stringify(results));
for (var name in results) {
if (results.hasOwnProperty(name)) {
var stats = results[name];
if (stats.declarations === 0) {
console.log('Function', name, 'undeclared');
} else if (stats.declarations > 1) {
console.log('Function', name, 'decalred multiple times');
} else if (stats.calls === 0) {
console.log('Function', name, 'declared but not called');
}
}
}
}
analyzeCode(data);
}
// Read the file and print its contents.
var filename = process.argv[2];
fs.readFile(filename, 'utf8', function(err, data) {
if (err) throw err;
console.log('OK: ' + filename);
notifydeadcode(data);
});
So if you plop that in a file like deadfunc.js and then call it like so:
node deadfunc.js test.js
where test.js contains:
helpers = {
doSomething:function(){ },
doSomethingElse:function(){ }
};
helpers.doSomethingElse();
You will get the output:
OK: test.js
Function doSomething declared but not called
One last thing to note: attempting to find unused variables and functions might be a rabbit hole because you have situations like eval and Functions created from strings. You also have to think about apply and call etc, etc. Which is why, I assume, we don't have this capability in the static analyzers today.

Categories

Resources