Problem logging message with JSON as additional data

[DirkStorck]

Hi,

I have the following problem. If I log a message witch has a JSON as addition data the message that gets logged isn't formatted correctly anymore.

` ngOnInit(): void { const data = { key1: 'value 1', key2: 'value 2', key3: 'value 2', }; console.log('Data to be logged: ', data);

this.logger.debug('TEST 1 with additional data', data);
this.logger.debug('TEST 2 with additional data', JSON.stringify(data));

this.logger.debug('TEST 3 without additional data');

} `

• In the screenshot you can see the data-json that I use (1,5)
• The message that gets logged if I add the json as additional data (2021.06.09, 11:08:47:738 DEBUG .....) (2,6)
• The message that gets logged if I first use JSON.stringify(data)) (3,7)
• A message without additional data, what I would expect the message with JSON as data would look like as well. (4, 8)

To use JSON.stringify(data)) would be a work around but not the need to use this would be better.

Hope you can help me.

Thank you!

[bmtheo]

Hello,

Can you do these things and tell me if you have anything different

• What NGXLogger version are you using ? (please update if not last version)
• Do you have the same behavior in a browser ?
• Do you have anything special in Logger config ?

If nothing helped you out, please give me a repro so that I can investigate Because I tried it (see here https://stackblitz.com/edit/angular-ivy-uhbmq4?file=src/app/hello.component.ts) but the log works fine there

[DirkStorck]

Hi,

thanks for your answer.

1) I am using: "ngx-logger": "^4.3.3", "engines": { "node": "^14.16.1" }, "dependencies": { "@angular/animations": "12.0.3", "@angular/cdk": "^12.0.3", "@angular/common": "12.0.3", "@angular/compiler": "12.0.3", "@angular/core": "12.0.3", "@angular/flex-layout": "^12.0.0-beta.34", "@angular/forms": "12.0.3", "@angular/material": "^12.0.3", "@angular/platform-browser": "12.0.3", "@angular/platform-browser-dynamic": "12.0.3", "@angular/router": "12.0.3", "@babel/core": "^7.14.3", "@dsa/design-system-angular": "^13.0.0", "@js-joda/core": "^3.2.0", "@js-joda/timezone": "^2.5.0", "@juggle/resize-observer": "^3.3.1", "@types/resize-observer-browser": "^0.1.5", "angular-oauth2-oidc": "10.0.0", "apexcharts": "^3.27.1", "jwt-decode": "^3.1.2", "material-design-icons": "^3.0.1", "ng-apexcharts": "^1.5.12", "ngx-device-detector": "^2.1.1", "npm": "^7.22.0", "ngx-logger": "^4.3.3", "rxjs": "^6.6.7", "tslib": "2.0.3", "uuid": "^8.3.2", "zone.js": "~0.11.4" },

2) In the browser console it seams to be fine

3) This is the config that I use: LoggerModule.forRoot({ // serverLoggingUrl: '/api/logs', level: NgxLoggerLevel.DEBUG, serverLogLevel: NgxLoggerLevel.OFF, timestampFormat: 'yyyy.dd.MM, h:mm:ss:SSS', enableSourceMaps: true, }),

Maybe I do something wrong but i your example I can't see the log message in the console.

Thank you!

[DirkStorck]

I did a little testing:

It looks like that console.log() has problems with additional data.....or the debug-console of "Visual Studio Code"

[bmtheo]

Ok I think it has something to do with Visual Studio Code because it works in your browser V5 should be out soon (I'm waiting for last review) and most of the code is changed, so it will probably fix this issue too I'll ping you here when this is ready

PS : To see logs correctly in stackblitz you need to use the project URL (https://angular-ivy-uhbmq4.stackblitz.io/)

[DirkStorck]

Hi, ah ok. Thanks for the information and for your help and thanks for keeping me updated about V5. I can live with that till V5 comes out....do you maybe know an addon for VSC that show the browser console? Googleing around a read somewhere that debug console of VSC only supports a small amount of styling functions for a log message.

Thanks and have a nice day.

[bmtheo]

Hello again Just for information the v5 is out just now :)

From what I remember your issue is only linked to VSCode so it might not fix it, but it's worth a try

Sadly I don't know about such addon for VSCode

[DirkStorck]

Hi, Thank you for the information. My Problem with the VSC console still exists but in the browser console is everything fine. Would be nice if the VSC debug console would support it as well.

[bmtheo]

yes indeed, closing this one because we can't do anything about VSC console