renvrant/conditionize.js

Hyphens in ids break the JS

Closed this issue · 7 comments

See this pen:
https://codepen.io/anon/pen/dQeyow

All I did was replace example1 with example-1 in the id and the data-condition. I work with a CMS where I do not have control over all the ids generated, so all allowed id characters should work in the script.

Error:
Uncaught SyntaxError: Invalid or unexpected token
at HTMLParagraphElement. (pen.js:67)
at Function.each (jquery.min.js:2)
at w.fn.init.each (jquery.min.js:2)
at w.fn.init.$.fn.conditionize (pen.js:26)
at pen.js:72

Hi,
That really seems like a bug. I guess initially I did not take it into account because it can be confused with minus sign. Although I would never use it, I agree that ids with hyphens are valid and must be supported. So I will fix it in a few days.
Thanks for the suggestion.

Hey, thanks for the quick reply and initiative on this. Not sure if there is a difference between a minus sign and a hyphen actually...

Not sure if there is a difference between a minus sign and a hyphen actually...

There is no difference, which makes it possible to confuse them. For instance, a condition string like "#example-1>0" can mean "#example-1 > 0" or "#example - 1 > 0". So that is why it was not taken into account initially. But now I think it's better to support hyphen because in case of minus one can always put a space, and moreover, I think it is too rare to write conditions like that.

This might help: http://xahlee.info/js/html_allowed_chars_in_attribute.html

Apparently any character except for a space seems to be allowed!

Thanks. I saw it. That was the first thing I made after your message:)
For now, I'm not going to add support of that format. It's because for me, it is really bad practice to use some wild ids with commas, dots, colóns, etc. Let's not forget that there are CSS selectors and JS objects. I also have not seen anyone to use such ids.

Hi,
I improved regexs. You can use hyphens. Take a look at updated README and codepen demo

Hey,
thanks for that!