search

doublesecretagency / craft-upvote

Upvote plugin for Craft CMS
Other
16 stars 6 forks source link

upvote is not defined #2

Closed arifje closed 6 years ago

arifje commented 6 years ago

Getting an JS error when clicking on the vote icon; upvote is not defined

Can't find anything about loading a JS-library.

screen shot 2018-05-11 at 13 56 38

Using latest version.

lindseydiloreto commented 6 years ago

There are two potential reasons why you might be seeing this...

  1. Do you have another JS error preceding this? If so, it could be killing the JS process, and preventing the object from loading.

  2. Are you caching the vote mechanism within a {% cache %} tag? There is a known, long-standing issue with Craft, where dynamically loaded JS/CSS files can't be cached.

arifje commented 6 years ago

No JS errors, not caching anything. It seems like the JS libraries aren’t loaded at all?

lindseydiloreto commented 6 years ago

It should be loaded automatically. Can you share the Twig code where your vote mechanism is placed?

arifje commented 6 years ago

Part of my code;

<div class="grid-x align-middle">
    <div class="cell small-6 text-left">
        <span class="date"><i class="fas fa-clock"></i> <time>{{ entry.postDate|date('short') }} {{ entry.postDate|time('short') }}</time> </span>
    </div>
    <div class="cell small-6 text-center">                      
        <span class="votes">{{ craft.upvote.totalDownvotes(entry.id) }}</span> {{ craft.upvote.upvote(entry.id) }} 
        {{ craft.upvote.downvote(entry.id) }}<span class="votes"> {{ craft.upvote.totalUpvotes(entry.id) }}</span> 
    </div>
    <div class="cell small-6 text-right">
        <span class="comments"><a href="{{ entry.url }}"><i class="fas fa-comments"></i> 34</span></a>
    </div>
</div>

But I can't find any of these libraries in my source;

            'js/sizzle.js',
            'js/superagent.js',
            'js/upvote.js',
lindseydiloreto commented 6 years ago

That code looks normal.

When the plugin runs, those JS files should get copied to your /web/cpresources/ folder on the front-end. It would end up in a folder with a hashed directory name. Does that folder exist, and is it writable by Craft?

arifje commented 6 years ago

Hm.

I have load balancing structure with multiple webservers behind it. Also using one single CDN for all JS/CSS files. So this is not a good solution in my case I guess.

Would be better if I could add these libraries manually to my header.

EDIT: I disabled the css/js loading according to the docs, copied the libraries to my CDN location, and added them in my header. Now they're loaded, but generating an new JS error on action;

screen shot 2018-05-12 at 10 02 26

EDIT2: looks like the response is a bad request;

        <div class="message-container">
        <div id="message" class="pane">
                <h2>Bad Request</h2>
            <p>Unable to verify your data submission.</p>
            </div>
lindseydiloreto commented 6 years ago

@skoften Hmm... it's really hard to say what might be happening here. I wouldn't assume that a load balanced server would be a problem. I'd expect your CDN solution to work as well.

Ping me on Craft Slack, and we can walk through it together in real-time. Once we've figured it out, we can update this thread with the solution.

arifje commented 6 years ago

Sure, I contacted you there.

In the mean time I did some more testing and found the cause; your plugin doesn't work with CSRF-protection enabled. When I turn it off (enableCsrfProtection in general config) it works. I guess this needs to be fixed by adding a valid CSRF token to the ajax call.

Also I noticed that the number of votes isn't increasing after voting. The console outputs the result, but I have to manually refresh the page to see the change.

lindseydiloreto commented 6 years ago

Turns out there is a third reason why the JS might not be getting loaded...

  1. Do you have properly formed <body> and </body> tags? Craft dynamically injects JS by automatically detecting the opening & closing body tags. If those tags aren't there, Craft doesn't know where to put the JS scripts.

This addresses almost all of the issues we're witnessing here:

The last issue is actually a feature request:

This is in reference to the separate upvote & downvote counts. I've filed a separate feature request to address this issue specifically.