Django 1.11 JavaScript catalog not translating text in JavaScript files

I have followed these Django translation docs https://docs.djangoproject.com/en/1.11/topics/i18n/translation/#internationalization-in-javascript-code but can't seem to get translations working in JavaScript files.

Here is the code I have added:

In urls.py

urlpatterns = i18n_patterns(
    ....,
    ....,
    url(r"^jsi18n/$", JavaScriptCatalog.as_view(), name="javascript-catalog"),
)

In my base templates:

<script type="text/javascript" src="{% url 'javascript-catalog' %}"></script>

In the js file that contains a translation:

$(document).ready(function() {
    console.log(gettext('Error: No help available!'));
});

I'm testing it out with this in my djangojs.po file for the 'de' locale:

msgid "Error: No help available!"
msgstr "THIS IS GERMAN YO"

I've run these commands:

manage.py makemessages -d djangojs
manage.py compilemessages

But when viewing the German page I get the fallback text (which is in English).