How do you make all of the Django app locale/<lang>/django.po translations accessible from Javascript so you can dynamically translate text in Javascript widgets?
According to these docs you need to add a URL pattern to your urls.py like:
urlpatterns += i18n_patterns(
path("jsi18n/", JavaScriptCatalog.as_view(packages=['myapp1', 'myapp2', ....]), name="javascript-catalog"),
and then in your base template's <head> add the includes:
<script type="text/javascript" src="{% url 'admin:jsi18n' %}"></script>
<script type="text/javascript" src="{% url 'javascript-catalog' %}"></script>
I've done this, and I have Japanese locale/ja/django.po (and their compiled .mo) files for every app in my project.
However, when I access the URLs generated by {% url 'admin:jsi18n' %} (/admin/jsi18n/) and {% url 'javascript-catalog' %} (/ja/jsi18n/) it doesn't contain any of my custom translations.
Why is this? What step in the docs am I missing preventing my translations from being accessible in the Javascript catalog?
Turns out Django uses different default domains for it's server side translations ("django") and it's client side translations ("djangojs").
To fix this, I had to explicitly make the JavascriptCatalog use the same domain as the server side. e.g.