class selector does not seem to work

[SloppyFresh]

If I call:

jss.set('.myClass', {
'display': 'none'
});

the css is updated properly , and the display elements are updated as expected.

However, calling

jss.remove('.myClass');

has no effect.

Calling

jss.remove();

works though.

The .myClass style is not defined anywhere. If I do define it in a .css file included on the page, the behaviour is the same. If I use an element type selector instead of a class selector, remove seems to work as would be expected.

[dasilvacontin]

I couldn't reproduce the error: http://jsfiddle.net/Lqdtvy2z/.

Can you provide a failed test case?

[redders6600]

Hi @dasilvacontin - check the console of your fiddle - jss is not being defined because github is serving the file with the wrong MIME type, so whilst it looks like the example is working as intended, the rule never gets set in the first place.

I replaced the reference to the github resource with a link that does get served with the right MIME type using rawgit, and this is the result.

As you can see remove does not work when passed a selector. I can repro this in my own environment too.

[dasilvacontin]

Wow, what a fail, thanks for the heads up @redders6600! It would be nice to fix this, indeed.

[redders6600]

I looked into this and worked out what the issue is - the getRules function forces the selector to lowercase. This is fine for elements, but classes can have uppercase letters (as in this example).

To workaround with the current code, use styles that use all lowercase characters, but I guess this is something that should be updated in JSS.

Similarly, ensure you use the :: pseudoselector syntax when passing to remove instead of :.