Needing help with using `devtools` in browser. I know this is off topic for Node-Red

I am asking here so the environment is known. Node-Red.

I have been told many times to use it and am learning/playing with it.

I am very much on my L plates with what it is showing me and what it means.

But I am seeing this if I open devtools and click on console and select CSS.

Expected declaration but found ‘{’. Skipped to next declaration. ui:2:14 Elements matching selector: div.led_

The only thing I can understand is the led_ part.

But does that mean it is the ui.led node causing the problem?

Opening up the tree I just get swamped with stuff that are levels above what I can understand.

For the sake of me trying to learn what is going on, is anyone feeling helpful to help me find what is going on with this?

you have some badly formatted CSS somewhere.

you're possibly gonna have to search the source for div.led_ and look at the source.

check you have no style without a selector e.g...

{ 
  color:red;
}

Ok. Thanks, I think.

So this ui:2:14 part.

I move the mouse over it and it says something about view source style editor (blah blah)

I click on that and select {style} and I see this:

Yes, I selected sheet.

So does the ui:2:14 mean style sheet 2 line 14? Could it be that easy?

If it is (probably not) it is again above my language skill set.

--

Searching the code:
As in export the flow and load it into something and search for dev.led_?

Normally its file:line:column - but I'm not familiar with firefox devtools

no the web source (inspector in your case) - but it might not be in the source, it might be in an include.

file:line:column.....

Wowsers.

Given that is true, what is the file? (line and column too)

I can do it in chrome if you like.

Just did that, and can't find the CSS equivalent to see those errors. :frowning:

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.