marcelodolza/iziModal

Unrecognized expression because of hashchange trigger

fstani opened this issue · 2 comments

Uncaught Error: Syntax error, unrecognized expression: #page=1
    at Function.ot.error (jquery.min.js:4)
    at gt (jquery.min.js:4)
    at kt (jquery.min.js:4)
    at Function.ot [as find] (jquery.min.js:4)
    at init.find (jquery.min.js:5)
    at new init (jquery.min.js:4)
    at x (jquery.min.js:4)
    at iziModal.min.js:formatted:607
    at dispatch (jquery.min.js:5)
    at y.handle (jquery.min.js:5)

When manually changing the hash, an error is thrown on this code:

o.off("hashchange." + a).on("hashchange." + a, function(e) {
        var i = document.location.hash
          , n = t(i).data();
        if ("" !== i)
            try {
                "undefined" != typeof n && "opening" !== t(i).iziModal("getState") && setTimeout(function() {
                    t(i).iziModal("open")
                }, 200)
            } catch (o) {}
        else
            window.$iziModal.history && t.each(t("." + a), function(e, i) {
                if (void 0 !== t(i).data().iziModal) {
                    var n = t(i).iziModal("getState");
                    "opened" != n && "opening" != n || t(i).iziModal("close")
                }
            })
    }),

Perhaps a try catch on the t(i).data() would be enough, or a checking it instead of assuming what is in the hash has anything to do with iziModal.

This mitigates the issue, but it would be nice to review the underlying cause.

o.off("hashchange." + a).on("hashchange." + a, function(e) {
        var i = document.location.hash, n;
        try {
            n = t(i).data();
        } catch (e) {
        }
        if ("" !== i)
            try {
                "undefined" != typeof n && "opening" !== t(i).iziModal("getState") && setTimeout(function() {
                    t(i).iziModal("open")
                }, 200)
            } catch (o) {}
        else
            window.$iziModal.history && t.each(t("." + a), function(e, i) {
                if (void 0 !== t(i).data().iziModal) {
                    var n = t(i).iziModal("getState");
                    "opened" != n && "opening" != n || t(i).iziModal("close")
                }
            })
    }),

👍

I encountered this issue using another jQuery plugin (fullpage.js) which automatically changes the page fragments (hashes) and the contain slash (e.g. #section/slide).

The syntax of the hash can be more complex than a string. See the example on Wikipedia.

iziModal tries to pass the hash as it is directly to jQuery without any validation:

// ...
var data = $(modalHash).data();
// ...

Solutions:

  1. Validate the hash (not the most trivial solution). A hint on StackOverflow.
  2. Have an iziModal initialisation option to completely disable.
  3. Allow the user to control the hashchange.iziModal behaviour via the API.

Solution 2 and 3 should be available for the user.