Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Odd classPrefix behaviour #143

Open
davegreenwp opened this issue Apr 1, 2016 · 3 comments
Open

Odd classPrefix behaviour #143

davegreenwp opened this issue Apr 1, 2016 · 3 comments

Comments

@davegreenwp
Copy link

I've recently upgraded the grunt-modernizr (1.0.2) and modernizr (2.8.3) versions to the latest stable builds in our development boilerplate that we use for all new projects. and I've noticed something odd.

Here is our grunt-modernizr partial:

module.exports = {
    // Generate a custom Modernizr build based on checks found in our Sass & JS
    custom: {
        "cache": true,
        "uglify": false,
        "options": [
            "domPrefixes",
            "prefixes",
            "mq",
            "prefixed",
            "testAllProps",
            "testProp",
            "setClasses"
        ],
        "tests": [],
        "excludeTests": [
            "hidden"
        ],
        "devFile": "bower_components/modernizr/modernizr.js",
        "dest": "<%= siteInfo.assets_path %>/<%= siteInfo.js_dir %>/lib/modernizr-custom.js",
        "crawl": true,
        "files": {
            "src": [
                '<%= siteInfo.assets_path %>/<%= siteInfo.sass_dir %>/**/*.scss',
                '<%= siteInfo.assets_path %>/<%= siteInfo.js_dir %>/**/*.js',
                '!<%= siteInfo.assets_path %>/<%= siteInfo.js_dir %>/lib/modernizr-custom.js'
            ]
        }
    }
};

First of all, the .hidden class was being applied to the <html> element as this is a utility helper class we have in our CSS. After digging around Google/issues I saw that this relates to one of Modernizr's tests, so after further reading I added...

"classPrefix": "mzr-", to the above config.

As a direct result of this, the replacement of no-js failed, and hidden was actually replaced with the mzr- prefix. End result looked like...

<html class="no-js mzr-">

So, I removed classPrefix from the grunt config and excluded the hidden test as you can see above.

The issue I now have is I'm unable to prefix any of the Modernizr classes added to the root <html> element without the no-js --> js switch failing.

Am I doing something wrong, or is this an actual bug?

P.S Happy to re-post in the main Modernizr repo. 👍
@patrickkettner
Copy link
Member

Its very strange that hidden is being included even with the excludeTests option... could you post a demo project showing the issue?

@davegreenwp
Copy link
Author

hey @patrickkettner the hidden class is being successfully excluded via excludeTests, it's just that classPrefix usage breaks both the added classes themselves and the no-js switch.

I'll strip all other JS out of our development boilerplate and see what happens: though I don't believe we have any JS included by default that would interfere. Hopefully get back to you later today!

@davegreenwp
Copy link
Author

@patrickkettner Confirmed. With no Javascript other than Modernizr.js on the page, adding "classPrefix": "mz-" results in

<html class="no-js mz-">

...when it should be...

<html class="js"> or <html class="js mz-supported-feature etc etc">

Odd!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@patrickkettner @davegreenwp