Why is my test failing on swapping to self.live_server_url() in Django?

Question

so I'm doing a django calendar project with some TDD and running into an odd issue. I made a functional test using selenium that walks through logging in, adding an event to a calender and logging out. I had the test passing mostly but noticed I was adding items to my own database and figured I should use the LiveServerTestCase to avoid this. So I had the test inherit that and replaced self.browser.get('http://localhost:8000') with self.browser.get(self.live_server_url). The problem is that now the functional test fails part way through.

This is the error that comes up: selenium.common.exceptions.ElementNotInteractableException: Message: Element <input id="id_title" class="event_name" name="title" type="text"> is not reachable by keyboard. This is happening because when a button is clicked, the JavaScript function I wrote doesn't change the form from style="visibility: hidden;" to style="visibility: visible;"

I've confirmed in git the only line I'm changing is swapping from self.browser.get('http://localhost:8000') to self.browser.get(self.live_server_url). Why would swapping to the live server url cause this issue? Are there other ways I can delete objects after running the test? Any help is appreciated.

Edit: For some reason the JS isn't defined when using the LiveServer. Inspecting during the test and going to the console confirmed this.

Answer 1

According to https://docs.djangoproject.com/en/4.0/howto/static-files/ under 'Testing': The base LiveServerTestCase from django.test is unable to use static files(not quite but paraphrasing). Using StaticLiveServerTestCase from django.contrib.staticfiles.testing solved my issue.