Objectfit test now without 'css/' prefix?!
treiber opened this issue · 29 comments
I compile my modernizr file with grunt, the objectfit test that usually worked included the 'css/' prefix:
"tests": [
"css/objectfit"
],
However, this must've changed with the 3.2 release, because now it only works without the prefix:
"tests": [
"objectfit"
],
So, either the documentation on modernizr.com is outdated, or something is someone missed the prefix in the compiler.
Same case seems to be with backdropfilter. Only works without css/.
nothing changed in the 3.2 release on the Modernizr side that would impact this. It could be from grunt-modernizr hitting 1.0, and switching over to using customizr
Could be. I only noticed when I compiled in a new project with 3.2 and the tests wouldn't work...
This happens to me as well on grunt 1.0.1 and modernizr 3.2
what happens to me, is that some tests seem included and some not. For example css/calc seems not included (I followed this: #135)
With the newest modernizr the test have to have the prefix removed, so "ccs/calc" becomes "calc", hope this helps.
@DrCord : I've already cut off the "css/" from every css test...
My test has been: going on https://modernizr.com/download and select everything with "css" (I used the filter); I copied the resulting code; I removed the prefix "css/" and build the js file.
>> Explicitly including these tests:
>> appearance, backdropfilter, backgroundblendmode, backgroundcliptext, backgroundsize, borderimage, borderradius, boxshadow, boxsizing, checked, cubicbezierrange, displaytable, ellipsis, flexbox, flexboxlegacy, flexboxtweener, flexwrap, fontface, generatedcontent, hsla, lastchild, mediaqueries, multiplebgs, nthchild, objectfit, opacity, pointerevents, regions, rgba, shapes, siblinggeneral, subpixelfont, supports, target, textalignlast, textshadow, userselect, wrapflow
Looking for Modernizr references
>> Ready to build using these settings:
>> html5shiv, setClasses
as you can see many of them are missing:
animations, backgroundposition-shorthand, backgroundposition-xy, backgroundrepeat,backgroundsizecover,calc,chunit,columns,displayrunin,escape,exunit,filters,gradients,hairline,hyphens,invalid,mask,overflow-scrolling,positionsticky,pseudoanimations,pseudotransitions,reflections,regions,remunit,resize,scrollbars,transforms,transforms3d,transformstylepreserve3d,transitions,valid,vhunit,vmaxunit,vminunit,vwunit
Note: I also noticed that the not shorthand "css/all" (neither "all" simply) works
Here is my grunt config modernizr object, in case it helps:
"modernizr": { "dist": { "dest" : "<%= config.buildPaths.html %>/sites/all/libraries/modernizr/modernizr-custom.js", "parseFiles" : true, "tests": [ "applicationcache", "audio", "canvas", "canvastext", "geolocation", "hashchange", "history", "indexeddb", "postmessage", "svg", "touchevents", "video", "websockets", "backgroundcliptext", "backgroundsize", "borderimage", "borderradius", "boxshadow", "checked", "columns", "flexbox", "fontface", "generatedcontent", "gradients", "hsla", "lastchild", "mediaqueries", "multiplebgs", "nthchild", "opacity", "pseudotransitions", "reflections", "remunit", "rgba", "textshadow", "transforms", "transforms3d", "transformstylepreserve3d", "transitions", "valid", "mutationobserver", "picture", "localstorage", "sessionstorage", "websqldatabase", "clippaths", "inline", "smil", "extensions", "webworkers" ], "options" : [ "setClasses", "addTest", "html5printshiv", "testProp", "fnBind" ], "uglify" : true } }
same problem: for example "transform" and "transform3d" are not included, and I don't know where is the problem...
and this is mine: https://gist.github.com/erredeco/4f0cac58fa5842902105
I had issue with some of these parameters when i tried to set them, for instance parseFiles doesn't seem to do anything and I think that customTests and devFile were also behaving weird:
"parseFiles": false, "customTests": [], "devFile": false,
I would not set those and see what happens.
I also notice you have properties with a "-" in them, my experience is that those have to have the dash removed to work. for example "backgroundposition-xy" becomes "backgroundpositionxy".
Is it correctly outputting a file to the dest?
yes, the file is correctly generated on dest.
switching between "backgroundposition-xy" and "backgroundpositionxy" had no effect
I even removed the lines "parseFiles": false, "customTests": [], "devFile": false, without effect...
BTW I still don't understand what should be written on "devFile" ...
I went ahead and substituted your config for mine on my dev server to test it and the overflow-scrolling property works right without the "-" but nothing else seems to improve from your assessment except that...
devFile took me a bit to figure out - it should be the location of a file to ignore that is your dev version of the modernizr library, so that it doesn't parse itself and decide it needs all tests.
the grunt output ">> Explicitly including these tests:" lines up all the tests?
supposedly it is including those and then if you are parsing files it goes and finds any other needed tests. Try setting parse files to true
and what about setting uglify to true? I don't think that should have an effect, but it is different than my config...
So even if I set "calc" as the only explicitly included test it doesn't work...
I just tried to do the following thing:
- include just 3 tests that I am sure were not included:
"transforms",
"transforms3d",
"transformstylepreserve3d"
- the build message is:
Running "modernizr:dist" (modernizr) task
Looking for Modernizr references
>> Ready to build using these settings:
>> html5shiv, setClasses
Building your customized Modernizr...OK
>> Success! Saved file to ./Resources/Public/Assets/Js/Vendor/modernizr-custom.min.js
- the first line of the generated file are: (that's why I don't uglify it: it shows the query used for the build):
/*!
* modernizr v3.2.0
* Build http://modernizr.com/download?-shiv-dontmin
yeah, similar problem for me.
did you see this issue? #112 it doesn't tell us anything other than the "calc" test (and others) haven't been working for a while potentially...
got it!
The "calc" test is included if you title it "csscalc"
I found the same thing! so, some tests require 'cssTEST' some require no css prefix and some are even with a complete different title!
for example:
"transforms",
"transforms3d",
"transformstylepreserve3d"
must be:
"csstransforms",
"csstransforms3d",
"preserve3d"
The value appears to "csscalc" now, any property with a "/" or "-" doesn't work and has to have it removed. Certain properties seem to need the "css" (or other prefix) on front ("csscalc") and certain don't (example: "dom/mutationoberver" needs to be just "mutationobserver").
Glad I could help you debug this :D
as I said, there is also a third case: "transformstylepreserve3d" must become "preserve3d"
Thank you for your help... knowing where the problem is good , but...
this means that for every test I want to include I must look at the codepen generated example for the correct syntax :) I think that the problem is the code generated by the modernizr site is obsolete
I agree, the code generated by the modernizr site is outdated for the current version of grunt modernizr. I wonder how to get them to update it? I sent in an update request via the contact form on their site :D
thanks for everything! I hope this finding helps here too
Yeah hopefully our contacting modernizr and this thread can help others :D Have a great day!
you too :)
The issue was that customizr parses things based on the property name, rather than the AMD path (e.g. csstransitions rather than csstransitions).
The website generator has been updated