Customizer UI not updating CSS.

[rwmech]

Description

When using the following code in the advanced section. "Preview" works fine and updates things but a page refresh does not update the CSS.

#navbar>div>div>a.brand>span:after { content: " - X301 #2"; color: yellow; }

Plugins installed

• HomeAssistant Discovery[homeassistant] v3.6.1
• MQTT[mqtt] v0.8.12
• UI Customizer[uicustomizer] v0.1.8.9

UI Customizer settings

• addWebCamZoom: true
• centerTopIcons: true
• compactMenu: true
• compressTempControls: true
• disableTermInactive: false
• filesFullHeight: true
• fixedFooter: true
• fixedHeader: true
• fluidLayout: true
• gcodeFullWidth: false
• hideGraphBackground: true
• hideMainCam: false
• mainTabsCustomize: true
• navbarplugintempfix: true
• responsiveMode: true
• saveAccordions: false
• themeLocal: false

Software versions

• OctoPrint 1.7.3
• Python 3.8.10

Browser

• Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.54 Safari/537.36

[LazeMSS]

Strange - that should not happen - what does inspect show?

[rwmech]

I thought it was strange too. Inspector is not showing the altered element. I think it could be an order of operations issue or timing issue. Oddly I have one instance that its working on, but two others (both freshly installed) are not working. The one that is working, originally, was not working at all but then after some frequent changes began working. I've been doing development for 3 decades and agree that sounds ridiculous but what's happening. I was using preview on and off (which does not persist between dialog sessions) and magically at one point it stuck. Honestly wish I remembered what I did to get it to fix. :)

Console is showing the following which I noticed today.

http://192.168.0.86:5050/plugin/uicustomizer/static/js/chartist.min.js.map {"error":"The requested URL was not found on the server. If you entered the URL manually please check your spelling and try again."}

Could possibly be something not being generated or a bad install?

[rwmech]

The "working" instance also has this error, so likely unrelated.

[rwmech]

Also just uninstalled and reinstalled. Same issue. Importing settings from working instance went fine but still not displaying. When clicking preview though, it works every time. Just doesnt survive a refresh/reload.

[LazeMSS]

The map file is just for the console debug.

I will try more.

[rwmech]

Adding to the oddity of this problem. Today I noticed one of the instances has suddenly started working. Could there be something conflicting with the plugin? I hope the rest of these just start working down the road.

[LazeMSS]

Maybe the :after selector is causing some problems. I haven't had the time to test yet.

[rwmech]

I think I figured out what was causing the problem (although there was no indication as to why this caused it).

The primary difference from the working instance to the non-working instance is that the non-working did not have web cams attached. A little further along in my printer bay build I just added a webcam to both instances and both are now working just as they should. Perhaps something in missing webcam causes the DOM or something else to break. Very strange but as soon as i added a web cam to a non working one, presto it works.

You'll probably want to test this yourself but at least for my needs that solved it. Just add a web cam. 🤔

[LazeMSS]

Thanks Will test

[LazeMSS]

Can't reproduce this with or without webcam - closing. I need further information like an inspect screenshot of "#navbar>div>div>a.brand>span" ie: