magnal / cnsl Goto Github PK

The more cnsl is used within an application, the more logs are shown in the browser console. To have the ability to only show logs for specific parts of the application.

The scope could be added for each cnsl call or per file/class.

cnsl(CnslScopes.ANY_SCOPE).log(...);
cnsl(CnslScopes.ANY_SCOPE).log(...);
// or
cnsl = cnsl(CnslScopes.ANY_SCOPE);
cnsl.log(...);
cnsl.log(...);

This scope (or array of scopes) could be shown in the console to have the ability to filter it. Next step could be a api to only activate specific scopes.

When cnsl is used, the information about the caller file and line number looks like this...

It is not shown which file called the log message. According to this SO answer it should be possible to correct this behavior:
https://stackoverflow.com/questions/13815640/a-proper-wrapper-for-console-log-with-correct-line-number/32928812#32928812

Due to the buffered logs we lost the ability to have groups in groups. Console api supports groups in groups, which is a nice feature. It should be supported from cnsl as well.

@cnslClass() // tracks instances of classes (limit of # of instances can be passed, shows warn and error if limit is reached)
export class SampleClass
{
  @cnsl()
  private cnsl:Cnsl;

  constructor()
  {
    // scoped cnsl
    this.cnsl;
    // global cnsl
    cnsl;

    // create scoped cnsl manually
    let anotherScopeCnsl:Cnsl = cnsl.scoped();
  }

  @cnslMethod() // tracks params and return values, counts number of runs, show warn and error when limit is reached
  public anyMethod(param:string, @cnslGroup('') cnsl:Cnsl):string
  {
    this.cnsl.group((cnsl:Cnsl) =>
    {

    });

    cnsl.group((cnsl:Cnsl) => {
      cnsl;
    });
  }
}

cnsl is setting up cnsl instance with the scope of the current class.

cnslGroup is setting up a cnsl group instance with the scope of the current class and method (group opens on method start and closes on method end).

cnslClass is tracking instances of the class.

cnslMethod is tracking calls of the method.

What I have in mind is something like this:

cnsl.group('This is my group name', (cnsl:Cnsl) => 
{
  cnsl.debug('Grouped debug log');
});

Group creation and completion is done automatically, it's easier to use and it looks nicer.

Update:
Additionally, the api could be changed to enable collapsed groups via a flag or config object:

cnsl.group('This is my group name', true, (cnsl:Cnsl) => 
{
  cnsl.debug('Grouped debug log');
});

// or

cnsl.group('This is my group name', {collapsed: true}, (cnsl:Cnsl) => 
{
  cnsl.debug('Grouped debug log');
});

By adding a lambda function as a additional parameter to group/groupCollapsed, we could add handling for wrapped console groups.

class Foo {
  myBar() {
    cnsl.group('This is my group', (cnsl:Cnsl) => {
      ...
      cnsl.log();
      ...
    });
  }
}

Needed?