Confusing behavior with accept/decline buttons

[sundayz-hunter]

Hi,

I've been trying to use this project and spent the whole day debugging the behavior of the cookie banner, but I'm still stuck.

Here’s what I’m seeing:

When I click "Accept" on the cookie banner, the resulting cookie is empty.

When I click "Decline", I get something like:
"analytics=-1|performance=-1"

From the docs, I expected the "Accept" button to set all consent groups to 1 (accepted), and the "Decline" to set them to -1 (refused), but it’s not behaving that way.

Also, the documentation is really unclear on how this consent logic is supposed to work, especially:

how groups are defined and handled in the frontend,

Additionally, I noticed there's a package on npm, but trying to import it in a modern frontend setup (like Vite) does not work. The script doesn't export anything usable as a module, and trying to import it in main.js leads to runtime issues.

Could you clarify how this is supposed to work?

Thanks in advance!

[sundayz-hunter]

After a closer look, the requests are being made to the server, and I realize that in the database in cookie_consent_ logitem the modifications are being made.
It's in the browser that nothing is recorded.

[sundayz-hunter]

Is there something I'm doing wrong here in my base.html ?

{% all_cookie_groups 'cookie-consent__cookie-groups' %}

{% static "cookie_consent/cookiebar.module.js" as cookiebar_src %}

<template id="cookie-consent__cookie-bar">
    <div class="fixed bottom-4 left-4 right-4 z-50 max-w-3xl mx-auto bg-base-100 shadow-xl rounded-box p-4 border border-base-300 flex flex-col md:flex-row md:items-center justify-between gap-4">
        <div class="text-sm">
            This site uses cookies for better performance and user experience.
            Do you agree to use these cookies?
        </div>
        <div class="flex gap-2 flex-wrap justify-end">
            <button type="button" class="cookie-consent__accept btn btn-primary btn-sm">Accept</button>
            <button type="button" class="cookie-consent__decline btn btn-outline btn-sm">Decline</button>
            <a href="{% url 'cookies_policy' %}" class="link link-hover text-sm">Cookies info</a>
        </div>
    </div>
</template>

{% url 'cookie_consent_status' as status_url %}
<script type="module">
    import {showCookieBar} from '{{ cookiebar_src }}';
    showCookieBar({
      statusUrl: '{{ status_url|escapejs }}',
      templateSelector: '#cookie-consent__cookie-bar',
      cookieGroupsSelector: '#cookie-consent__cookie-groups',
      onShow: () => document.querySelector('body').classList.add('with-cookie-bar'),
      onAccept: () => document.querySelector('body').classList.remove('with-cookie-bar'),
      onDecline: () => document.querySelector('body').classList.remove('with-cookie-bar'),
    });
</script>