jQuery.Deferred exception: The string did not match the expected pattern

Simone Gizzi picture Simone Gizzi · Jan 15, 2017 · Viewed 9.8k times · Source

I've a little headache with this console error, ONLY on Safari (working on MacBook actually).

I have this function:

function exists(element){
    var exists = document.querySelector(element);
    return exists;
}

invoked inside another function:

function includeHoverStylesheet(){
    var path = $("body").attr("data-hover");
    if (!("ontouchstart" in document.documentElement || exists("link[href='" + path + "'"))) {
        var link = document.createElement("link");
        link.rel = "stylesheet", link.href = path, document.head.appendChild(link) && document.body.removeAttribute("data-hover");
    }
}

Now, on Chrome works like a charm, but on Safari the console throw this error:

1) Invalid CSS property declaration at: *
2) jQuery.Deferred exception: The string did not match the expected pattern.
3) SyntaxError (DOM Exception 12): The string did not match the expected pattern.

Someone have idea what hell happening???

Thanks in advance guys!

Answer

chrissharkman picture chrissharkman · Apr 4, 2017

There is a closing bracket missing, so you are using an invalid selector. (as Roamer-1888 mentioned as comment)

Having a look at the following discussion where invalid selectors in different browsers has been tested, only Safari is that strict bringing up errors: https://www.reddit.com/r/firefox/comments/5nbmqi/on_handling_invalid_selector_strings/

For all jquery-Users: check your jquery version, as there has been bugfixes on selector issues.

I had the same error only on Safari on this statement

var div = $('<div class="abc">');

A statement working fine on Firefox and Chrome, but not on Safari when using version jquery 1.11.1; but working fine in all of them with jquery 1.12.4.

In my case I solved it using the following syntax:

var div = $('<div>', {"class":"abc"});