Filters broken on Cloudflare with Rocket Loader

Hi,

The filters break the category page on cloud flare when in use with Rocket Loader. There is no error as such. All other scripts that are inline and use jquery on ready also break. Turning off the filters for the category fixes the page. I've tried excluding the various filters scripts from  Rocket loader to some success but end up with an error after an initial filter request of
=====================
Filters.min.js:formatted:215 Uncaught TypeError: Cannot read property 'value' of undefined
    at Object.success (Filters.min.js:formatted:215)
    at a (t-xi5gsqgjabkmzsxzneg0ecx1ymlqwfrzpxtdxwoso1?v=AV_jipgL0BbXBIo3CecT8iBxEcABHl_uBrd3XKuEFAk1:1)
    at Object.fireWith [as resolveWith] (t-xi5gsqgjabkmzsxzneg0ecx1ymlqwfrzpxtdxwoso1?v=AV_jipgL0BbXBIo3CecT8iBxEcABHl_uBrd3XKuEFAk1:1)
    at k (t-xi5gsqgjabkmzsxzneg0ecx1ymlqwfrzpxtdxwoso1?v=AV_jipgL0BbXBIo3CecT8iBxEcABHl_uBrd3XKuEFAk1:1)
    at XMLHttpRequest.u (t-xi5gsqgjabkmzsxzneg0ecx1ymlqwfrzpxtdxwoso1?v=AV_jipgL0BbXBIo3CecT8iBxEcABHl_uBrd3XKuEFAk1:1)
=====================

which is the line of "$.address.value(n)"

in the context:
=======================================
if (r != "NO HASH QUERY") {
                g.expandFilterPanelsWithSelectedOptions();
                var n = $(e).filter("#urlHashQuery").val().toString();
                if (n != "") {
                    $.address.value(n)
                } else {
                    $.address.value("noFilterApplied");
                    $(".nopAjaxFilters7Spikes .selected-options").remove()
                }
            }
==================================
So it looks like the 3rd party plugin "Address" you use is breaking the filters.
Do you think it is possible to make the filters compatible with Cloud Flare and Rocket Loader? And will it be fixed in future releases?

thanks in advance,

Mark

Hello Mark,

The issue you are having is that the script from Filters.min.js is executing before the jquery.address-1.5.min.js is loaded.
It is, in fact, coming from the Rocket Loader. Generally, loading the scripts asynchronously is a bad idea because of problems like that. You are not ensured that the scripts will be loaded in the correct order or that the scripts will be loaded before the javascript execution starts.
We suggest you turn off the Rocket Loader or have Rocket Loader ignore the Ajax Filters scripts.

You can read how to make Rocket Loader ignore scripts in this article. The scripts for the ajax filters are loaded in the ~/Plugins/SevenSpikes.Nop.Plugins.AjaxFilters/Views/NopAjaxFilters/NopFilters.cshtml file

Note: Rocket Loader might cause similar errors in other pages of your store.

Hope that helps!

Hi Anton,

I did exclude all the Filter scripts from Rocket loader so i had:

Html.AddScriptParts("~/Scripts/jquery-1.10.2.min.js", true);
        Html.AddScriptParts("~/Scripts/jquery-migrate-1.2.1.min.js", true);

        Html.AddScriptParts("~/Scripts/kendo/2015.1.318/kendo.core.min.js", true);
        Html.AddScriptParts("~/Scripts/kendo/2015.1.318/kendo.userevents.min.js", true);
        Html.AddScriptParts("~/Scripts/kendo/2015.1.318/kendo.draganddrop.min.js", true);
        Html.AddScriptParts("~/Scripts/kendo/2015.1.318/kendo.window.min.js", true);


Html.AddScriptParts("~/Plugins/SevenSpikes.Nop.Plugins.AjaxFilters/Scripts/jquery.query-2.1.7.js", true);
        Html.AddScriptParts("~/Plugins/SevenSpikes.Nop.Plugins.AjaxFilters/Scripts/jquery.json-2.2.min.js", true);
        Html.AddScriptParts("~/Plugins/SevenSpikes.Nop.Plugins.AjaxFilters/JQueryTemplates/jDropDown.jquery.0.1.min.js", true);
        Html.AddScriptParts("~/Plugins/SevenSpikes.Nop.Plugins.AjaxFilters/Scripts/jquery.tmpl.min.js", true);
        Html.AddScriptParts("~/Plugins/SevenSpikes.Nop.Plugins.AjaxFilters/Scripts/jquery.address-1.5.min.js", true);
        Html.AddScriptParts("~/Plugins/SevenSpikes.Core/Scripts/SevenSpikesExtensions.js", true);
        //MF Fixes price sort by removing it
        Html.AddScriptParts("~/Plugins/SevenSpikes.Nop.Plugins.AjaxFilters/Scripts/script.js", true);
        Html.AddScriptParts("~/Plugins/SevenSpikes.Nop.Plugins.AjaxFilters/Scripts/Filters.min.js", true);

and i had modified pageheadbuilder so it set the data-cfasync attribute to false

                //parts to do not bundle
                foreach (var path in partsToDontBundle)
                {
                    result.AppendFormat("<script data-cfasync=\"false\" src=\"{0}\" type=\"text/javascript\"></script>", urlHelper.Content(path));
                    result.Append(Environment.NewLine);
                }

And a few other files so the filter specific stuff all loaded in sync. But you are correct in saying that it seems the jquery.address does not initialize properly before calling it.

All the other plugins are OK / Javascript etc. I guess the Filters 3rd party address plugin is just not compatible with Rocket loader.

Thanks again,

Cheers,

Mark