Comments don't show up when loaded over JavaScript

[PetrDlouhy]

I have followed up the tutorial at: https://django-comments-xtd.readthedocs.io/en/latest/tutorial.html#javascript-plugin
I created the page almost exact as in the example, but I am still not able to see the comments on the page. It looks like this:

(no comments at the bottom)

I am getting this error in the debug console of Chrome browser:

plugin-2.9.3.js:formatted:1339 Uncaught TypeError: Invalid attempt to iterate non-iterable instance.
In order to be iterable, non-array objects must have a [Symbol.iterator]() method.
    at M (plugin-2.9.3.js:formatted:1339)
    at s.value (plugin-2.9.3.js:formatted:1591)
    at s.<anonymous> (plugin-2.9.3.js:formatted:1643)
    at u (jquery-3.3.1.min.js:formatted:1286)
    at Object.fireWith [as resolveWith] (jquery-3.3.1.min.js:formatted:1339)
    at k (jquery-3.3.1.min.js:formatted:3723)
    at XMLHttpRequest.<anonymous> (jquery-3.3.1.min.js:formatted:3840)

[PetrDlouhy]

I was able to figure out, what is the problem. I have set DEFAULT_PAGINATION_CLASS in my project to:

'DEFAULT_PAGINATION_CLASS': 'rest_framework.pagination.PageNumberPagination',

If I comment it out, but I am still getting following error:

plugin-2.9.0.js:formatted:2 Uncaught TypeError: Cannot read properties of undefined (reading 'push')
    at s.value (plugin-2.9.0.js:formatted:2)
    at s.<anonymous> (plugin-2.9.0.js:formatted:2)
    at u (jquery-3.3.1.min.js:2)
    at Object.fireWith [as resolveWith] (jquery-3.3.1.min.js:2)
    at k (jquery-3.3.1.min.js:2)
    at XMLHttpRequest.<anonymous> (jquery-3.3.1.min.js:2)
value @ plugin-2.9.0.js:formatted:2
(anonymous) @ plugin-2.9.0.js:formatted:2
u @ jquery-3.3.1.min.js:2
fireWith @ jquery-3.3.1.min.js:2
k @ jquery-3.3.1.min.js:2
(anonymous) @ jquery-3.3.1.min.js:2
load (async)
send @ jquery-3.3.1.min.js:2
ajax @ jquery-3.3.1.min.js:2
value @ plugin-2.9.0.js:formatted:2
value @ plugin-2.9.0.js:formatted:2
oj @ react-dom.production.min.js:127
Aj @ react-dom.production.min.js:160
unstable_runWithPriority @ react.production.min.js:25
Da @ react-dom.production.min.js:60
ab @ react-dom.production.min.js:154
Te @ react-dom.production.min.js:146
Ja @ react-dom.production.min.js:224
md @ react-dom.production.min.js:173
(anonymous) @ react-dom.production.min.js:175
Rh @ react-dom.production.min.js:147
nd @ react-dom.production.min.js:175
I.render @ react-dom.production.min.js:238
(anonymous) @ plugin-2.9.0.js:formatted:2
s @ plugin-2.9.0.js:formatted:2
r @ plugin-2.9.0.js:formatted:2
(anonymous) @ plugin-2.9.0.js:formatted:2
(anonymous) @ plugin-2.9.0.js:formatted:2

So I need to investigate more.

[danirus]

Hi @PetrDlouhy, the plugin version has to match the version you have installed of django-comments-xtd.
If you installed django-comments-xtd 2.9.3 (which is available since yesterday), then verify that your template is loading that version of the plugin:

<script src="{% static 'django_comments_xtd/js/vendor~plugin-2.9.3.js' %}"></script>
<script src="{% static 'django_comments_xtd/js/plugin-2.9.3.js' %}"></script>

Please, let me know if you get it fixed.

[PetrDlouhy]

@danirus That was not the problem. Now I figured out the second error. I had also 'djangorestframework_camel_case2.parser.CamelCaseJSONParser' in DEFAULT_PARSER_CLASSES and DEFAULT_RENDERER_CLASSES set in REST_FRAMEWORK settings.

Now it works perfectly.
I will just have to figure out how to use these classes on my API and not on comments API.

I am thinking how to prevent other users from bumping into this, because it the errors displayed were quite cryptic for me.
Maybe we could add some warning into documentation or even set the RENDER_CLASSES, PARSER_CLASSES, PAGINATION_CLASS and even AUTHENTICATION_CLASSES explicitly for django-comments-xtd's DRF views.

But maybe this issue alone might be enough for others to find what is the cause.