Combability issue with django-template-partials in v0.141.2 after removal of ComponentDependencyMiddleware #1323
Description
I use django-components along with django-template-partials and htmx in my project, previously i was using v0.136 and the setup used to work fine. But now after updating to the latest version when i return a template-partial fragment from the view that contains a component, the CSS and JS dependencies are no longer attached to the response. I suspect this is due to the recent removal of ComponentDependencyMiddleware which previously made django-components aware of the components in the response.
I'm not sure if this should be raised here or in the django-template-partials repo, but given this repo is more actively maintained, I thought it might be a good place to start the discussion.
here is the working setup in v0.136 using the sampleproject of the repo:
Install django-template-partials:
pip install django-template-partialsThen add it to INSTALLED_APPS
INSTALLED_APPS = [
"template_partials",
...,
]
Also we need ComponentDependencyMiddleware in the MIDDLEWARE
MIDDLEWARE = [
"django_components.middleware.ComponentDependencyMiddleware",
]
We add calendarapp/templates/calendarapp/partial.html as template partial:
# calendarapp\templates\calendarapp\partial.html
{% load component_tags %}
{% load partials %}
{% partialdef test___partial inline %}
{% component_css_dependencies %}
{% component "calendar" date=date / %}
{% component_js_dependencies %}
{% endpartialdef %}We also change calendar.html as well to work with htmx:
# calendarapp\templates\calendarapp\calendar.html
<!DOCTYPE html>
<html>
<head>
<title>django_components sample projects</title>
</head>
<body>
<button type="button" hx-get="/" hx-trigger="click" hx-target="#calendar-content">
Load Calendar
</button>
<div id="calendar-content"></div>
</body>
<script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.6/dist/htmx.min.js"></script>
</html>
And we need to make some changes to calendar view as well:
def calendar(request):
if request.headers.get('HX-Request') == 'true':
template = "calendarapp/partial.html#test___partial"
else:
template = "calendarapp/calendar.html"
context = {
"date": datetime.today(),
}
return render(
request,
template,
context,
)which basically means if the request was made using htmx, return the template-partial fragment.
and now when we go to http://localhost:8000/ and click the button, the calendar component would load and works as expected.
After upgrading to django-components v0.141.2 (where ComponentDependencyMiddleware is removed), the CSS and JS assets are no longer included in the response when returning just the fragment (#test___partial).
Although in the view if we return calendarapp/partial.html instead of calendarapp/partial.html#test___partial for the htmx requests, it works fine and the dependencies are included, but that defeats the purpose of using django-template-partials to isolate inline fragments and avoid repetition.
I saw the HTML Fragments section in the docs regarding the deps_strategy, but to my understanding, that applies when rendering the component directly — not when using {% component %} tag inside a partial template. So I wasn’t able to apply that strategy to this case.
If anyone else has faced this issue or knows a workaround with the latest version, I’d appreciate your insights.