Wagtail editor not showing editable fields

Question

I’ve got this odd behavior in my local development wagtail editor page. Some of the fields just aren’t showing. There are no HTTP errors and no HTTP 404s but there are some odd errors in the js console.

The editing experience looks like this:

The javascript errors are like these:

There are no other javascript errors before these.

If I search the DOM in the browser developer tools, I can find all of those in the sources loaded with the page.

I get the same behavior in private/incognito windows and other browsers, new venv with dependencies installed. It works for other devs on my team and on our test environments… and it used to work for me.

This is my local environment and I'm running django/wagtail with runserver, so static assets are being served directly by django. Again, there are no issues with any of the HTTP requests.

Has anybody seen this happen? Any ideas about how to fix it?

Answer 1

I figured this out. I had a wagtailadmin directory in one of my STATICFILES_DIRS and that caused the trouble... Deleting this wagtailadmin directory fixed my problem.

I'm not sure how though.

More details...

I've got something like this in my settings:

STATICFILES_DIRS=('/home/me/src/myproject/static',)

In that directory, I had subdirectories: css, fonts, img, js, and wagtailadmin – note, no other wagtail directories.

In wagtailadmin, there was just a js folder and a two line vendor.js in that folder that has only this:

// comment
var someVar = '';

Seemingly innocuous.

From the screenshot in my question, you'll see that one of the javascript errors I got was for a missing function, createImageChooser. That's defined in the wagtail file image-chooser.js. In the HTTP requests when loading this Wagtail page editor, I see this:

127.0.0.1 - - [21/Sep/2022 21:44:21] "GET /static/wagtailimages/js/image-chooser.js?v=37cf5d14 HTTP/1.0" 200 -

Note that:

• This returned HTTP 200
• The file is requested under /static/wagtailimages and not under /static/wagtailadmin.
• Other static assets loaded fine
• Having the file cached in the browser seems unlikely since I got this same behavior on different browsers and in private/incognito windows.

And yet, the function still wasn't in my page DOM.

My hunch is that there's some logic in code for handling static files in Django or Wagtail which says, roughly, "if there's a custom directory in the app, use assets from that instead of from the default stuff our package provides." But it doesn't explain why all these other files, which certainly weren't under my STATICFILES_DIRS, returned fine.

FWIW, this is on Wagtail 2.15.4