Cbdebugger Not Loading CSS File

Description

I installed cbdebugger using Commandbox and copied over the default configuration from Github to my Coldbox config file. I had to change the cborm and qb settings to false from the defaults.

I can see the cbdebugger content at the bottom of the page, however, it fails to load the CSS file so the debugger code is difficult to read. I can see in the HTML source it attempts to load the following after the `</html>` tag:

`<link href="/modules/cbdebugger/includes/css/app.css" rel="stylesheet">`
However, I can see in the /modules/cbdebugger/includes/css folder that the app.css has a hash appended to it and it’s actually named: App.7fb451c0e55f9b8eaa70.css

Here’s my full cbdebugger config for reference:



I suspect this issue has something to do with this app also using Elixir so it's having a hard time generating the proper cbdebugger css path from the manifest file.

Workaround:
If I manually rename App.7fb451c0e55f9b8eaa70.css to App.css everything works as far as I can tell. It looks like cbdebugger was able to load the js files okay, but not the CSS so maybe something is going on with elixirPath().

It looks like on the ortus community another user experienced this problem as well. Let me know if you need some help troubleshooting. I'm happy to be a guinea pig.

Activity

Show:

Luis MajanoJuly 8, 2021 at 12:23 AM

Small changes for consistency on the PR, but everything looks great!

David LevinJuly 7, 2021 at 5:11 PM

I created a pull request which should hopefully work around the issue. I saw on the Ortus community another user had a problem with App.js so I also renamed App.js to Cbdebugger.js to keep things consistent. Perhaps this is actually an issue in the function elixirPath() because it should be able to map different css/js files even if they have the same filename (just a theory at this point).

I still get issues testing with ACF due to but I was able to get this working on Lucee just fine after renaming the files.

David LevinJuly 7, 2021 at 4:53 PM

confirmed. Renaming CBdebugger’s css file from app.[hash].css to cbdebugger.[hash].css and updating the reference in head.cfm fixes the issue on Lucee. I couldn’t test on ACF due to but I assume it should be fixed there too.

Luis MajanoJuly 2, 2021 at 4:06 PM

Yea, I am not sure how this would cause issues, since it’s supposed to look at the module manifest itself. It might be an issue where the app.css is the conflict. Maybe we need to rename the debugger’s css file to cbdebugger Can you check that?

Fixed
Pinned fields
Click on the next to a field label to start pinning.

Details

Assignee

Reporter

Fix versions

Priority

Sentry

Created June 30, 2021 at 9:32 PM
Updated April 21, 2022 at 9:50 PM
Resolved April 21, 2022 at 9:50 PM