Modernizr css VALUE test.
There is no issue to check for css property support, but what to do if you need to check for css value?
Example:  transform-style:preserve-3d value that not supported in IE10, although property transform-style is.
 Another example: display:table for IE7.
So for now this is my solution for this problem:
Modernizr.addValueTest('property','value');
Modernizr.addValueTest('transform-style','preserve-3d');
And here is implementation:
Modernizr.addValueTest = function(property,value){
    var testName= (property+value).replace(/-/g,'');
    Modernizr.addTest(testName , function () {
        var element = document.createElement('link');
        var body = document.getElementsByTagName('HEAD')[0];
        var properties = [];
        var upcaseProp = property.replace(/(^|-)([a-z])/g, function(a, b, c){ return c.toUpperCase(); });
        properties[property] = property;
        properties['Webkit'+upcaseProp] ='-webkit-'+property;
        properties['Moz'+upcaseProp] ='-moz-'+property;
        properties['ms'+upcaseProp] ='-ms-'+property;
        body.insertBefore(element, null);
        for (var i in properties) {
            if (element.style[i] !== undefined) {
                element.style[i] = value;
            }
        }
        //ie7,ie8 doesnt support getComputedStyle
        //so this is the implementation
        if(!window.getComputedStyle) {
            window.getComputedStyle = function(el, pseudo) {
                this.el = el;
                this.getPropertyValue = function(prop) {
                    var re = /(\-([a-z]){1})/g;
                    if (prop == 'float') prop = 'styleFloat';
                    if (re.test(prop)) {
                        prop = prop.replace(re, function () {
                            return arguments[2].toUpperCase();
                        });
                    }
                    return el.currentStyle[prop] ? el.currentStyle[prop] : null;
                };
                return this;
            };
        }
        var st = window.getComputedStyle(element, null),
            currentValue = st.getPropertyValue("-webkit-"+property) ||
                st.getPropertyValue("-moz-"+property) ||
                st.getPropertyValue("-ms-"+property) ||
                st.getPropertyValue(property);
        if(currentValue!== value){
            element.parentNode.removeChild(element);
            return false;
        }
        element.parentNode.removeChild(element);
        return true;
    });
}
PS. Comments and feedback appreciated.
Written by Alexander Kneller
Related protips
3 Responses
You have an error in this line:
var upcaseProp  = property.charAt(0).toUpperCase() + property.slice(1);
It transforms transform-style to Transform-style, but it should be TransformStyle. 
It should be:
        var upcaseProp  = property.replace(/(^|-)([a-z])/g, function(a, b, c){
            return c.toUpperCase();
        });
Thanks, I updated post with your fix. 
Also I find out that may be its not good idea to implement window.getComputedStyle because some libraries (like jquery.animate-enhanced)  rely on that IE7 ,IE8 doesnt have it. So in my project I changed it to local function.
This was awesome! And exactly what i needed. Thanks!