localStorage variables not working - maybe it's me

[svenmarley]

I'm new to React, so it might-be/probably-is me. But, I can't get the localStorage variables to work in my app like they do in the tutorial. The URL variable does work.

I set the Application -> Local Storage -> {local url}
key | value
log | warn; app:re*=all

My loggers are named app:render, app:discover, app:updateFile.

I only want the app:render logs to show everything.

It also does not see the log_format localStorage entry either. So, I'm wondering if this feature just hasn't been completed yet. Or do I have something set wrong?

I can get to the localStorage.getItem( 'log' ) from inside my app just fine - it returns whatever is in there.

Hopefully, it's something simple I'm missing.

[Download]

Do you have something that I can check or is it not possible to share?
What version are you? So you tried the tutorial but there it works?
You have a React app you say? Are you bundling with Webpack?
How are you creating your loggers? Using anylogger(name)' or ulog(name)`? Lots of questions 😄

I am currently not aware of any issues that would explain what you are seeing but it's definitely possible there are issues. I am currently using beta 18 in another hobby project of mine but that's it so it still needs some more time to find them all. So this definitely could be an issue with ulog but I need more info before \I can act on this. Can you try isolating it maybe? Maybe create very small app by copying your app and ripping out most of the code / pages and only leave a single page that exhibits the problem?

Also one thing to check: in the devtools do you see one localstorage area or multiple? I know on some sites like e.g. codepen they will load scripts in an iframe and that iframe gets it's own localstorage which can be very confusing.

How do you set the localStorage variables? Have you tried localStorage.set('log', 'warn; app:re*=all')
Another thing to try: what happens if you ulog.set the variables? Try e.g. ulog.set('level', 'warn; app:re*=all')
Let me know of your findings. I think we will need to do some debugging together..

[Download]

Also, I'm interested in how you are loading ulog. Do you use the script or do you build it yourself with Webpack? And how do you import it? You should import ulog in your entrypoint before creating loggers using ``anylogger(name)soulog` can intercept those calls.

[svenmarley]

I appreciate your quick feedback. I got distracted into other life things,_ so that's the reason for the delay.

I don't know what changed, but it is all working great now. I think it was the realization that the log entries are all lowercase for the loggername, so my App:updateFIle required a log entry like warn:app:updatef*=all for it to turn on. (hell, even in writing this I got it wrong 3 times, typing it like the function is in the code)

Appreciate your response, and the cool library.

[Download]

@svenmarley No problem! I'm also sometimes slow to respond. We all have lives right?

About your remark that 'the log entries are all lowercase for the loggername', can you elaborate? Are you saying that if you create a logger with anylogger('App:updateFile') you would have to set the key log to warn;app:updatef*=all for it to work? Because that shouldn't be the case. I expect the casing of loggernames to be preserved and that the names used in the config should use equal casing to the names used in logger creation. So if you create a logger using anylogger('App:updateFile') I would expect the log key warn;App:updateF*=all to work. If this is not the case, can you let me know.

Thanks for trying ulog and do come back here if you have any feedback criticism. I appreciate your input!

[svenmarley]

I just confirmed that the log= entry is case sensitive. i.e.
log=error;search:findb*=debug = no log messages
log=error;Search:findB*=debug = log messages

[reinhard]

Maybe it's the same problem: since 2.0.0-beta.15 window.localStorage.setItem('log', 'all') has no effect. After downgrading to beta.14, debug logs show up again.

[Download]

@reinhard Can you try this in the ulog tutorial and report if it works there for you? It works as expected for me

Are you using ulog in a React app? Can you tell me how you are loading ulog? It could be that lazy-loading is interfering somehow here.

[reinhard]

@Download I've created a simple demo based on create-react-app
see https://github.com/reinhard/ulog-issue-50

Hope that helps!

[Download]

That certainly helps!

Will investigate this. Sorry for the inconvenience but that's why it's still beta... I need this kind of feedback to get everything working right in all contexts. So thank you very much for contributing with reports like this! Will let you know when I reproduce and finally fix this. May take some time though as I just accepted a new job...

[Download]

@reinhard Oh, I see you import 'ulog' in the entry point.
That should work... But as a workaround you might try import 'ulog/full'. That should not be needed but it might work.
I have been messing around with this a few betas now. Problem is that it's hard to test before actually publishing...
EDIT: No scrap that.... I removed ulog/full. Sorry. I badly want to get this right. Give me some time, will get back to you.

[svenmarley]

Note also - you can easily replicate the case sensitivity here as well.

1. Set log to "info; My*=debug" - only info and errors come out
2. Set log to "info; my*=debug" - and all error types come out

This shows that the value must be case sensitive to the name of the channel.

[Download]

@svenmarley Yes, that is expected behavior

[Download]

@reinhard
Mmm so I guess the problem is that the log statements that are in function App don't respect the settings?
I notice that the log calls that happen when I press the button do work as expected.
Maybe it is a timing issue. Thanks for this repro!

[Download]

@reinhard I confirmed your issue and split it off into #56
I will try to fix this for the next beta.
Thank you for the detailed repro! This is exactly the kind of feedback I need to make sure that v2 will work for everyone everywhere.