Closed pimago closed 2 years ago
Hmm, I've never seen the 414 error with either plugin. I'm wondering if you might be able to provide a simplified setup for me to test - just so we're on the same page with what you're doing.
comments.html
{{ sprig('_component/_comments', {
show: false,
}) }}
_component/_comments.html
<div id="entry">
{% set show = show ?? false %}
{% if show %}
{{ craft.comments.render(2460) }}
{% endif %}
</div>
<button sprig s-replace="#entry" s-val:show="true">Load entry</button>
<button sprig s-replace="#entry" s-val:show="">Remove entry</button>
This entry for example contains about 100 comments, and renders slowly, but fine.
Based off how Sprig works, it sounds like your call to the render function might contain too many variables? For instance, you can inspect this is the Network tab of web developer tools (in Chrome). It'd be worth having a look at your failed requests to see what the Request URL is. Mine for example is:
Request URL: https://craft.test/index.php/actions/sprig-core/components/render?show=true&sprig%3AsiteId=725fa621c72565e2111babb2acab065cccafdc83d4cf148f4951c22520e4d2711&sprig%3Atemplate=84439641259fe023b4b40b89696463d08e75f1c770edd4dceb687d5adb498b4fsprig%2F_comments-component&sprig%3Avariables%5Bshow%5D=443d514fa677e3b659c248747f8430abbcbced141188c7577f833f895ec9419b
Yes this is similar to what I have.
{#-- main --#}
<main>
{{ sprig('_components/entryList') }}
{{ sprig('_components/entryOverlay', {}, {
'id': 'entryOverlay',
}) }}
</main>
{#-- _components/entryList --#}
{% set entries = craft.entries.section('mySeciton').offset(offset).limit(limit).all() %}
{% for entry in entries %}
<a onclick="htmx.find('#entryOverlay input[name=entryId]').value = {{ entry.id }}; htmx.trigger('#entryOverlay', 'refresh');">
{{ entry.title }}
</a>
{# limit and offset updated with a revealed s-trigger #}
{% endfor %}
{#-- _components/entryOverlay --#}
{% set entryId = entryId ?? false %}
{{ hiddenInput('entryId', entryId) }}
{% set entry = craft.entries.id(entryId).one() %}
{% if entry %}
<button sprig s-val:entryid="" >×</button>
{{ include('_components/entryContent.twig') }}
{% endif %}
{#-- _components/entryContent --#}
<div>
{{entry.title}}
{% if entry.allowComments.commentEnabled %}
{{ craft.comments.render(entry.id, {'orderBy': 'commentDate'}) }}
{% endif %}
</div>
I didn't use s-replace. So I tried that, but it didn't help. And yes the network tab has a huge URL with many vars. I guess for each comment I have in that entry? And I just found out it only happens when a user is logged in.
Right, so I can definitely replicate that with your setup. Instead of using a form input, can you use s-val
to pass your variable around your components?
What I see happening here is every single reply <form>
element being part of the Sprig set of variables submitted to that controller. Where really, you just want your set of data, not everything the Comments plugin renders as inputs.
It's a little easier to decipher here:
entryId: 2460
action: comments/comments/save
elementId: 2460
siteId: 1
newParentId:
commentId:
CRAFT_CSRF_TOKEN: APj6J7fikhdBZvfi89KbJGIjg7i-RHAfq7zGSXVpGb3nfA9cfgyHchsUb54NEigJ_R5JDkoJjv3bX_wJ8C1rLIkyFpoV9t2gQc0avu2J6fJEcvb_VjO2SEoyenhqy2qziSxyGd37u-bATiylCwEILEoXzF7RuEMU1RYAA5iUtf_15MAcwrPHAqRUU1VQdyvuz4zeYZyAc_yH424DHJ-VnJTcURh7ztHZHSBr7oiOHzkTKcmgLFw3E0btEWciCq07dx5qz3h-anowuMq4OplqxRxeHbkFIfsiwumQd_oiitvsiJMlE8ScMwDQfC4LTRpb-VrX7RVALOnJ2oXwL0jfX0ptXTNVtjam1wVToGxYTvHz7K-BofRUlP-9MtATAwY7GmGErPDv
__UAHOME: 990c229d6b920c52338ac49189d6c08a
__UAHASH: 9773051f408d0fc2a264266389a2f810
beesknees:
__JSCHK: 62441a6e49bf8
fields[name]:
fields[email]:
fields[comment]:
fields[plainText]:
sprig:siteId: 725fa621c72565e2111babb2acab065cccafdc83d4cf148f4951c22520e4d2711
sprig:template: 540d7a73000a3354ab401ff343c3f3d67ac5f26364f633ab9c21e1c1dd3e67adsprig/entryOverlay
Which shows that the payload going to the Sprig render controller is containing the fields in the comment form, as well as the sprig options. But multiply that by every comment on the entry, each containing a reply form, and it gets way out of hand. The reason for this being an issue when logged in would be the reply form would only be generated if you're logged in and can comment on other comments.
I suppose we might need to rope in @bencroker for his expertise, whether we can mark anything as excluded s-disable
doesn't seem to work.
Assuming the comment input field values are irrelevant, you can prevent them from being submitted using the s-include
attribute (see hx-include).
<button sprig s-val:entryid="" s-include="">×</button>
Ah yes that makes sense. I tried it with s-val first but I couldn't make it work. So I asked Ben and he suggested the input field. But I didn't mention comment in my initial question.
You're fast Ben :D
Yes s-include="" works. Thanks a lot guys!
Looks like that's the ticket @bencroker - legend.
Description
Hi, are there any known issues in combination with Sprig? I have a Sprig component that loads an entry with comments. And a button that removes that entry. It's all working fine unless the entry some comments. Then I get a 414 error. It looks like it's multiplying entry csfr many times. There is no sprig directly used on comments. I tried turning off the comments. I keep on getting this 414 error after a certain amount of comments. Any idea what the reason for this could be?
Additional info