npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

@alu0101434025/espree-logging-solution

v0.4.1

Published

Adds logs to javascript code

Readme

Open in Codespaces

Práctica Espree logging

Resumen de lo aprendido

...

Indicar los valores de los argumentos

Se ha modificado el código de logging-espree.js para que el log también indique los valores de los argumentos que se pasaron a la función. Ejemplo:

function foo(a, b) {
  var x = 'blah';
  var y = (function (z) {
    return z+3;
  })(2);
}
foo(1, 'wut', 3);
function foo(a, b) {
    console.log(`Entering foo(${ a }, ${ b })`);
    var x = 'blah';
    var y = function (z) {
        console.log(`Entering <anonymous function>(${ z })`);
        return z + 3;
    }(2);
}
foo(1, 'wut', 3);

CLI con Commander.js

Opciones en línea de comandos (-o, -V, -h, etc.)

opciones

Reto 1: Soportar funciones flecha

Para poder soportar las funciones flecha se ha modificado el código de logging-espree.js para que el log también indique los valores de los argumentos que se pasaron a la función. Lo que se ha hecho es añadir un nuevo tipo de nodo ArrowFunctionExpression al la condición del if que comprueba si el nodo es una función.

export function addLogging(code) {
  const ast = espree.parse(code, { ecmaVersion: 6, loc: true });
  estraverse.traverse(ast, {
    enter: function(node, parent) {
      if (node.type === 'FunctionDeclaration' ||
          node.type === 'FunctionExpression' || 
          node.type === 'ArrowFunctionExpression') {
        addBeforeCode(node);
      }
    }
  });
  return escodegen.generate(ast);
}

Reto 2: Añadir el número de línea

Para poder añadir el numero de linea se ha modificado el codigo de logging-espree.js modificando la función addBeforeCode para que añada el numero de linea al log. También se ha modificado la función addAfterCode activando el flag loc de espree.parse para que se añada la información de la linea al nodo y selectccionando la versión 6 de ecmaVersion para que se soporte la sintaxis de las las comillas invertidas.

function addBeforeCode(node) {
  const name = node.id ? node.id.name : '<anonymous function>';
  const params = node.params.map(p => '${ ' +  p.name + ' }').join(', ');
  const beforeCode = 'console.log(\`Entering ' + name + '(' + params + ') at line ' + node.loc.start.line + '\`);';
  const beforeNodes = espree.parse(beforeCode, { ecmaVersion: 6 }).body;
  node.body.body = beforeNodes.concat(node.body.body);
}

Tests and Covering

Tests

Contamos con 4 tests para comprobar que el código funciona correctamente. El ultimo de ellos utilizando las funciones desarrolladas para la práctica anterior.

export default [
  {
    input: 'test1.js',
    output: 'logged1.js',
    correctLogged: 'correct-logged1.js',
    correctOut: 'logged-out1.txt'
  },
  {
    input: 'test2.js',
    output: 'logged2.js',
    correctLogged: 'correct-logged2.js',
    correctOut: 'logged-out2.txt'
  },
  {
    input: 'test3.js',
    output: 'logged3.js',
    correctLogged: 'correct-logged3.js',
    correctOut: 'logged-out3.txt'
  },
  {
    input: 'test4.js',
    output: 'logged4.js',
    correctLogged: 'correct-logged4.js',
    correctOut: 'logged-out4.txt'
  },
]

El contenido del fichero logged-out4.txt es el siguiente ya que la función factorial es recursiva y se llama a si misma 5 veces.

Entering factorial(5) at line 1
Entering factorial(4) at line 1
Entering factorial(3) at line 1
Entering factorial(2) at line 1
Entering factorial(1) at line 1
Entering factorial(0) at line 1
Entering pow(2, 3) at line 7

Los tests se ejecutan con el comando npm run test y se puede ver el resultado en la siguiente imagen.

tests

Para poder realizar las proebas se a añadido al fichero test.mjs el siguiente código.

for (let i = 0; i < Test.length; i++) {
  it ('Test ' + i, async function () {
    const t = Test[i];
    await transpile(t.input, t.output);
    const correctLogged = await fs.readFile(t.correctLogged, 'utf-8');
    assert.equal(removeSpaces(correctLogged), removeSpaces(await fs.readFile(t.output, 'utf-8')));

    let outputs = [];
    let oldLog = console.log;
    console.log =
        function(...args) {
      outputs.push(args.join(' '));
    }

    await import(t.output);
    console.log = oldLog;
    const correctOut = await fs.readFile(t.correctOut, 'utf-8');
    assert.equal(removeSpaces(outputs.join('\n')), removeSpaces(correctOut));
  });
}

Con el for se recorrer los objetos de Test y se ejecutan los tests. En el it se ejecutan las pruebas. Primero se transpila el código de entrada y se comprueba que el código transpilado es igual al código correcto. Después se ejecuta se sobreescribe la función console.log para que guarde los logs en un array y se ejecuta el código transpilado. Por último se comprueba que los logs son iguales a los logs correctos.

Covering

Para comprobar el covering se ha utilizado el comando npm run cov y se puede ver el resultado en la siguiente imagen.

covering

Existe una incompatibilidad con nyc que causa que no se muestre el covering de los ficheros test.mjs y logging-espree.mjs.

Script de ejecución

Para poder ejecutar tanto los tests como el cubrimiento se a añadido al fichero package.json el siguiente código.

    "scripts": {
        "test": "mocha test/test.mjs",
        "cov": "nyc npm run test"
    },

Publicación en npm

Primero es necesario configurar npm introducioendo los siguientes comandos en la terminal.

npm config set init-author-name "nombre"
npm config set init-author-email "correo"
npm config set init-author-url "url"

Luego se crea una cuenta en npm y nos conectamos con el comando npm login.

Ahora modificamos el package.json para que tenga la siguiente estructura.

  "name": "@aluxxxxxxxxxx/directorio",
  "version": "1.0.0",

Donde @aluxxxxxxxxxx es nuestro nombre de usuario en npm y directorio es el nombre del directorio donde se encuentra el código.

Para publicar el paquete en npm se ejecuta el comando npm publish --access public.

Siempre que se quiera actualizar el paquete se debe cambiar la versión en el package.json y ejecutar el comando npm publish --access public.

npm