Modals don't show up

[ericc06]

Environment:

Local website / Laravel 6.18.25 / PHP 7.4 / jQuery 3.1.1

Steps to reproduce:

Package (1.2.0) installed via composer:

composer require statikbe/laravel-cookie-consent

Javascript and css files publication:

php artisan vendor:publish --provider="Statikbe\CookieConsent\CookieConsentServiceProvider" --tag="public"

Added both css/cookie-consent.css & js/cookie-consent.js in the base template file, and web page source code checked for correct files insertion:

    <link rel="stylesheet" type="text/css" href="{{asset('vendor/cookie-consent/css/cookie-consent.css')}}">
    ...
    <script src="{{asset('vendor/cookie-consent/js/cookie-consent.js')}}"></script>

Added Statikbe\CookieConsent\CookieConsentMiddleware to app/Http/Kernel.php:

class Kernel extends HttpKernel
{
    protected $middleware = [
        // ...
        \Statikbe\CookieConsent\CookieConsentMiddleware::class,
    ];

    // ...
}

No translation configured ("Customising the dialog texts" and "Customising the dialog contents" steps from the README not used).

cookie-settings snippet placed in the footer, with a hard-coded label:

<a href="#" class="js-lcc-modal-alert">Cookies preferences</a>

Configuration published:

php artisan vendor:publish --provider="Statikbe\CookieConsent\CookieConsentServiceProvider" --tag="config"

Cache cleared:

php artisan cache:clear
php artisan view:clear

And that's all.

Issue observed:

Going to the homepage of the website, I only see the grey transparent .lcc-backdrop div. The two other div (lcc-modal--alert & lcc-modal--settings) are not visible (display: none). Checking the "__cookie_consent" cookie status: not present.

Reproduced on Chrome, Firefox & Edge.

Notes:

• In fact it did work once: I have seen both modals (on Chrome) the very first time I accessed the website after having installed the package.
• No Javascript error displayed in the console.
• No error display in the Laravel debugbar.
• No parameter changed in cookie-consent.php.
• Whole process repeated twice with the same result.

[ericc06]

Bug reproduced with version 1.2.1 of the package.

Environment:

Local website / Laravel 6.18.31 / PHP 7.4 / jQuery 3.1.1

Additional notes:

• Both .lcc-modal div are present in the HTML code of the page, but they always stay "display: none" whatever I try and whatever the "__cookie_consent" cookie status (present or not).
• Clicking the cookie-settings snippet link produces nothing except adding "#" to the URL.
• The .lcc-backdrop div display is always consistent: hidden when the "__cookie_consent" cookie is present, or shown when this cookie is missing.
• No Javascript error is raised in the console. Never.
• On the demo page of the laravel-cookie-consent package located in the "/public/vendor/cookie-consent" folder of my web site, everything is OK !

==> It seems that something is preventing the Javascript of the package from working as expected on the pages of my site, but I can't figure out what. Can it be some kind of Javascript libraries silent conflict ? And in this case, why does the .lcc-backdrop div behave as expected?

[ericc06]

I found what causes my problem.

In the README file we can read:

The cookie-settings view file is just a snippet you need to place somewhere onto your page. Most preferably in the footer next to the url of your cookie policy.

<a href="#" class="**js-lcc-modal-alert**">{'cookie-consent::texts.alert_settings'|translate}</a> This gives your visitor the opportunity to change the settings again.

But there is an issue with the given <a> markup. In the demo.html file provided with the package I found this one:

<a href="javascript:void(0)" class="**js-lcc-settings-toggle**">cookie settings</a>

I tried to insert it in my footer and it works! Why such a difference between the README and the demo file?

The only remaining issue is an error in the console:

Uncaught TypeError: Cannot read property 'dataset' of null at Module. (VM71031 cookie-consent.js:1)

Any idea how to fix this?

[kristofser]

Hey, I'm sorry it took so long to comment. We've set up some notification system to check this more regulary.

I'll fix this asap. Seems like the readme file hasn't been updated properly.

[kristofser]

I've fixed the readme and followed the steps you did. Seems to work as intended again.

Again sorry for the slow and late responses.

[ericc06]

It works great now. No more Javascript error. Thank you.

May I ask you one last question? When "Analytical cookies" is not checked, both Google Analytics cookies ("_ga" and "_gid") keep on being created. How can I prevent this? I'd like to allow their creation only if "Analytical cookies" is checked.

Thanks!