/*! * modernizr v3.0.0pre * modernizr.com * * Copyright (c) Faruk Ates, Paul Irish, Alex Sexton, Ryan Seddon, Alexander Farkas, Ben Alman, Stu Cox * MIT License */ /* * Modernizr tests which native CSS3 and HTML5 features are available in the * current UA and makes the results available to you in two ways: as properties on * a global `Modernizr` object, and as classes on the `` element. This * information allows you to progressively enhance your pages with a granular level * of control over the experience. * * Modernizr has an optional (*not included*) conditional resource loader called * `Modernizr.load()`, based on [Yepnope.js](http://yepnopejs.com). You can get a * build that includes `Modernizr.load()`, as well as choosing which feature tests * to include on the [Download page](http://www.modernizr.com/download/). */ ;(function(window, document, undefined){ var tests = []; var ModernizrProto = { // The current version, dummy _version: 'v3.0.0pre', // Any settings that don't work as separate modules // can go in here as configuration. _config: { classPrefix : '', enableClasses : true }, // Queue of tests _q: [], // Stub these for people who are listening on: function( test, cb ) { // I don't really think people should do this, but we can // safe guard it a bit. // -- NOTE:: this gets WAY overridden in src/addTest for // actual async tests. This is in case people listen to // synchronous tests. I would leave it out, but the code // to *disallow* sync tests in the real version of this // function is actually larger than this. setTimeout(function() { cb(this[test]); }, 0); }, addTest: function( name, fn, options ) { tests.push({name : name, fn : fn, options : options }); }, addAsyncTest: function (fn) { tests.push({name : null, fn : fn}); } }; // Fake some of Object.create // so we can force non test results // to be non "own" properties. var Modernizr = function(){}; Modernizr.prototype = ModernizrProto; // Leak modernizr globally when you `require` it // rather than force it here. // Overwrite name so constructor name is nicer :D Modernizr = new Modernizr(); var classes = []; /** * is returns a boolean for if typeof obj is exactly type. */ function is( obj, type ) { return typeof obj === type; } ; // Run through all tests and detect their support in the current UA. function testRunner() { var featureNames; var feature; var aliasIdx; var result; var nameIdx; var featureName; var featureNameSplit; for ( var featureIdx in tests ) { featureNames = []; feature = tests[featureIdx]; // run the test, throw the return value into the Modernizr, // then based on that boolean, define an appropriate className // and push it into an array of classes we'll join later. // // If there is no name, it's an 'async' test that is run, // but not directly added to the object. That should // be done with a post-run addTest call. if ( feature.name ) { featureNames.push(feature.name.toLowerCase()); if (feature.options && feature.options.aliases && feature.options.aliases.length) { // Add all the aliases into the names list for (aliasIdx = 0; aliasIdx < feature.options.aliases.length; aliasIdx++) { featureNames.push(feature.options.aliases[aliasIdx].toLowerCase()); } } } // Run the test, or use the raw value if it's not a function result = is(feature.fn, 'function') ? feature.fn() : feature.fn; // Set each of the names on the Modernizr object for (nameIdx = 0; nameIdx < featureNames.length; nameIdx++) { featureName = featureNames[nameIdx]; // Support dot properties as sub tests. We don't do checking to make sure // that the implied parent tests have been added. You must call them in // order (either in the test, or make the parent test a dependency). // // Cap it to TWO to make the logic simple and because who needs that kind of subtesting // hashtag famous last words featureNameSplit = featureName.split('.'); if (featureNameSplit.length === 1) { Modernizr[featureNameSplit[0]] = result; } else if (featureNameSplit.length === 2) { Modernizr[featureNameSplit[0]][featureNameSplit[1]] = result; } classes.push((result ? '' : 'no-') + featureNameSplit.join('-')); } } } ; var docElement = document.documentElement; // Pass in an and array of class names, e.g.: // ['no-webp', 'borderradius', ...] function setClasses( classes ) { var className = docElement.className; var classPrefix = Modernizr._config.classPrefix || ''; // Change `no-js` to `js` (we do this regardles of the `enableClasses` // option) // Handle classPrefix on this too var reJS = new RegExp('(^|\\s)'+classPrefix+'no-js(\\s|$)'); className = className.replace(reJS, '$1'+classPrefix+'js$2'); if(Modernizr._config.enableClasses) { // Add the new classes className += ' ' + classPrefix + classes.join(' ' + classPrefix); docElement.className = className; } } ; // hasOwnProperty shim by kangax needed for Safari 2.0 support var hasOwnProp; (function() { var _hasOwnProperty = ({}).hasOwnProperty; if ( !is(_hasOwnProperty, 'undefined') && !is(_hasOwnProperty.call, 'undefined') ) { hasOwnProp = function (object, property) { return _hasOwnProperty.call(object, property); }; } else { hasOwnProp = function (object, property) { /* yes, this can give false positives/negatives, but most of the time we don't care about those */ return ((property in object) && is(object.constructor.prototype[property], 'undefined')); }; } })(); // As far as I can think of, we shouldn't need or // allow 'on' for non-async tests, and you can't do // async tests without this 'addTest' module. // Listeners for async or post-run tests ModernizrProto._l = {}; // 'addTest' implies a test after the core runloop, // So we'll add in the events ModernizrProto.on = function( test, cb ) { // Create the list of listeners if it doesn't exist if (!this._l[test]) { this._l[test] = []; } // Push this test on to the listener list this._l[test].push(cb); // If it's already been resolved, trigger it on next tick if (Modernizr.hasOwnProperty(test)) { // Next Tick setTimeout(function() { Modernizr._trigger(test, Modernizr[test]); }, 0); } }; ModernizrProto._trigger = function( test, res ) { if (!this._l[test]) { return; } var cbs = this._l[test]; // Force async setTimeout(function() { var i, cb; for (i = 0; i < cbs.length; i++) { cb = cbs[i]; cb(res); } },0); // Don't trigger these again delete this._l[test]; }; /** * addTest allows the user to define their own feature tests * the result will be added onto the Modernizr object, * as well as an appropriate className set on the html element * * @param feature - String naming the feature * @param test - Function returning true if feature is supported, false if not */ function addTest( feature, test ) { if ( typeof feature == 'object' ) { for ( var key in feature ) { if ( hasOwnProp( feature, key ) ) { addTest( key, feature[ key ] ); } } } else { feature = feature.toLowerCase(); var featureSplit = feature.split('.'); var last = Modernizr[featureSplit[0]]; // Again, we don't check for parent test existence. Get that right, though. if (featureSplit.length == 2) { last = last[featureSplit[1]]; } if ( typeof last != 'undefined' ) { // we're going to quit if you're trying to overwrite an existing test // if we were to allow it, we'd do this: // var re = new RegExp("\\b(no-)?" + feature + "\\b"); // docElement.className = docElement.className.replace( re, '' ); // but, no rly, stuff 'em. return Modernizr; } test = typeof test == 'function' ? test() : test; // Set the value (this is the magic, right here). if (featureSplit.length == 1) { Modernizr[featureSplit[0]] = test; } else if (featureSplit.length == 2) { Modernizr[featureSplit[0]][featureSplit[1]] = test; } // Set a single class (either `feature` or `no-feature`) setClasses([(test ? '' : 'no-') + featureSplit.join('-')]); // Trigger the event Modernizr._trigger(feature, test); } return Modernizr; // allow chaining. } // After all the tests are run, add self // to the Modernizr prototype Modernizr._q.push(function() { ModernizrProto.addTest = addTest; }); // Take the html5 variable out of the // html5shiv scope so we can return it. var html5; /** * @preserve HTML5 Shiv v3.6.2pre | @afarkas @jdalton @jon_neal @rem | MIT/GPL2 Licensed */ ;(function(window, document) { /*jshint evil:true */ /** version */ var version = '3.6.2'; /** Preset options */ var options = window.html5 || {}; /** Used to skip problem elements */ var reSkip = /^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i; /** Not all elements can be cloned in IE **/ var saveClones = /^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i; /** Detect whether the browser supports default html5 styles */ var supportsHtml5Styles; /** Name of the expando, to work with multiple documents or to re-shiv one document */ var expando = '_html5shiv'; /** The id for the the documents expando */ var expanID = 0; /** Cached data for each document */ var expandoData = {}; /** Detect whether the browser supports unknown elements */ var supportsUnknownElements; (function() { try { var a = document.createElement('a'); a.innerHTML = ''; //if the hidden property is implemented we can assume, that the browser supports basic HTML5 Styles supportsHtml5Styles = ('hidden' in a); supportsUnknownElements = a.childNodes.length == 1 || (function() { // assign a false positive if unable to shiv (document.createElement)('a'); var frag = document.createDocumentFragment(); return ( typeof frag.cloneNode == 'undefined' || typeof frag.createDocumentFragment == 'undefined' || typeof frag.createElement == 'undefined' ); }()); } catch(e) { // assign a false positive if detection fails => unable to shiv supportsHtml5Styles = true; supportsUnknownElements = true; } }()); /*--------------------------------------------------------------------------*/ /** * Creates a style sheet with the given CSS text and adds it to the document. * @private * @param {Document} ownerDocument The document. * @param {String} cssText The CSS text. * @returns {StyleSheet} The style element. */ function addStyleSheet(ownerDocument, cssText) { var p = ownerDocument.createElement('p'), parent = ownerDocument.getElementsByTagName('head')[0] || ownerDocument.documentElement; p.innerHTML = 'x'; return parent.insertBefore(p.lastChild, parent.firstChild); } /** * Returns the value of `html5.elements` as an array. * @private * @returns {Array} An array of shived element node names. */ function getElements() { var elements = html5.elements; return typeof elements == 'string' ? elements.split(' ') : elements; } /** * Returns the data associated to the given document * @private * @param {Document} ownerDocument The document. * @returns {Object} An object of data. */ function getExpandoData(ownerDocument) { var data = expandoData[ownerDocument[expando]]; if (!data) { data = {}; expanID++; ownerDocument[expando] = expanID; expandoData[expanID] = data; } return data; } /** * returns a shived element for the given nodeName and document * @memberOf html5 * @param {String} nodeName name of the element * @param {Document} ownerDocument The context document. * @returns {Object} The shived element. */ function createElement(nodeName, ownerDocument, data){ if (!ownerDocument) { ownerDocument = document; } if(supportsUnknownElements){ return ownerDocument.createElement(nodeName); } if (!data) { data = getExpandoData(ownerDocument); } var node; if (data.cache[nodeName]) { node = data.cache[nodeName].cloneNode(); } else if (saveClones.test(nodeName)) { node = (data.cache[nodeName] = data.createElem(nodeName)).cloneNode(); } else { node = data.createElem(nodeName); } // Avoid adding some elements to fragments in IE < 9 because // * Attributes like `name` or `type` cannot be set/changed once an element // is inserted into a document/fragment // * Link elements with `src` attributes that are inaccessible, as with // a 403 response, will cause the tab/window to crash // * Script elements appended to fragments will execute when their `src` // or `text` property is set return node.canHaveChildren && !reSkip.test(nodeName) ? data.frag.appendChild(node) : node; } /** * returns a shived DocumentFragment for the given document * @memberOf html5 * @param {Document} ownerDocument The context document. * @returns {Object} The shived DocumentFragment. */ function createDocumentFragment(ownerDocument, data){ if (!ownerDocument) { ownerDocument = document; } if(supportsUnknownElements){ return ownerDocument.createDocumentFragment(); } data = data || getExpandoData(ownerDocument); var clone = data.frag.cloneNode(), i = 0, elems = getElements(), l = elems.length; for(;i+~])(' + getElements().join('|') + ')(?=[[\\s,>+~#.:]|$)', 'gi'), replacement = '$1' + shivNamespace + '\\:$2'; while (index--) { pair = parts[index] = parts[index].split('}'); pair[pair.length - 1] = pair[pair.length - 1].replace(reElements, replacement); parts[index] = pair.join('}'); } return parts.join('{'); } /** * Removes the given wrappers, leaving the original elements. * @private * @params {Array} wrappers An array of printable wrappers. */ function removeWrappers(wrappers) { var index = wrappers.length; while (index--) { wrappers[index].removeNode(); } } /*--------------------------------------------------------------------------*/ /** * Shivs the given document for print. * @memberOf html5 * @param {Document} ownerDocument The document to shiv. * @returns {Document} The shived document. */ function shivPrint(ownerDocument) { var shivedSheet, wrappers, data = getExpandoData(ownerDocument), namespaces = ownerDocument.namespaces, ownerWindow = ownerDocument.parentWindow; if (!supportsShivableSheets || ownerDocument.printShived) { return ownerDocument; } if (typeof namespaces[shivNamespace] == 'undefined') { namespaces.add(shivNamespace); } function removeSheet() { clearTimeout(data._removeSheetTimer); if (shivedSheet) { shivedSheet.removeNode(true); } shivedSheet= null; } ownerWindow.attachEvent('onbeforeprint', function() { removeSheet(); var imports, length, sheet, collection = ownerDocument.styleSheets, cssText = [], index = collection.length, sheets = Array(index); // convert styleSheets collection to an array while (index--) { sheets[index] = collection[index]; } // concat all style sheet CSS text while ((sheet = sheets.pop())) { // IE does not enforce a same origin policy for external style sheets... // but has trouble with some dynamically created stylesheets if (!sheet.disabled && reMedia.test(sheet.media)) { try { imports = sheet.imports; length = imports.length; } catch(er){ length = 0; } for (index = 0; index < length; index++) { sheets.push(imports[index]); } try { cssText.push(sheet.cssText); } catch(er){} } } // wrap all HTML5 elements with printable elements and add the shived style sheet cssText = shivCssText(cssText.reverse().join('')); wrappers = addWrappers(ownerDocument); shivedSheet = addStyleSheet(ownerDocument, cssText); }); ownerWindow.attachEvent('onafterprint', function() { // remove wrappers, leaving the original elements, and remove the shived style sheet removeWrappers(wrappers); clearTimeout(data._removeSheetTimer); data._removeSheetTimer = setTimeout(removeSheet, 500); }); ownerDocument.printShived = true; return ownerDocument; } /*--------------------------------------------------------------------------*/ // expose API html5.type += ' print'; html5.shivPrint = shivPrint; // shiv for print shivPrint(document); }(this, document)); // yepnope.js // Version - 1.5.4pre // // by // Alex Sexton - @SlexAxton - AlexSexton[at]gmail.com // Ralph Holzmann - @ralphholzmann - ralphholzmann[at]gmail.com // // http://yepnopejs.com/ // https://github.com/SlexAxton/yepnope.js/ // // Tri-license - WTFPL | MIT | BSD // // Please minify before use. // Also available as Modernizr.load via the Modernizr Project // ( function ( window, doc, undef ) { var docElement = doc.documentElement, sTimeout = window.setTimeout, firstScript = doc.getElementsByTagName( "script" )[ 0 ], toString = {}.toString, execStack = [], started = 0, noop = function () {}, // Before you get mad about browser sniffs, please read: // https://github.com/Modernizr/Modernizr/wiki/Undetectables // If you have a better solution, we are actively looking to solve the problem isGecko = ( "MozAppearance" in docElement.style ), isGeckoLTE18 = isGecko && !! doc.createRange().compareNode, insBeforeObj = isGeckoLTE18 ? docElement : firstScript.parentNode, // Thanks to @jdalton for showing us this opera detection (by way of @kangax) (and probably @miketaylr too, or whatever...) isOpera = window.opera && toString.call( window.opera ) == "[object Opera]", isIE = !! doc.attachEvent && !isOpera, strJsElem = isGecko ? "object" : isIE ? "script" : "img", strCssElem = isIE ? "script" : strJsElem, isArray = Array.isArray || function ( obj ) { return toString.call( obj ) == "[object Array]"; }, isObject = function ( obj ) { return Object(obj) === obj; }, isString = function ( s ) { return typeof s == "string"; }, isFunction = function ( fn ) { return toString.call( fn ) == "[object Function]"; }, readFirstScript = function() { if (!firstScript || !firstScript.parentNode) { firstScript = doc.getElementsByTagName( "script" )[ 0 ]; } }, globalFilters = [], scriptCache = {}, prefixes = { // key value pair timeout options timeout : function( resourceObj, prefix_parts ) { if ( prefix_parts.length ) { resourceObj['timeout'] = prefix_parts[ 0 ]; } return resourceObj; } }, handler, yepnope; /* Loader helper functions */ function isFileReady ( readyState ) { // Check to see if any of the ways a file can be ready are available as properties on the file's element return ( ! readyState || readyState == "loaded" || readyState == "complete" || readyState == "uninitialized" ); } // Takes a preloaded js obj (changes in different browsers) and injects it into the head // in the appropriate order function injectJs ( src, cb, attrs, timeout, /* internal use */ err, internal ) { var script = doc.createElement( "script" ), done, i; timeout = timeout || yepnope['errorTimeout']; script.src = src; // Add our extra attributes to the script element for ( i in attrs ) { script.setAttribute( i, attrs[ i ] ); } cb = internal ? executeStack : ( cb || noop ); // Bind to load events script.onreadystatechange = script.onload = function () { if ( ! done && isFileReady( script.readyState ) ) { // Set done to prevent this function from being called twice. done = 1; cb(); // Handle memory leak in IE script.onload = script.onreadystatechange = null; } }; // 404 Fallback sTimeout(function () { if ( ! done ) { done = 1; // Might as well pass in an error-state if we fire the 404 fallback cb(1); } }, timeout ); // Inject script into to document // or immediately callback if we know there // was previously a timeout error readFirstScript(); err ? script.onload() : firstScript.parentNode.insertBefore( script, firstScript ); } // Takes a preloaded css obj (changes in different browsers) and injects it into the head function injectCss ( href, cb, attrs, timeout, /* Internal use */ err, internal ) { // Create stylesheet link var link = doc.createElement( "link" ), done, i; timeout = timeout || yepnope['errorTimeout']; cb = internal ? executeStack : ( cb || noop ); // Add attributes link.href = href; link.rel = "stylesheet"; link.type = "text/css"; // Add our extra attributes to the link element for ( i in attrs ) { link.setAttribute( i, attrs[ i ] ); } if ( ! err ) { readFirstScript(); firstScript.parentNode.insertBefore( link, firstScript ); sTimeout(cb, 0); } } function executeStack ( ) { // shift an element off of the stack var i = execStack.shift(); started = 1; // if a is truthy and the first item in the stack has an src if ( i ) { // if it's a script, inject it into the head with no type attribute if ( i['t'] ) { // Inject after a timeout so FF has time to be a jerk about it and // not double load (ignore the cache) sTimeout( function () { (i['t'] == "c" ? yepnope['injectCss'] : yepnope['injectJs'])( i['s'], 0, i['a'], i['x'], i['e'], 1 ); }, 0 ); } // Otherwise, just call the function and potentially run the stack else { i(); executeStack(); } } else { // just reset out of recursive mode started = 0; } } function preloadFile ( elem, url, type, splicePoint, dontExec, attrObj, timeout ) { timeout = timeout || yepnope['errorTimeout']; // Create appropriate element for browser and type var preloadElem = doc.createElement( elem ), done = 0, firstFlag = 0, stackObject = { "t": type, // type "s": url, // src //r: 0, // ready "e": dontExec,// set to true if we don't want to reinject "a": attrObj, "x": timeout }; // The first time (common-case) if ( scriptCache[ url ] === 1 ) { firstFlag = 1; scriptCache[ url ] = []; } function onload ( first ) { // If the script/css file is loaded if ( ! done && isFileReady( preloadElem.readyState ) ) { // Set done to prevent this function from being called twice. stackObject['r'] = done = 1; ! started && executeStack(); if ( first ) { if ( elem != "img" ) { sTimeout( function () { insBeforeObj.removeChild( preloadElem ); }, 50); } for ( var i in scriptCache[ url ] ) { if ( scriptCache[ url ].hasOwnProperty( i ) ) { scriptCache[ url ][ i ].onload(); } } // Handle memory leak in IE preloadElem.onload = preloadElem.onreadystatechange = null; } } } // Setting url to data for objects or src for img/scripts if ( elem == "object" ) { preloadElem.data = url; // Setting the type attribute to stop Firefox complaining about the mimetype when running locally. // The type doesn't matter as long as it's real, thus text/css instead of text/javascript. preloadElem.setAttribute("type", "text/css"); } else { preloadElem.src = url; // Setting bogus script type to allow the script to be cached preloadElem.type = elem; } // Don't let it show up visually preloadElem.width = preloadElem.height = "0"; // Attach handlers for all browsers preloadElem.onerror = preloadElem.onload = preloadElem.onreadystatechange = function(){ onload.call(this, firstFlag); }; // inject the element into the stack depending on if it's // in the middle of other scripts or not execStack.splice( splicePoint, 0, stackObject ); // The only place these can't go is in the element, since objects won't load in there // so we have two options - insert before the head element (which is hard to assume) - or // insertBefore technically takes null/undefined as a second param and it will insert the element into // the parent last. We try the head, and it automatically falls back to undefined. if ( elem != "img" ) { // If it's the first time, or we've already loaded it all the way through if ( firstFlag || scriptCache[ url ] === 2 ) { readFirstScript(); insBeforeObj.insertBefore( preloadElem, isGeckoLTE18 ? null : firstScript ); // If something fails, and onerror doesn't fire, // continue after a timeout. sTimeout( onload, timeout ); } else { // instead of injecting, just hold on to it scriptCache[ url ].push( preloadElem ); } } } function load ( resource, type, dontExec, attrObj, timeout ) { // If this method gets hit multiple times, we should flag // that the execution of other threads should halt. started = 0; // We'll do 'j' for js and 'c' for css, yay for unreadable minification tactics type = type || "j"; if ( isString( resource ) ) { // if the resource passed in here is a string, preload the file preloadFile( type == "c" ? strCssElem : strJsElem, resource, type, this['i']++, dontExec, attrObj, timeout ); } else { // Otherwise it's a callback function and we can splice it into the stack to run execStack.splice( this['i']++, 0, resource ); execStack.length == 1 && executeStack(); } // OMG is this jQueries? For chaining... return this; } // return the yepnope object with a fresh loader attached function getYepnope () { var y = yepnope; y['loader'] = { "load": load, "i" : 0 }; return y; } /* End loader helper functions */ // Yepnope Function yepnope = function ( needs ) { var i, need, // start the chain as a plain instance chain = this['yepnope']['loader']; function satisfyPrefixes ( url ) { // split all prefixes out var parts = url.split( "!" ), gLen = globalFilters.length, origUrl = parts.pop(), pLen = parts.length, res = { "url" : origUrl, // keep this one static for callback variable consistency "origUrl" : origUrl, "prefixes" : parts }, mFunc, j, prefix_parts; // loop through prefixes // if there are none, this automatically gets skipped for ( j = 0; j < pLen; j++ ) { prefix_parts = parts[ j ].split( '=' ); mFunc = prefixes[ prefix_parts.shift() ]; if ( mFunc ) { res = mFunc( res, prefix_parts ); } } // Go through our global filters for ( j = 0; j < gLen; j++ ) { res = globalFilters[ j ]( res ); } // return the final url return res; } function getExtension ( url ) { //The extension is always the last characters before the ? and after a period. //The previous method was not accounting for the possibility of a period in the query string. var b = url.split('?')[0]; return b.substr(b.lastIndexOf('.')+1); } function loadScriptOrStyle ( input, callback, chain, index, testResult ) { // run through our set of prefixes var resource = satisfyPrefixes( input ), autoCallback = resource['autoCallback'], extension = getExtension( resource['url'] ); // if no object is returned or the url is empty/0 just exit the load if ( resource['bypass'] ) { return; } // Determine callback, if any if ( callback ) { callback = isFunction( callback ) ? callback : callback[ input ] || callback[ index ] || callback[ ( input.split( "/" ).pop().split( "?" )[ 0 ] ) ]; } // if someone is overriding all normal functionality if ( resource['instead'] ) { return resource['instead']( input, callback, chain, index, testResult ); } else { // Handle if we've already had this url and it's completed loaded already if ( scriptCache[ resource['url'] ] && resource['reexecute'] !== true) { // don't let this execute again resource['noexec'] = true; } else { scriptCache[ resource['url'] ] = 1; } // Throw this into the queue input && chain.load( resource['url'], ( ( resource['forceCSS'] || ( ! resource['forceJS'] && "css" == getExtension( resource['url'] ) ) ) ) ? "c" : undef, resource['noexec'], resource['attrs'], resource['timeout'] ); // If we have a callback, we'll start the chain over if ( isFunction( callback ) || isFunction( autoCallback ) ) { // Call getJS with our current stack of things chain['load']( function () { // Hijack yepnope and restart index counter getYepnope(); // Call our callbacks with this set of data callback && callback( resource['origUrl'], testResult, index ); autoCallback && autoCallback( resource['origUrl'], testResult, index ); // Override this to just a boolean positive scriptCache[ resource['url'] ] = 2; } ); } } } function loadFromTestObject ( testObject, chain ) { var testResult = !! testObject['test'], group = testResult ? testObject['yep'] : testObject['nope'], always = testObject['load'] || testObject['both'], callback = testObject['callback'] || noop, cbRef = callback, complete = testObject['complete'] || noop, needGroupSize; // Reusable function for dealing with the different input types // NOTE:: relies on closures to keep 'chain' up to date, a bit confusing, but // much smaller than the functional equivalent in this case. function handleGroup ( needGroup, moreToCome ) { /* jshint -W083 */ if ( '' !== needGroup && ! needGroup ) { // Call the complete callback when there's nothing to load. ! moreToCome && complete(); } // If it's a string else if ( isString( needGroup ) ) { // if it's a string, it's the last if ( !moreToCome ) { // Add in the complete callback to go at the end callback = function () { var args = [].slice.call( arguments ); cbRef.apply( this, args ); complete(); }; } // Just load the script of style loadScriptOrStyle( needGroup, callback, chain, 0, testResult ); } // See if we have an object. Doesn't matter if it's an array or a key/val hash // Note:: order cannot be guaranteed on an key value object with multiple elements // since the for-in does not preserve order. Arrays _should_ go in order though. else if ( isObject( needGroup ) ) { // I hate this, but idk another way for objects. needGroupSize = (function(){ var count = 0, i; for (i in needGroup ) { if ( needGroup.hasOwnProperty( i ) ) { count++; } } return count; })(); for ( var callbackKey in needGroup ) { // Safari 2 does not have hasOwnProperty, but not worth the bytes for a shim // patch if needed. Kangax has a nice shim for it. Or just remove the check // and promise not to extend the object prototype. if ( needGroup.hasOwnProperty( callbackKey ) ) { // Find the last added resource, and append to it's callback. if ( ! moreToCome && ! ( --needGroupSize ) ) { // If this is an object full of callbacks if ( ! isFunction( callback ) ) { // Add in the complete callback to go at the end callback[ callbackKey ] = (function( innerCb ) { return function () { var args = [].slice.call( arguments ); innerCb && innerCb.apply( this, args ); complete(); }; })( cbRef[ callbackKey ] ); } // If this is just a single callback else { callback = function () { var args = [].slice.call( arguments ); cbRef.apply( this, args ); complete(); }; } } loadScriptOrStyle( needGroup[ callbackKey ], callback, chain, callbackKey, testResult ); } } } } // figure out what this group should do handleGroup( group, !!always || !!testObject['complete']); // Run our loader on the load/both group too // the always stuff always loads second. always && handleGroup( always ); // If complete callback is used without loading anything !always && !!testObject['complete'] && handleGroup(''); } // Someone just decides to load a single script or css file as a string if ( isString( needs ) ) { loadScriptOrStyle( needs, 0, chain, 0 ); } // Normal case is likely an array of different types of loading options else if ( isArray( needs ) ) { // go through the list of needs for( i = 0; i < needs.length; i++ ) { need = needs[ i ]; // if it's a string, just load it if ( isString( need ) ) { loadScriptOrStyle( need, 0, chain, 0 ); } // if it's an array, call our function recursively else if ( isArray( need ) ) { yepnope( need ); } // if it's an object, use our modernizr logic to win else if ( isObject( need ) ) { loadFromTestObject( need, chain ); } } } // Allow a single object to be passed in else if ( isObject( needs ) ) { loadFromTestObject( needs, chain ); } }; // This publicly exposed function is for allowing // you to add functionality based on prefixes on the // string files you add. 'css!' is a builtin prefix // // The arguments are the prefix (not including the !) as a string // and // A callback function. This function is passed a resource object // that can be manipulated and then returned. (like middleware. har.) // // Examples of this can be seen in the officially supported ie prefix yepnope['addPrefix'] = function ( prefix, callback ) { prefixes[ prefix ] = callback; }; // A filter is a global function that every resource // object that passes through yepnope will see. You can // of course conditionally choose to modify the resource objects // or just pass them along. The filter function takes the resource // object and is expected to return one. // // The best example of a filter is the 'autoprotocol' officially // supported filter yepnope['addFilter'] = function ( filter ) { globalFilters.push( filter ); }; // Default error timeout to 10sec - modify to alter yepnope['errorTimeout'] = 1e4; // Webreflection readystate hack // safe for jQuery 1.4+ ( i.e. don't use yepnope with jQuery 1.3.2 ) // if the readyState is null and we have a listener if ( doc.readyState == null && doc.addEventListener ) { // set the ready state to loading doc.readyState = "loading"; // call the listener doc.addEventListener( "DOMContentLoaded", handler = function () { // Remove the listener doc.removeEventListener( "DOMContentLoaded", handler, 0 ); // Set it to ready doc.readyState = "complete"; }, 0 ); } // Attach loader & // Leak it window['yepnope'] = getYepnope(); // Exposing executeStack to better facilitate plugins window['yepnope']['executeStack'] = executeStack; window['yepnope']['injectJs'] = injectJs; window['yepnope']['injectCss'] = injectCss; })( window, document ); // Reappropriate ModernizrProto['load'] = function() { window['yepnope'].apply(window, [].slice.call(arguments,0)); }; /** * contains returns a boolean for if substr is found within str. */ function contains( str, substr ) { return !!~('' + str).indexOf(substr); } ; var createElement = function() { return document.createElement.apply(document, arguments); }; /** * Create our "modernizr" element that we do most feature tests on. */ var modElem = { elem : createElement('modernizr') }; // Clean up this element Modernizr._q.push(function() { delete modElem.elem; }); var mStyle = { style : modElem.elem.style }; // kill ref for gc, must happen before // mod.elem is removed, so we unshift on to // the front of the queue. Modernizr._q.unshift(function() { delete mStyle.style; }); function getBody() { // After page load injecting a fake body doesn't work so check if body exists var body = document.body; if(!body) { // Can't use the real body create a fake one. body = createElement('body'); body.fake = true; } return body; } ; // Inject element with style element and some CSS rules function injectElementWithStyles( rule, callback, nodes, testnames ) { var mod = 'modernizr'; var style; var ret; var node; var docOverflow; var div = createElement('div'); var body = getBody(); if ( parseInt(nodes, 10) ) { // In order not to give false positives we create a node for each test // This also allows the method to scale for unspecified uses while ( nodes-- ) { node = createElement('div'); node.id = testnames ? testnames[nodes] : mod + (nodes + 1); div.appendChild(node); } } // '].join(''); div.id = mod; // IE6 will false positive on some tests due to the style element inside the test div somehow interfering offsetHeight, so insert it into body or fakebody. // Opera will act all quirky when injecting elements in documentElement when page is served as xml, needs fakebody too. #270 (!body.fake ? div : body).innerHTML += style; body.appendChild(div); if ( body.fake ) { //avoid crashing IE8, if background image is used body.style.background = ''; //Safari 5.13/5.1.4 OSX stops loading if ::-webkit-scrollbar is used and scrollbars are visible body.style.overflow = 'hidden'; docOverflow = docElement.style.overflow; docElement.style.overflow = 'hidden'; docElement.appendChild(body); } ret = callback(div, rule); // If this is done after page load we don't want to remove the body so check if body exists if ( body.fake ) { body.parentNode.removeChild(body); docElement.style.overflow = docOverflow; // Trigger layout so kinetic scrolling isn't disabled in iOS6+ docElement.offsetHeight; } else { div.parentNode.removeChild(div); } return !!ret; } ; // Helper function for e.g. boxSizing -> box-sizing function domToHyphenated( name ) { return name.replace(/([A-Z])/g, function(str, m1) { return '-' + m1.toLowerCase(); }).replace(/^ms-/, '-ms-'); } ; // Function to allow us to use native feature detection functionality if available. // Accepts a list of property names and a single value // Returns `undefined` if native detection not available function nativeTestProps ( props, value ) { var i = props.length; // Start with the JS API: http://www.w3.org/TR/css3-conditional/#the-css-interface if ('CSS' in window && 'supports' in window.CSS) { // Try every prefixed variant of the property while (i--) { if (window.CSS.supports(domToHyphenated(props[i]), value)) { return true; } } return false; } // Otherwise fall back to at-rule (for FF 17 and Opera 12.x) else if ('CSSSupportsRule' in window) { // Build a condition string for every prefixed variant var conditionText = []; while (i--) { conditionText.push('(' + domToHyphenated(props[i]) + ':' + value + ')'); } conditionText = conditionText.join(' or '); return injectElementWithStyles('@supports (' + conditionText + ') { #modernizr { position: absolute; } }', function( node ) { return (window.getComputedStyle ? getComputedStyle(node, null) : node.currentStyle)['position'] == 'absolute'; }); } return undefined; } ; // testProps is a generic CSS / DOM property test. // In testing support for a given CSS property, it's legit to test: // `elem.style[styleName] !== undefined` // If the property is supported it will return an empty string, // if unsupported it will return undefined. // We'll take advantage of this quick test and skip setting a style // on our modernizr element, but instead just testing undefined vs // empty string. // Because the testing of the CSS property names (with "-", as // opposed to the camelCase DOM properties) is non-portable and // non-standard but works in WebKit and IE (but not Gecko or Opera), // we explicitly reject properties with dashes so that authors // developing in WebKit or IE first don't end up with // browser-specific content by accident. function testProps( props, prefixed, value, skipValueTest ) { skipValueTest = is(skipValueTest, 'undefined') ? false : skipValueTest; // Try native detect first if (!is(value, 'undefined')) { var result = nativeTestProps(props, value); if(!is(result, 'undefined')) { return result; } } // Otherwise do it properly var afterInit, i, prop, before; // If we don't have a style element, that means // we're running async or after the core tests, // so we'll need to create our own elements to use if ( !mStyle.style ) { afterInit = true; mStyle.modElem = createElement('modernizr'); mStyle.style = mStyle.modElem.style; } // Delete the objects if we // we created them. function cleanElems() { if (afterInit) { delete mStyle.style; delete mStyle.modElem; } } for ( i in props ) { prop = props[i]; before = mStyle.style[prop]; if ( !contains(prop, '-') && mStyle.style[prop] !== undefined ) { // If value to test has been passed in, do a set-and-check test. // 0 (integer) is a valid property value, so check that `value` isn't // undefined, rather than just checking it's truthy. if (!skipValueTest && !is(value, 'undefined')) { // Needs a try catch block because of old IE. This is slow, but will // be avoided in most cases because `skipValueTest` will be used. try { mStyle.style[prop] = value; } catch (e) {} // If the property value has changed, we assume the value used is // supported. If `value` is empty string, it'll fail here (because // it hasn't changed), which matches how browsers have implemented // CSS.supports() if (mStyle.style[prop] != before) { cleanElems(); return prefixed == 'pfx' ? prop : true; } } // Otherwise just return true, or the property name if this is a // `prefixed()` call else { cleanElems(); return prefixed == 'pfx' ? prop : true; } } } cleanElems(); return false; } ; // Modernizr.testProp() investigates whether a given style property is recognized // Note that the property names must be provided in the camelCase variant. // Modernizr.testProp('pointerEvents') // Also accepts optional 2nd arg, of a value to use for native feature detection, e.g.: // Modernizr.testProp('pointerEvents', 'none') var testProp = ModernizrProto.testProp = function( prop, value, useValue ) { return testProps([prop], undefined, value, useValue); }; var slice = classes.slice; // Adapted from ES5-shim https://github.com/kriskowal/es5-shim/blob/master/es5-shim.js // es5.github.com/#x15.3.4.5 if (!Function.prototype.bind) { Function.prototype.bind = function bind(that) { var target = this; if (typeof target != 'function') { throw new TypeError(); } var args = slice.call(arguments, 1); var bound = function() { if (this instanceof bound) { var F = function(){}; F.prototype = target.prototype; var self = new F(); var result = target.apply( self, args.concat(slice.call(arguments)) ); if (Object(result) === result) { return result; } return self; } else { return target.apply( that, args.concat(slice.call(arguments)) ); } }; return bound; }; } ; /*! { "name": "a[download] Attribute", "property": "adownload", "caniuse" : "download", "tags": ["media", "attribute"], "notes": [{ "name": "WhatWG Reference", "href": "http://developers.whatwg.org/links.html#downloading-resources" }] } !*/ /* DOC When used on an ``, this attribute signifies that the resource it points to should be downloaded by the browser rather than navigating to it. */ Modernizr.addTest('adownload', !window.externalHost && 'download' in createElement('a')); /*! { "name": "Application Cache", "property": "applicationcache", "caniuse": "offline-apps", "tags": ["storage", "offline"], "notes": [{ "name": "MDN documentation", "href": "https://developer.mozilla.org/en/docs/HTML/Using_the_application_cache" }], "polyfills": ["html5gears"] } !*/ /* DOC Detects support for the Application Cache, for storing data to enable web-based applications run offline. The API has been [heavily criticized](http://alistapart.com/article/application-cache-is-a-douchebag) and discussions are underway to address this. */ Modernizr.addTest('applicationcache', 'applicationCache' in window); /*! { "name": "Audio Loop Attribute", "property": "audioloop", "tags": ["audio", "media"] } !*/ Modernizr.addTest('audioloop', 'loop' in createElement('audio')); /*! { "name": "Audio Preload Attribute", "property": "audiopreload", "tags": ["audio", "media"] } !*/ Modernizr.addTest('audiopreload', 'preload' in createElement('audio')); /*! { "name" : "HTML5 Audio Element", "property": "audio", "aliases" : [], "tags" : ["html5", "audio", "media"], "doc" : "/docs/#audio", "knownBugs": [], "authors" : [] } !*/ // This tests evaluates support of the audio element, as well as // testing what types of content it supports. // // We're using the Boolean constructor here, so that we can extend the value // e.g. Modernizr.audio // true // Modernizr.audio.ogg // 'probably' // // Codec values from : github.com/NielsLeenheer/html5test/blob/9106a8/index.html#L845 // thx to NielsLeenheer and zcorpan // Note: in some older browsers, "no" was a return value instead of empty string. // It was live in FF3.5.0 and 3.5.1, but fixed in 3.5.2 // It was also live in Safari 4.0.0 - 4.0.4, but fixed in 4.0.5 Modernizr.addTest('audio', function() { /* jshint -W053 */ var elem = createElement('audio'); var bool = false; try { if ( bool = !!elem.canPlayType ) { bool = new Boolean(bool); bool.ogg = elem.canPlayType('audio/ogg; codecs="vorbis"').replace(/^no$/,''); bool.mp3 = elem.canPlayType('audio/mpeg;') .replace(/^no$/,''); bool.opus = elem.canPlayType('audio/ogg; codecs="opus"') .replace(/^no$/,''); // Mimetypes accepted: // developer.mozilla.org/En/Media_formats_supported_by_the_audio_and_video_elements // bit.ly/iphoneoscodecs bool.wav = elem.canPlayType('audio/wav; codecs="1"') .replace(/^no$/,''); bool.m4a = ( elem.canPlayType('audio/x-m4a;') || elem.canPlayType('audio/aac;')) .replace(/^no$/,''); } } catch(e) { } return bool; }); /*! { "name": "Canvas", "property": "canvas", "caniuse": "canvas", "tags": ["canvas", "graphics"], "polyfills": ["flashcanvas", "excanvas", "slcanvas", "fxcanvas"] } !*/ /* DOC Detects support for the `` element for 2D drawing. */ // On the S60 and BB Storm, getContext exists, but always returns undefined // so we actually have to call getContext() to verify // github.com/Modernizr/Modernizr/issues/issue/97/ Modernizr.addTest('canvas', function() { var elem = createElement('canvas'); return !!(elem.getContext && elem.getContext('2d')); }); /*! { "name": "canvas.toDataURL type support", "property": ["todataurljpeg", "todataurlpng", "todataurlwebp"], "tags": ["canvas"], "async" : false, "notes": [{ "name": "HTML5 Spec", "href": "http://www.w3.org/TR/html5/the-canvas-element.html#dom-canvas-todataurl" }] } !*/ var canvas = createElement('canvas'); Modernizr.addTest('todataurljpeg', function() { return !!Modernizr.canvas && canvas.toDataURL('image/jpeg').indexOf('data:image/jpeg') === 0; }); Modernizr.addTest('todataurlpng', function() { return !!Modernizr.canvas && canvas.toDataURL('image/png').indexOf('data:image/png') === 0; }); Modernizr.addTest('todataurlwebp', function() { return !!Modernizr.canvas && canvas.toDataURL('image/webp').indexOf('data:image/webp') === 0; }); /*! { "name": "Canvas text", "property": "canvastext", "caniuse": "canvas-text", "tags": ["canvas", "graphics"], "polyfills": ["canvastext"] } !*/ /* DOC Detects support for the text APIs for `` elements. */ Modernizr.addTest('canvastext', function() { if (Modernizr.canvas === false) return false; return typeof createElement('canvas').getContext('2d').fillText == 'function'; }); /*! { "name": "Content Editable", "property": "contenteditable", "caniuse": "contenteditable", "notes": [{ "name": "WHATWG spec", "href": "http://www.whatwg.org/specs/web-apps/current-work/multipage/editing.html#contenteditable" }] } !*/ /* DOC Detects support for the `contenteditable` attribute of elements, allowing their DOM text contents to be edited directly by the user. */ Modernizr.addTest('contenteditable', function() { // early bail out if (!('contentEditable' in docElement)) return; // some mobile browsers (android < 3.0, iOS < 5) claim to support // contentEditable, but but don't really. This test checks to see // confirms wether or not it actually supports it. var div = createElement('div'); div.contentEditable = true; return div.contentEditable === 'true'; }); /*! { "name": "Content Security Policy", "property": "contentsecuritypolicy", "caniuse": "contentsecuritypolicy", "tags": ["security"], "notes": [{ "name": "W3C spec", "href": "http://www.w3.org/TR/CSP/" },{ "name": "MDN documentation", "href": "https://developer.mozilla.org/en-US/docs/Security/CSP" }] } !*/ /* DOC Detects support for the Content Security Policy protocol for mitigating and reporting security attacks. */ Modernizr.addTest('contentsecuritypolicy', ('securityPolicy' in document || 'SecurityPolicy' in document)); /*! { "name": "Context menus", "property": "contextmenu", "caniuse": "menu", "notes": [{ "name": "W3C spec", "href": "http://www.w3.org/TR/html5/interactive-elements.html#context-menus" },{ "name": "thewebrocks.com Demo", "href": "http://thewebrocks.com/demos/context-menu/" }], "polyfills": ["jquery-contextmenu"] } !*/ /* DOC Detects support for custom context menus. */ Modernizr.addTest( 'contextmenu', ('contextMenu' in docElement && 'HTMLMenuItemElement' in window) ); /*! { "name": "Cookies", "property": "cookies", "tags": ["storage"], "authors": ["tauren"] } !*/ /* DOC Detects whether cookie support is enabled. */ // https://github.com/Modernizr/Modernizr/issues/191 Modernizr.addTest('cookies', function () { // navigator.cookieEnabled is in IE9 but always true. Don't rely on it. // try..catch because some in situations `document.cookie` is exposed but throws a // SecurityError if you try to access it; e.g. documents created from data URIs // or in sandboxed iframes (depending on flags/context) try { // Create cookie document.cookie = 'cookietest=1'; var ret = document.cookie.indexOf('cookietest=') != -1; // Delete cookie document.cookie = 'cookietest=1; expires=Thu, 01-Jan-1970 00:00:01 GMT'; return ret; } catch (e) { return false; } }); // Following spec is to expose vendor-specific style properties as: // elem.style.WebkitBorderRadius // and the following would be incorrect: // elem.style.webkitBorderRadius // Webkit ghosts their properties in lowercase but Opera & Moz do not. // Microsoft uses a lowercase `ms` instead of the correct `Ms` in IE8+ // erik.eae.net/archives/2008/03/10/21.48.10/ // More here: github.com/Modernizr/Modernizr/issues/issue/21 var omPrefixes = 'Webkit Moz O ms'; var cssomPrefixes = omPrefixes.split(' '); ModernizrProto._cssomPrefixes = cssomPrefixes; var domPrefixes = omPrefixes.toLowerCase().split(' '); ModernizrProto._domPrefixes = domPrefixes; /** * testDOMProps is a generic DOM property test; if a browser supports * a certain property, it won't return undefined for it. */ function testDOMProps( props, obj, elem ) { var item; for ( var i in props ) { if ( props[i] in obj ) { // return the property name as a string if (elem === false) return props[i]; item = obj[props[i]]; // let's bind a function (and it has a bind method -- certain native objects that report that they are a // function don't [such as webkitAudioContext]) if (is(item, 'function') && 'bind' in item){ // default to autobind unless override return item.bind(elem || obj); } // return the unbound function or obj or value return item; } } return false; } ; /** * testPropsAll tests a list of DOM properties we want to check against. * We specify literally ALL possible (known and/or likely) properties on * the element including the non-vendor prefixed one, for forward- * compatibility. */ function testPropsAll( prop, prefixed, elem, value, skipValueTest ) { var ucProp = prop.charAt(0).toUpperCase() + prop.slice(1), props = (prop + ' ' + cssomPrefixes.join(ucProp + ' ') + ucProp).split(' '); // did they call .prefixed('boxSizing') or are we just testing a prop? if(is(prefixed, 'string') || is(prefixed, 'undefined')) { return testProps(props, prefixed, value, skipValueTest); // otherwise, they called .prefixed('requestAnimationFrame', window[, elem]) } else { props = (prop + ' ' + (domPrefixes).join(ucProp + ' ') + ucProp).split(' '); return testDOMProps(props, prefixed, elem); } } // Modernizr.testAllProps() investigates whether a given style property, // or any of its vendor-prefixed variants, is recognized // Note that the property names must be provided in the camelCase variant. // Modernizr.testAllProps('boxSizing') ModernizrProto.testAllProps = testPropsAll; /** * testAllProps determines whether a given CSS property, in some prefixed * form, is supported by the browser. It can optionally be given a value; in * which case testAllProps will only return true if the browser supports that * value for the named property; this latter case will use native detection * (via window.CSS.supports) if available. A boolean can be passed as a 3rd * parameter to skip the value check when native detection isn't available, * to improve performance when simply testing for support of a property. * * @param prop - String naming the property to test * @param value - [optional] String of the value to test * @param skipValueTest - [optional] Whether to skip testing that the value * is supported when using non-native detection * (default: false) */ function testAllProps (prop, value, skipValueTest) { return testPropsAll(prop, undefined, undefined, value, skipValueTest); } ModernizrProto.testAllProps = testAllProps; /*! { "name": "CSS Animations", "property": "cssanimations", "caniuse": "css-animation", "polyfills": ["transformie", "csssandpaper"], "tags": ["css"], "warnings": ["Android < 4 will pass this test, but can only animate a single property at a time"], "notes": [{ "name" : "Article: 'Dispelling the Android CSS animation myths'", "href": "http://goo.gl/CHVJm" }] } !*/ Modernizr.addTest('cssanimations', testAllProps('animationName', 'a', true)); /*! { "name": "CSS Background Clip Text", "property": "backgroundcliptext", "authors": ["ausi"], "tags": ["css"], "notes": [ { "name": "CSS Tricks Article", "href": "http://css-tricks.com/image-under-text/" }, { "name": "MDN Docs", "href": "http://developer.mozilla.org/en/CSS/background-clip" }, { "name": "Related Github Issue", "href": "http://github.com/Modernizr/Modernizr/issues/199" } ] } !*/ Modernizr.addTest('backgroundcliptext', function() { return testAllProps('backgroundClip', 'text'); }); /*! { "name": "Background Position Shorthand", "property": "bgpositionshorthand", "tags": ["css"], "notes": [{ "name": "MDN Docs", "href": "https://developer.mozilla.org/en/CSS/background-position" }, { "name": "W3 Spec", "href": "http://www.w3.org/TR/css3-background/#background-position" }, { "name": "Demo", "href": "http://jsfiddle.net/Blink/bBXvt/" }] } !*/ Modernizr.addTest('bgpositionshorthand', function() { var elem = createElement('a'); var eStyle = elem.style; var val = 'right 10px bottom 10px'; eStyle.cssText = 'background-position: ' + val + ';'; return (eStyle.backgroundPosition === val); }); /*! { "name": "Background Position XY", "property": "bgpositionxy", "tags": ["css"], "authors": ["Allan Lei", "Brandom Aaron"], "notes": [{ "name": "Demo", "href": "http://jsfiddle.net/allanlei/R8AYS/" }, { "name": "Adapted From", "href": "https://github.com/brandonaaron/jquery-cssHooks/blob/master/bgpos.js" }] } !*/ Modernizr.addTest('bgpositionxy', function () { return testAllProps('backgroundPositionX', '3px', true) && testAllProps('backgroundPositionY', '5px', true); }); /*! { "name": "Background Repeat", "property": ["bgrepeatspace", "bgrepeatround"], "tags": ["css"], "authors": ["Ryan Seddon"], "notes": [{ "name": "MDN Docs", "href": "http://developer.mozilla.org/en/CSS/background-repeat" }, { "name": "Test Page", "href": "http://jsbin.com/uzesun/" }, { "name": "Demo", "href": "http://jsfiddle.net/ryanseddon/yMLTQ/6/" }] } !*/ // Must value-test these Modernizr.addTest('bgrepeatround', testAllProps('backgroundRepeat', 'round')); Modernizr.addTest('bgrepeatspace', testAllProps('backgroundRepeat', 'space')); /*! { "name": "Background Size", "property": "backgroundsize", "tags": ["css"], "knownBugs": ["This will false positive in Opera Mini - http://github.com/Modernizr/Modernizr/issues/396"], "notes": [{ "name": "Related Issue", "href": "http://github.com/Modernizr/Modernizr/issues/396" }] } !*/ Modernizr.addTest('backgroundsize', testAllProps('backgroundSize', '100%', true)); /*! { "name": "Background Size Cover", "property": "bgsizecover", "tags": ["css"], "notes": [{ "name" : "MDN Docs", "href": "http://developer.mozilla.org/en/CSS/background-size" }] } !*/ // Must test value, as this specifically tests the `cover` value Modernizr.addTest('bgsizecover', testAllProps('backgroundSize', 'cover')); /*! { "name": "Border Image", "property": "borderimage", "caniuse": "border-image", "polyfills": ["css3pie"], "knownBugs": ["Android < 2.0 is true, but has a broken implementation"], "tags": ["css"] } !*/ Modernizr.addTest('borderimage', testAllProps('borderImage', 'url() 1', true)); /*! { "name": "Border Radius", "property": "borderradius", "caniuse": "border-radius", "polyfills": ["css3pie"], "tags": ["css"], "notes": [{ "name": "Comprehensive Compat Chart", "href": "http://muddledramblings.com/table-of-css3-border-radius-compliance" }] } !*/ Modernizr.addTest('borderradius', testAllProps('borderRadius', '0px', true)); /*! { "name": "Box Shadow", "property": "boxshadow", "caniuse": "css-boxshadow", "tags": ["css"], "knownBugs": ["WebOS false positives on this test."] } !*/ Modernizr.addTest('boxshadow', testAllProps('boxShadow', '1px 1px', true)); /*! { "name": "Box Sizing", "property": "boxsizing", "caniuse": "css3-boxsizing", "polyfills": ["borderboxmodel", "boxsizingpolyfill", "borderbox"], "tags": ["css"], "notes": [{ "name": "MDN Docs", "href": "http://developer.mozilla.org/en/CSS/box-sizing" },{ "name": "Related Github Issue", "href": "http://github.com/Modernizr/Modernizr/issues/248" }] } !*/ Modernizr.addTest('boxsizing', testAllProps('boxSizing', 'border-box', true) && (document.documentMode === undefined || document.documentMode > 7)); // List of property values to set for css tests. See ticket #21 var prefixes = ' -webkit- -moz- -o- -ms- '.split(' '); // expose these for the plugin API. Look in the source for how to join() them against your input ModernizrProto._prefixes = prefixes; /*! { "name": "CSS Calc", "property": "csscalc", "caniuse": "calc", "tags": ["css"], "authors": ["@calvein"] } !*//* DOC Method of allowing calculated values for length units. For example: ```css #elem { width: calc(100% - 3em); } ``` */ Modernizr.addTest('csscalc', function() { var prop = 'width:'; var value = 'calc(10px);'; var el = createElement('div'); el.style.cssText = prop + prefixes.join(value + prop); return !!el.style.length; }); var testStyles = ModernizrProto.testStyles = injectElementWithStyles; /*! { "name": "CSS :checked pseudo-selector", "caniuse": "css-sel3", "property": "checked", "tags": ["css"], "notes": [{ "name": "Related Github Issue", "href": "https://github.com/Modernizr/Modernizr/pull/879" }] } !*/ Modernizr.addTest('checked', function(){ return testStyles('#modernizr {position:absolute} #modernizr input {margin-left:10px} #modernizr :checked {margin-left:20px;display:block}', function( elem ){ var cb = createElement('input'); cb.setAttribute('type', 'checkbox'); cb.setAttribute('checked', 'checked'); elem.appendChild(cb); return cb.offsetLeft === 20; }); }); /*! { "name": "CSS Columns", "property": "csscolumns", "caniuse": "multicolumn", "polyfills": ["css3multicolumnjs"], "tags": ["css"] } !*/ (function() { /* jshint -W053 */ Modernizr.addTest('csscolumns', function(){ var bool = false; var test = testAllProps('columnCount'); try { if ( bool = !!test ) { bool = new Boolean(bool); } } catch(e){} return bool; }); var props = ['Width', 'Span', 'Fill', 'Gap', 'Rule', 'RuleColor', 'RuleStyle', 'RuleWidth', 'BreakBefore', 'BreakAfter', 'BreakInside']; var name, test; for (var i = 0; i < props.length; i++) { name = props[i].toLowerCase(); test = testAllProps('column' + props[i]); // break-before, break-after & break-inside are not "column"-prefixed in spec if (name === 'breakbefore' || name === 'breakafter' || name == 'breakinside') { test = test || testAllProps(props[i]); } Modernizr.addTest('csscolumns.' + name, test); } })(); /*! { "name": "CSS Cubic Bezier Range", "property": "cubicbezierrange", "tags": ["css"], "doc" : null, "authors": ["@calvein"], "warnings": ["cubic-bezier values can't be > 1 for Webkit until [bug #45761](https://bugs.webkit.org/show_bug.cgi?id=45761) is fixed"] } !*/ Modernizr.addTest('cubicbezierrange', function() { var el = createElement('div'); el.style.cssText = prefixes.join('transition-timing-function:cubic-bezier(1,0,0,1.1); '); return !!el.style.length; }); /*! { "name": "CSS Display run-in", "property": "display-runin", "authors": ["alanhogan"], "tags": ["css"], "notes": [{ "name": "CSS Tricks Article", "href": "http://css-tricks.com/596-run-in/" },{ "name": "Related Github Issue", "href": "https://github.com/Modernizr/Modernizr/issues/198" }] } !*/ Modernizr.addTest('displayrunin', testAllProps('display', 'run-in'), { aliases: ['display-runin'] }); /*! { "name": "CSS Display table", "property": "displaytable", "caniuse": "css-table", "authors": ["scottjehl"], "tags": ["css"], "notes": [{ "name": "All additional table display values", "href": "http://pastebin.com/Gk9PeVaQ" }] } !*//* DOC `display: table` and `table-cell` test. (both are tested under one name `table-cell` ) All additional table display values are here: http://pastebin.com/Gk9PeVaQ though Scott has seen some IE false positives with that sort of weak detection. More testing neccessary perhaps. */ // If a document is in rtl mode this test will fail so we force ltr mode on the injeced // element https://github.com/Modernizr/Modernizr/issues/716 testStyles('#modernizr{display: table; direction: ltr}#modernizr div{display: table-cell; padding: 10px}', function( elem ) { var ret; var child = elem.children; ret = child[0].offsetLeft < child[1].offsetLeft; Modernizr.addTest('displaytable', ret, { aliases: ['display-table'] }); },2); /*! { "name": "CSS text-overflow ellipsis", "property": "ellipsis", "caniuse": "text-overflow", "polyfills": [ "text-overflow" ], "tags": ["css"] } !*/ Modernizr.addTest('ellipsis', testAllProps('textOverflow', 'ellipsis')); /*! { "name": "CSS Filters", "property": "cssfilters", "caniuse": "css-filters", "polyfills": ["polyfilter"], "tags": ["css"] } !*/ // https://github.com/Modernizr/Modernizr/issues/615 // documentMode is needed for false positives in oldIE, please see issue above Modernizr.addTest('cssfilters', function() { var el = createElement('div'); el.style.cssText = prefixes.join('filter:blur(2px); '); return !!el.style.length && ((document.documentMode === undefined || document.documentMode > 9)); }); /*! { "name": "Flexbox", "property": "flexbox", "caniuse": "flexbox", "tags": ["css"], "notes": [{ "name": "The _new_ flexbox", "href": "http://dev.w3.org/csswg/css3-flexbox" }], "warnings": [ "A `true` result for this detect does not imply that the `flex-wrap` property is supported; see the `flexwrap` detect." ] } !*/ /* DOC Detects support for the Flexible Box Layout model, a.k.a. Flexbox, which allows easy manipulation of layout order and sizing within a container. */ Modernizr.addTest('flexbox', testAllProps('flexBasis', '1px', true)); /*! { "name": "Flexbox (legacy)", "property": "flexboxlegacy", "tags": ["css"], "polyfills": ["flexie"], "notes": [{ "name": "The _old_ flexbox", "href": "http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/" }] } !*/ Modernizr.addTest('flexboxlegacy', testAllProps('boxDirection', 'reverse', true)); /*! { "name": "Flexbox (tweener)", "property": "flexboxtweener", "tags": ["css"], "polyfills": ["flexie"], "notes": [{ "name": "The _inbetween_ flexbox", "href": "http://www.w3.org/TR/2011/WD-css3-flexbox-20111129/" }] } !*/ Modernizr.addTest('flexboxtweener', testAllProps('flexAlign', 'end', true)); /*! { "name": "Flex Line Wrapping", "property": "flexwrap", "tags": ["css", "flexbox"], "notes": [{ "name": "W3C Flexible Box Layout spec", "href": "http://dev.w3.org/csswg/css3-flexbox" }], "warnings": [ "Does not imply a modern implementation – see documentation." ] } !*/ /* DOC Detects support for the `flex-wrap` CSS property, part of Flexbox, which isn’t present in all Flexbox implementations (notably Firefox). This featured in both the 'tweener' syntax (implemented by IE10) and the 'modern' syntax (implemented by others). This detect will return `true` for either of these implementations, as long as the `flex-wrap` property is supported. So to ensure the modern syntax is supported, use together with `Modernizr.flexbox`: ```javascript if (Modernizr.flexbox && Modernizr.flexwrap) { // Modern Flexbox with `flex-wrap` supported } else { // Either old Flexbox syntax, or `flex-wrap` not supported } ``` */ Modernizr.addTest('flexwrap', testAllProps('flexWrap', 'wrap', true)); /*! { "name": "@font-face", "property": "fontface", "authors": ["Diego Perini", "Mat Marquis"], "tags": ["css"], "knownBugs": [ "False Positive: WebOS http://github.com/Modernizr/Modernizr/issues/342", "False Postive: WP7 http://github.com/Modernizr/Modernizr/issues/538" ], "notes": [{ "name": "@font-face detection routine by Diego Perini", "href": "http://javascript.nwbox.com/CSSSupport/" },{ "name": "Filament Group @font-face compatibility research", "href": "https://docs.google.com/presentation/d/1n4NyG4uPRjAA8zn_pSQ_Ket0RhcWC6QlZ6LMjKeECo0/edit#slide=id.p" },{ "name": "Filament Grunticon/@font-face device testing results", "href": "https://docs.google.com/spreadsheet/ccc?key=0Ag5_yGvxpINRdHFYeUJPNnZMWUZKR2ItMEpRTXZPdUE#gid=0" },{ "name": "CSS fonts on Android", "href": "http://stackoverflow.com/questions/3200069/css-fonts-on-android" },{ "name": "@font-face and Android", "href": "http://archivist.incutio.com/viewlist/css-discuss/115960" }] } !*/ var blacklist = (function() { var ua = navigator.userAgent; var wkvers = ua.match( /applewebkit\/([0-9]+)/gi ) && parseFloat( RegExp.$1 ); var webos = ua.match( /w(eb)?osbrowser/gi ); var wppre8 = ua.match( /windows phone/gi ) && ua.match( /iemobile\/([0-9])+/gi ) && parseFloat( RegExp.$1 ) >= 9; var oldandroid = wkvers < 533 && ua.match( /android/gi ); return webos || oldandroid || wppre8; }()); if( blacklist ) { Modernizr.addTest('fontface', false); } else { testStyles('@font-face {font-family:"font";src:url("https://")}', function( node, rule ) { var style = document.getElementById('smodernizr'); var sheet = style.sheet || style.styleSheet; var cssText = sheet ? (sheet.cssRules && sheet.cssRules[0] ? sheet.cssRules[0].cssText : sheet.cssText || '') : ''; var bool = /src/i.test(cssText) && cssText.indexOf(rule.split(' ')[0]) === 0; Modernizr.addTest('fontface', bool); }); } ; /*! { "name": "CSS Generated Content", "property": "generatedcontent", "tags": ["css"], "warnings": ["Android won't return correct height for anything below 7px #738"] } !*/ testStyles('#modernizr{font:0/0 a}#modernizr:after{content:":)";visibility:hidden;font:7px/1 a}', function( node ) { Modernizr.addTest('generatedcontent', node.offsetHeight >= 7); }); /*! { "name": "CSS Gradients", "caniuse": "css-gradients", "property": "cssgradients", "tags": ["css"], "knownBugs": ["False-positives on webOS (https://github.com/Modernizr/Modernizr/issues/202)"], "notes": [{ "name": "Webkit Gradient Syntax", "href": "http://webkit.org/blog/175/introducing-css-gradients/" },{ "name": "Mozilla Linear Gradient Syntax", "href": "http://developer.mozilla.org/en/CSS/-moz-linear-gradient" },{ "name": "Mozilla Radial Gradient Syntax", "href": "http://developer.mozilla.org/en/CSS/-moz-radial-gradient" },{ "name": "W3C Gradient Spec", "href": "dev.w3.org/csswg/css3-images/#gradients-" }] } !*/ Modernizr.addTest('cssgradients', function() { var str1 = 'background-image:'; var str2 = 'gradient(linear,left top,right bottom,from(#9f9),to(white));'; var str3 = 'linear-gradient(left top,#9f9, white);'; var css = // legacy webkit syntax (FIXME: remove when syntax not in use anymore) (str1 + '-webkit- '.split(' ').join(str2 + str1) + // standard syntax // trailing 'background-image:' prefixes.join(str3 + str1)).slice(0, -str1.length); var elem = createElement('div'); var style = elem.style; style.cssText = css; // IE6 returns undefined so cast to string return ('' + style.backgroundImage).indexOf('gradient') > -1; }); /*! { "name": "CSS HSLA Colors", "caniuse": "css3-colors", "property": "hsla", "tags": ["css"], "notes": ["Same as rgba(), in fact, browsers re-map hsla() to rgba() internally, except IE9 who retains it as hsla"] } !*/ Modernizr.addTest('hsla', function() { var elem = createElement('div'); var style = elem.style; style.cssText = 'background-color:hsla(120,40%,100%,.5)'; return contains(style.backgroundColor, 'rgba') || contains(style.backgroundColor, 'hsla'); }); /*! { "name": "CSS Hyphens", "caniuse": "css-hyphens", "property": ["csshyphens", "softhyphens", "softhyphensfind"], "tags": ["css"], "async" : true, "authors": ["David Newton"], "warnings": [ "These tests currently require document.body to be present", "If loading Hyphenator.js via Modernizr.load, be cautious of issue 158: http://code.google.com/p/hyphenator/issues/detail?id=158", "This is very large – only include it if you absolutely need it" ], "notes": [ "csshyphens - tests hyphens:auto actually adds hyphens to text", "softhyphens - tests that ­ does its job", "softhyphensfind - tests that in-browser Find functionality still works correctly with ­", { "name": "The Current State of Hyphenation on the Web.", "href": "http://davidnewton.ca/the-current-state-of-hyphenation-on-the-web" }, { "name": "Hyphenation Test Page", "href": "http://davidnewton.ca/demos/hyphenation/test.html" }, { "name": "Hyphenation is Language Specific", "href": " http://code.google.com/p/hyphenator/source/diff?spec=svn975&r=975&format=side&path=/trunk/Hyphenator.js#sc_svn975_313" }, { "name": "Related Modernizr Issue", "href": "https://github.com/Modernizr/Modernizr/issues/312" } ] } !*/ Modernizr.addAsyncTest(function() { var waitTime = 300; setTimeout(runHyphenTest, waitTime); // Wait 1000ms so we can hope for document.body function runHyphenTest() { if (!document.body && !document.getElementsByTagName('body')[0]) { setTimeout(runHyphenTest, waitTime); return; } // functional test of adding hyphens:auto function test_hyphens_css() { try { /* create a div container and a span within that * these have to be appended to document.body, otherwise some browsers can give false negative */ var div = createElement('div'); var span = createElement('span'); var divStyle = div.style; var spanHeight = 0; var spanWidth = 0; var result = false; var firstChild = document.body.firstElementChild || document.body.firstChild; div.appendChild(span); span.innerHTML = 'Bacon ipsum dolor sit amet jerky velit in culpa hamburger et. Laborum dolor proident, enim dolore duis commodo et strip steak. Salami anim et, veniam consectetur dolore qui tenderloin jowl velit sirloin. Et ad culpa, fatback cillum jowl ball tip ham hock nulla short ribs pariatur aute. Pig pancetta ham bresaola, ut boudin nostrud commodo flank esse cow tongue culpa. Pork belly bresaola enim pig, ea consectetur nisi. Fugiat officia turkey, ea cow jowl pariatur ullamco proident do laborum velit sausage. Magna biltong sint tri-tip commodo sed bacon, esse proident aliquip. Ullamco ham sint fugiat, velit in enim sed mollit nulla cow ut adipisicing nostrud consectetur. Proident dolore beef ribs, laborum nostrud meatball ea laboris rump cupidatat labore culpa. Shankle minim beef, velit sint cupidatat fugiat tenderloin pig et ball tip. Ut cow fatback salami, bacon ball tip et in shank strip steak bresaola. In ut pork belly sed mollit tri-tip magna culpa veniam, short ribs qui in andouille ham consequat. Dolore bacon t-bone, velit short ribs enim strip steak nulla. Voluptate labore ut, biltong swine irure jerky. Cupidatat excepteur aliquip salami dolore. Ball tip strip steak in pork dolor. Ad in esse biltong. Dolore tenderloin exercitation ad pork loin t-bone, dolore in chicken ball tip qui pig. Ut culpa tongue, sint ribeye dolore ex shank voluptate hamburger. Jowl et tempor, boudin pork chop labore ham hock drumstick consectetur tri-tip elit swine meatball chicken ground round. Proident shankle mollit dolore. Shoulder ut duis t-bone quis reprehenderit. Meatloaf dolore minim strip steak, laboris ea aute bacon beef ribs elit shank in veniam drumstick qui. Ex laboris meatball cow tongue pork belly. Ea ball tip reprehenderit pig, sed fatback boudin dolore flank aliquip laboris eu quis. Beef ribs duis beef, cow corned beef adipisicing commodo nisi deserunt exercitation. Cillum dolor t-bone spare ribs, ham hock est sirloin. Brisket irure meatloaf in, boudin pork belly sirloin ball tip. Sirloin sint irure nisi nostrud aliqua. Nostrud nulla aute, enim officia culpa ham hock. Aliqua reprehenderit dolore sunt nostrud sausage, ea boudin pork loin ut t-bone ham tempor. Tri-tip et pancetta drumstick laborum. Ham hock magna do nostrud in proident. Ex ground round fatback, venison non ribeye in.'; document.body.insertBefore(div, firstChild); /* get size of unhyphenated text */ divStyle.cssText = 'position:absolute;top:0;left:0;width:5em;text-align:justify;text-justification:newspaper;'; spanHeight = span.offsetHeight; spanWidth = span.offsetWidth; /* compare size with hyphenated text */ divStyle.cssText = 'position:absolute;top:0;left:0;width:5em;text-align:justify;'+ 'text-justification:newspaper;'+ prefixes.join('hyphens:auto; '); result = (span.offsetHeight != spanHeight || span.offsetWidth != spanWidth); /* results and cleanup */ document.body.removeChild(div); div.removeChild(span); return result; } catch(e) { return false; } } // for the softhyphens test function test_hyphens( delimiter, testWidth ) { try { /* create a div container and a span within that * these have to be appended to document.body, otherwise some browsers can give false negative */ var div = createElement('div'); var span = createElement('span'); var divStyle = div.style; var spanSize = 0; var result = false; var result1 = false; var result2 = false; var firstChild = document.body.firstElementChild || document.body.firstChild; divStyle.cssText = 'position:absolute;top:0;left:0;overflow:visible;width:1.25em;'; div.appendChild(span); document.body.insertBefore(div, firstChild); /* get height of unwrapped text */ span.innerHTML = 'mm'; spanSize = span.offsetHeight; /* compare height w/ delimiter, to see if it wraps to new line */ span.innerHTML = 'm' + delimiter + 'm'; result1 = (span.offsetHeight > spanSize); /* if we're testing the width too (i.e. for soft-hyphen, not zws), * this is because tested Blackberry devices will wrap the text but not display the hyphen */ if (testWidth) { /* get width of wrapped, non-hyphenated text */ span.innerHTML = 'm
m'; spanSize = span.offsetWidth; /* compare width w/ wrapped w/ delimiter to see if hyphen is present */ span.innerHTML = 'm' + delimiter + 'm'; result2 = (span.offsetWidth > spanSize); } else { result2 = true; } /* results and cleanup */ if (result1 === true && result2 === true) { result = true; } document.body.removeChild(div); div.removeChild(span); return result; } catch(e) { return false; } } // testing if in-browser Find functionality will work on hyphenated text function test_hyphens_find( delimiter ) { try { /* create a dummy input for resetting selection location, and a div container * these have to be appended to document.body, otherwise some browsers can give false negative * div container gets the doubled testword, separated by the delimiter * Note: giving a width to div gives false positive in iOS Safari */ var dummy = createElement('input'); var div = createElement('div'); var testword = 'lebowski'; var result = false; var textrange; var firstChild = document.body.firstElementChild || document.body.firstChild; div.innerHTML = testword + delimiter + testword; document.body.insertBefore(div, firstChild); document.body.insertBefore(dummy, div); /* reset the selection to the dummy input element, i.e. BEFORE the div container * stackoverflow.com/questions/499126/jquery-set-cursor-position-in-text-area */ if (dummy.setSelectionRange) { dummy.focus(); dummy.setSelectionRange(0,0); } else if (dummy.createTextRange) { textrange = dummy.createTextRange(); textrange.collapse(true); textrange.moveEnd('character', 0); textrange.moveStart('character', 0); textrange.select(); } /* try to find the doubled testword, without the delimiter */ if (window.find) { result = window.find(testword + testword); } else { try { textrange = window.self.document.body.createTextRange(); result = textrange.findText(testword + testword); } catch(e) { result = false; } } document.body.removeChild(div); document.body.removeChild(dummy); return result; } catch(e) { return false; } } addTest('csshyphens', function() { if (!testAllProps('hyphens', 'auto', true)) return false; /* Chrome lies about its hyphens support so we need a more robust test crbug.com/107111 */ try { return test_hyphens_css(); } catch(e) { return false; } }); addTest('softhyphens', function() { try { // use numeric entity instead of ­ in case it's XHTML return test_hyphens('­', true) && test_hyphens('​', false); } catch(e) { return false; } }); addTest('softhyphensfind', function() { try { return test_hyphens_find('­') && test_hyphens_find('​'); } catch(e) { return false; } }); } }); /*! { "name": "CSS :last-child pseudo-selector", "caniuse": "css-sel3", "property": "lastchild", "tags": ["css"], "notes": [{ "name": "Related Github Issue", "href": "https://github.com/Modernizr/Modernizr/pull/304" }] } !*/ testStyles('#modernizr div {width:100px} #modernizr :last-child{width:200px;display:block}', function( elem ) { Modernizr.addTest('lastchild', elem.lastChild.offsetWidth > elem.firstChild.offsetWidth); }, 2); /*! { "name": "CSS Mask", "caniuse": "css-masks", "property": "cssmask", "tags": ["css"], "notes": [ "This is for the -webkit-mask feature, not for the similar svg mask in Firefox.", { "name": "Webkit blog on CSS Masks", "href": "http://www.webkit.org/blog/181/css-masks/" }, { "name": "Safari Docs", "href": "http://developer.apple.com/library/safari/#documentation/InternetWeb/Conceptual/SafariVisualEffectsProgGuide/Masks/Masks.html" }, { "name": "Mozilla css svg mask (not this)", "href": "http://developer.mozilla.org/en/CSS/mask" }, { "name": "Combine with clippaths for awesomeness", "href": "http://generic.cx/for/webkit/test.html" } ] } !*/ Modernizr.addTest('cssmask', testAllProps('maskRepeat', 'repeat-x', true)); // adapted from matchMedia polyfill // by Scott Jehl and Paul Irish // gist.github.com/786768 var testMediaQuery = (function () { var matchMedia = window.matchMedia || window.msMatchMedia; if ( matchMedia ) { return function ( mq ) { var mql = matchMedia(mq); return mql && mql.matches || false; }; } return function ( mq ) { var bool = false; injectElementWithStyles('@media ' + mq + ' { #modernizr { position: absolute; } }', function( node ) { bool = (window.getComputedStyle ? window.getComputedStyle(node, null) : node.currentStyle)['position'] == 'absolute'; }); return bool; }; })(); // Modernizr.mq tests a given media query, live against the current state of the window // A few important notes: // * If a browser does not support media queries at all (eg. oldIE) the mq() will always return false // * A max-width or orientation query will be evaluated against the current state, which may change later. // * You must specify values. Eg. If you are testing support for the min-width media query use: // Modernizr.mq('(min-width:0)') // usage: // Modernizr.mq('only screen and (max-width:768)') var mq = ModernizrProto.mq = testMediaQuery; /*! { "name": "CSS Media Queries", "caniuse": "css-mediaqueries", "property": "mediaqueries", "tags": ["css"] } !*/ Modernizr.addTest('mediaqueries', mq('only all')); /*! { "name": "CSS Multiple Backgrounds", "caniuse": "multibackgrounds", "property": "multiplebgs", "tags": ["css"] } !*/ // Setting multiple images AND a color on the background shorthand property // and then querying the style.background property value for the number of // occurrences of "url(" is a reliable method for detecting ACTUAL support for this! Modernizr.addTest('multiplebgs', function() { var elem = createElement('div'); var style = elem.style; style.cssText = 'background:url(https://),url(https://),red url(https://)'; // If the UA supports multiple backgrounds, there should be three occurrences // of the string "url(" in the return value for elemStyle.background return (/(url\s*\(.*?){3}/).test(style.background); }); /*! { "name": "CSS :nth-child pseudo-selector", "caniuse": "css-sel3", "property": "nthchild", "tags": ["css"], "notes": [ { "name": "Related Github Issue", "href": "https://github.com/Modernizr/Modernizr/pull/685" }, { "name": "Sitepoint :nth-child documentation", "href": "http://reference.sitepoint.com/css/pseudoclass-nthchild" } ], "authors": ["@emilchristensen"], "warnings": ["Known false negative in Safari 3.1 and Safari 3.2.2"] } !*/ /* DOC Detects support for the ':nth-child()' CSS pseudo-selector. */ // 5 `
` elements with `1px` width are created. // Then every other element has its `width` set to `2px`. // A Javascript loop then tests if the `
`s have the expected width // using the modulus operator. testStyles('#modernizr div {width:1px} #modernizr div:nth-child(2n) {width:2px;}', function( elem ) { Modernizr.addTest('nthchild', function() { var elems = elem.getElementsByTagName('div'), test = true; for (var i = 0; i < 5; i++) { test = test && elems[i].offsetWidth === i % 2 + 1; } return test; }); }, 5); // Modernizr.prefixed() returns the prefixed or nonprefixed property name variant of your input // Modernizr.prefixed('boxSizing') // 'MozBoxSizing' // Properties must be passed as dom-style camelcase, rather than `box-sizing` hypentated style. // Return values will also be the camelCase variant, if you need to translate that to hypenated style use: // // str.replace(/([A-Z])/g, function(str,m1){ return '-' + m1.toLowerCase(); }).replace(/^ms-/,'-ms-'); // If you're trying to ascertain which transition end event to bind to, you might do something like... // // var transEndEventNames = { // 'WebkitTransition' : 'webkitTransitionEnd',// Saf 6, Android Browser // 'MozTransition' : 'transitionend', // only for FF < 15 // 'transition' : 'transitionend' // IE10, Opera, Chrome, FF 15+, Saf 7+ // }, // transEndEventName = transEndEventNames[ Modernizr.prefixed('transition') ]; var prefixed = ModernizrProto.prefixed = function( prop, obj, elem ) { if (!obj) { return testPropsAll(prop, 'pfx'); } else { // Testing DOM property e.g. Modernizr.prefixed('requestAnimationFrame', window) // 'mozRequestAnimationFrame' return testPropsAll(prop, obj, elem); } }; /*! { "name": "CSS Object Fit", "caniuse": "object-fit", "property": "objectfit", "tags": ["css"], "notes": [{ "name": "Opera Article on Object Fit", "href": "http://dev.opera.com/articles/view/css3-object-fit-object-position/" }] } !*/ Modernizr.addTest('objectfit', !!prefixed('objectFit'), { aliases: ['object-fit'] }); /*! { "name": "CSS Opacity", "caniuse": "css-opacity", "property": "opacity", "tags": ["css"], "notes": ["Opacity must be be in the range of [0.0,1.0], according to the spec."] } !*/ // Browsers that actually have CSS Opacity implemented have done so // according to spec, which means their return values are within the // range of [0.0,1.0] - including the leading zero. Modernizr.addTest('opacity', function() { var elem = createElement('div'); var style = elem.style; style.cssText = prefixes.join('opacity:.55;'); // The non-literal . in this regex is intentional: // German Chrome returns this value as 0,55 // github.com/Modernizr/Modernizr/issues/#issue/59/comment/516632 return (/^0.55$/).test(style.opacity); }); /*! { "name": "CSS Overflow Scrolling", "property": "overflowscrolling", "tags": ["css"], "warnings": ["Introduced in iOS5b2. API is subject to change."], "notes": [{ "name": "Article on iOS overflow scrolling", "href": "http://johanbrook.com/browsers/native-momentum-scrolling-ios-5/" }] } !*/ Modernizr.addTest('overflowscrolling', testAllProps('overflowScrolling', 'touch', true)); /*! { "name": "CSS Pointer Events", "caniuse": "pointer-events", "property": "csspointerevents", "authors": ["ausi"], "tags": ["css"], "notes": [ { "name": "MDN Docs", "href": "http://developer.mozilla.org/en/CSS/pointer-events" },{ "name": "Test Project Page", "href": "http://ausi.github.com/Feature-detection-technique-for-pointer-events/" },{ "name": "Test Project Wiki", "href": "http://github.com/ausi/Feature-detection-technique-for-pointer-events/wiki" }, { "name": "Related Github Issue", "href": "http://github.com/Modernizr/Modernizr/issues/80" } ] } !*/ Modernizr.addTest('csspointerevents', function() { var element = createElement('x'); element.style.cssText = 'pointer-events:auto'; return element.style.pointerEvents === 'auto'; }); /*! { "name": "CSS position: sticky", "property": "csspositionsticky", "tags": ["css"] } !*/ // Sticky positioning - constrains an element to be positioned inside the // intersection of its container box, and the viewport. Modernizr.addTest('csspositionsticky', function() { var prop = 'position:'; var value = 'sticky'; var el = createElement('modernizr'); var mStyle = el.style; mStyle.cssText = prop + prefixes.join(value + ';' + prop).slice(0, -prop.length); return mStyle.position.indexOf(value) !== -1; }); /*! { "name": "CSS Generated Content Animations", "property": "csspseudoanimations", "tags": ["css"] } !*/ Modernizr.addTest('csspseudoanimations', function () { var result = false; if (!Modernizr.cssanimations || !window.getComputedStyle) { return result; } var styles = [ '@', Modernizr._prefixes.join('keyframes csspseudoanimations { from { font-size: 10px; } }@').replace(/\@$/,''), '#modernizr:before { content:" "; font-size:5px;', Modernizr._prefixes.join('animation:csspseudoanimations 1ms infinite;'), '}' ].join(''); Modernizr.testStyles(styles, function (elem) { result = window.getComputedStyle(elem, ':before').getPropertyValue('font-size') === '10px'; }); return result; }); /*! { "name": "CSS Transitions", "property": "csstransitions", "caniuse": "css-transitions", "tags": ["css"] } !*/ Modernizr.addTest('csstransitions', testAllProps('transition', 'all', true)); /*! { "name": "CSS Generated Content Transitions", "property": "csspseudotransitions", "tags": ["css"] } !*/ Modernizr.addTest('csspseudotransitions', function () { var result = false; if (!Modernizr.csstransitions || !window.getComputedStyle) { return result; } var styles = '#modernizr:before { content:" "; font-size:5px;' + Modernizr._prefixes.join('transition:0s 100s;') + '}' + '#modernizr.trigger:before { font-size:10px; }'; Modernizr.testStyles(styles, function (elem) { // Force rendering of the element's styles so that the transition will trigger window.getComputedStyle(elem, ':before').getPropertyValue('font-size'); elem.className += 'trigger'; result = window.getComputedStyle(elem, ':before').getPropertyValue('font-size') === '5px'; }); return result; }); /*! { "name": "CSS Reflections", "caniuse": "css-reflections", "property": "cssreflections", "tags": ["css"] } !*/ Modernizr.addTest('cssreflections', testAllProps('boxReflect', 'above', true)); /*! { "name": "CSS Regions", "caniuse": "css-regions", "authors": ["Mihai Balan"], "property": "regions", "tags": ["css"], "notes": [{ "name": "W3C Specification", "href": "http://www.w3.org/TR/css3-regions/" }] } !*/ // We start with a CSS parser test then we check page geometry to see if it's affected by regions // Later we might be able to retire the second part, as WebKit builds with the false positives die out Modernizr.addTest('regions', function() { /* Get the 'flowFrom' property name available in the browser. Either default or vendor prefixed. If the property name can't be found we'll get Boolean 'false' and fail quickly */ var flowFromProperty = Modernizr.prefixed('flowFrom'); var flowIntoProperty = Modernizr.prefixed('flowInto'); if (!flowFromProperty || !flowIntoProperty){ return false; } /* If CSS parsing is there, try to determine if regions actually work. */ var container = createElement('div'); var content = createElement('div'); var region = createElement('div'); /* we create a random, unlikely to be generated flow number to make sure we don't clash with anything more vanilla, like 'flow', or 'article', or 'f1' */ var flowName = 'modernizr_flow_for_regions_check'; /* First create a div with two adjacent divs inside it. The first will be the content, the second will be the region. To be able to distinguish between the two, we'll give the region a particular padding */ content.innerText = 'M'; container.style.cssText = 'top: 150px; left: 150px; padding: 0px;'; region.style.cssText = 'width: 50px; height: 50px; padding: 42px;'; region.style[flowFromProperty] = flowName; container.appendChild(content); container.appendChild(region); docElement.appendChild(container); /* Now compute the bounding client rect, before and after attempting to flow the content div in the region div. If regions are enabled, the after bounding rect should reflect the padding of the region div.*/ var flowedRect, delta; var plainRect = content.getBoundingClientRect(); content.style[flowIntoProperty] = flowName; flowedRect = content.getBoundingClientRect(); delta = parseInt(flowedRect.left - plainRect.left, 10); docElement.removeChild(container); content = region = container = undefined; return (delta == 42); }); /*! { "name": "CSS Font rem Units", "caniuse": "rem", "authors": ["nsfmc"], "property": "cssremunit", "tags": ["css"], "notes": [{ "name": "W3C Spec", "href": "http://www.w3.org/TR/css3-values/#relative0" },{ "name": "Font Size with rem by Jonathan Snook", "href": "http://snook.ca/archives/html_and_css/font-size-with-rem" }] } !*/ // "The 'rem' unit ('root em') is relative to the computed // value of the 'font-size' value of the root element." // you can test by checking if the prop was ditched Modernizr.addTest('cssremunit', function() { var div = createElement('div'); try { div.style.fontSize = '3rem'; } catch( er ) {} return (/rem/).test(div.style.fontSize); }); /*! { "name": "CSS UI Resize", "property": "cssresize", "caniuse": "css-resize", "tags": ["css"], "notes": [{ "name": "W3C Specification", "href": "http://www.w3.org/TR/css3-ui/#resize" },{ "name": "MDN Docs", "href": "https://developer.mozilla.org/en/CSS/resize" }] } !*/ /* DOC Test for CSS 3 UI "resize" property */ Modernizr.addTest('cssresize', testAllProps('resize', 'both', true)); /*! { "name": "CSS rgba", "caniuse": "css3-colors", "property": "rgba", "tags": ["css"], "notes": [{ "name": "CSSTricks Tutorial", "href": "http://css-tricks.com/rgba-browser-support/" }] } !*/ Modernizr.addTest('rgba', function() { var elem = createElement('div'); var style = elem.style; style.cssText = 'background-color:rgba(150,255,150,.5)'; return ('' + style.backgroundColor).indexOf('rgba') > -1; }); /*! { "name": "CSS Stylable Scrollbars", "property": "cssscrollbar", "tags": ["css"] } !*/ testStyles('#modernizr{overflow: scroll; width: 40px; height: 40px; }#' + prefixes .join('scrollbar{width:0px}'+' #modernizr::') .split('#') .slice(1) .join('#') + 'scrollbar{width:0px}', function( node ) { Modernizr.addTest('cssscrollbar', node.scrollWidth == 40); }); /*! { "name": "CSS Shapes", "property": "shapes", "tags": ["css"], "notes": [{ "name": "CSS Shapes W3C specification", "href": "http://www.w3.org/TR/css-shapes" },{ "name": "Examples from Adobe", "href": "http://html.adobe.com/webplatform/layout/shapes" }, { "name": "Samples showcasing uses of Shapes", "href": "http://codepen.io/collection/qFesk" }] } !*/ Modernizr.addTest('shapes', function () { var prefixedProperty = prefixed('shapeOutside'); if (!prefixedProperty) return false; var shapeOutsideProperty = prefixedProperty.replace(/([A-Z])/g, function (str, m1) { return '-' + m1.toLowerCase(); }).replace(/^ms-/, '-ms-'); return testStyles('#modernizr { float: left; ' + shapeOutsideProperty + ':rectangle(0,0,0,0,0,0) }', function (elem) { // Check against computed value var styleObj = window.getComputedStyle ? getComputedStyle(elem, null) : elem.currentStyle; return styleObj[prefixed('shapeOutside', docElement.style, false)] == 'rectangle(0px, 0px, 0px, 0px, 0px, 0px)'; }); }); /*! { "name": "CSS general sibling selector", "caniuse": "css-sel3", "property": "siblinggeneral", "tags": ["css"], "notes": [{ "name": "Related Github Issue", "href": "https://github.com/Modernizr/Modernizr/pull/889" }] } !*/ Modernizr.addTest('siblinggeneral', function(){ return testStyles('#modernizr div {width:100px} #modernizr div ~ div {width:200px;display:block}', function( elem ) { return elem.lastChild.offsetWidth == 200; }, 2); }); /*! { "name": "CSS Subpixel Fonts", "property": "subpixelfont", "tags": ["css"], "authors": [ "@derSchepp", "@gerritvanaaken", "@rodneyrehm", "@yatil", "@ryanseddon" ], "notes": [{ "name": "Origin Test", "href": "https://github.com/gerritvanaaken/subpixeldetect" }] } !*/ /* * (to infer if GDI or DirectWrite is used on Windows) */ testStyles( '#modernizr{position: absolute; top: -10em; visibility:hidden; font: normal 10px arial;}#subpixel{float: left; font-size: 33.3333%;}', function( elem ) { var subpixel = elem.firstChild; subpixel.innerHTML = 'This is a text written in Arial'; Modernizr.addTest('subpixelfont', window.getComputedStyle ? window.getComputedStyle(subpixel, null).getPropertyValue('width') !== '44px' : false); }, 1, ['subpixel']); /*! { "name": "CSS Supports", "property": "supports", "caniuse": "css-featurequeries", "tags": ["css"], "notes": [{ "name": "W3 Spec", "href": "http://dev.w3.org/csswg/css3-conditional/#at-supports" },{ "name": "Related Github Issue", "href": "github.com/Modernizr/Modernizr/issues/648" },{ "name": "W3 Info", "href": "http://dev.w3.org/csswg/css3-conditional/#the-csssupportsrule-interface" }] } !*/ // Relies on the fact that a browser vendor should expose the CSSSupportsRule interface Modernizr.addTest('supports', 'CSSSupportsRule' in window); /*! { "name": "CSS :target pseudo-class", "caniuse": "css-sel3", "property": "target", "tags": ["css"], "notes": [{ "name": "MDN documentation", "href": "https://developer.mozilla.org/en-US/docs/Web/CSS/:target" }], "authors": ["@zachleat"], "warnings": ["Opera Mini supports :target but doesn't update the hash for anchor links."] } !*/ /* DOC Detects support for the ':target' CSS pseudo-class. */ // querySelector Modernizr.addTest('target', function() { var doc = window.document; if(!('querySelectorAll' in doc) ) { return false; } try { doc.querySelectorAll(':target'); return true; } catch(e) { return false; } }); /*! { "name": "CSS textshadow", "property": "textshadow", "caniuse": "css-textshadow", "tags": ["css"], "knownBugs": ["FF3.0 will false positive on this test"] } !*/ Modernizr.addTest('textshadow', testProp('textShadow', '1px 1px')); /*! { "name": "CSS Transforms", "property": "csstransforms", "caniuse": "transforms2d", "tags": ["css"] } !*/ Modernizr.addTest('csstransforms', testAllProps('transform', 'scale(1)', true)); /*! { "name": "CSS Transforms 3D", "property": "csstransforms3d", "caniuse": "transforms3d", "tags": ["css"], "warnings": [ "Chrome may occassionally fail this test on some systems; more info: https://code.google.com/p/chromium/issues/detail?id=129004" ] } !*/ Modernizr.addTest('csstransforms3d', function() { var ret = !!testAllProps('perspective', '1px', true); // Webkit's 3D transforms are passed off to the browser's own graphics renderer. // It works fine in Safari on Leopard and Snow Leopard, but not in Chrome in // some conditions. As a result, Webkit typically recognizes the syntax but // will sometimes throw a false positive, thus we must do a more thorough check: if ( ret && 'webkitPerspective' in docElement.style ) { // Webkit allows this media query to succeed only if the feature is enabled. // `@media (transform-3d),(-webkit-transform-3d){ ... }` // If loaded inside the body tag and the test element inherits any padding, margin or borders it will fail #740 testStyles('@media (transform-3d),(-webkit-transform-3d){#modernizr{left:9px;position:absolute;height:5px;margin:0;padding:0;border:0}}', function( elem ) { ret = elem.offsetLeft === 9 && elem.offsetHeight === 5; }); } return ret; }); /*! { "name": "CSS Transform Style preserve-3d", "property": "preserve3d", "authors": ["edmellum"], "tags": ["css"], "notes": [{ "name": "MDN Docs", "href": "https://developer.mozilla.org/en-US/docs/Web/CSS/transform-style" },{ "name": "Related Github Issue", "href": "https://github.com/Modernizr/Modernizr/issues/762" }] } !*/ /* DOC Detects support for `transform-style: preserve-3d`, for getting a proper 3D perspective on elements. */ Modernizr.addTest('preserve3d', testAllProps('transformStyle', 'preserve-3d')); /*! { "name": "CSS user-select", "property": "userselect", "caniuse": "user-select-none", "authors": ["ryan seddon"], "tags": ["css"], "notes": [{ "name": "Related Modernizr Issue", "href": "https://github.com/Modernizr/Modernizr/issues/250" }] } !*/ //https://github.com/Modernizr/Modernizr/issues/250 Modernizr.addTest('userselect', testAllProps('userSelect', 'none', true)); /*! { "name": "CSS vh unit", "property": "cssvhunit", "caniuse": "viewport-units", "tags": ["css"], "notes": [{ "name": "Related Modernizr Issue", "href": "https://github.com/Modernizr/Modernizr/issues/572" },{ "name": "Similar JSFiddle", "href": "http://jsfiddle.net/FWeinb/etnYC/" }] } !*/ testStyles('#modernizr { height: 50vh; }', function( elem ) { var height = parseInt(window.innerHeight/2,10); var compStyle = parseInt((window.getComputedStyle ? getComputedStyle(elem, null) : elem.currentStyle)['height'],10); Modernizr.addTest('cssvhunit', compStyle == height); }); /*! { "name": "CSS vmax unit", "property": "cssvmaxunit", "caniuse": "viewport-units", "tags": ["css"], "notes": [{ "name": "Related Modernizr Issue", "href": "https://github.com/Modernizr/Modernizr/issues/572" },{ "name": "JSFiddle Example", "href": "http://jsfiddle.net/glsee/JDsWQ/4/" }] } !*/ testStyles('#modernizr { width: 50vmax; }', function( elem ) { var one_vw = docElement.clientWidth/100; var one_vh = docElement.clientHeight/100; var compWidth = parseInt((window.getComputedStyle ? getComputedStyle(elem, null) : elem.currentStyle)['width'],10); Modernizr.addTest('cssvmaxunit', parseInt(Math.max(one_vw, one_vh)*50,10) == compWidth ); }); /*! { "name": "CSS vmin unit", "property": "cssvminunit", "caniuse": "viewport-units", "tags": ["css"], "notes": [{ "name": "Related Modernizr Issue", "href": "https://github.com/Modernizr/Modernizr/issues/572" },{ "name": "JSFiddle Example", "href": "http://jsfiddle.net/glsee/JRmdq/8/" }] } !*/ testStyles('#modernizr { width: 50vmin; }', function( elem ) { var one_vw = docElement.clientWidth/100; var one_vh = docElement.clientHeight/100; var compWidth = parseInt((window.getComputedStyle ? getComputedStyle(elem, null) : elem.currentStyle)['width'],10); Modernizr.addTest('cssvminunit', parseInt(Math.min(one_vw, one_vh)*50,10) == compWidth ); }); /*! { "name": "CSS vw unit", "property": "cssvwunit", "caniuse": "viewport-units", "tags": ["css"], "notes": [{ "name": "Related Modernizr Issue", "href": "https://github.com/Modernizr/Modernizr/issues/572" },{ "name": "JSFiddle Example", "href": "http://jsfiddle.net/FWeinb/etnYC/" }] } !*/ testStyles('#modernizr { width: 50vw; }', function( elem ) { var width = parseInt(docElement.innerWidth/2,10); var compStyle = parseInt((window.getComputedStyle ? getComputedStyle(elem, null) : elem.currentStyle)['width'],10); Modernizr.addTest('cssvwunit', compStyle == width); }); /*! { "name": "CSS wrap-flow", "property": "wrapflow", "tags": ["css"], "notes": [ "This is a separate test from the rest of CSS Exclusions as as IE10 has just implemented this alone.", { "name": "W3C Exclusions spec", "href": "http://www.w3.org/TR/css3-exclusions" }, { "name": "Example by Adobe", "href": "http://html.adobe.com/webstandards/cssexclusions" } ] } !*/ Modernizr.addTest('wrapflow', function () { var prefixedProperty = prefixed('wrapFlow'); if (!prefixedProperty) return false; var wrapFlowProperty = prefixedProperty.replace(/([A-Z])/g, function (str, m1) { return '-' + m1.toLowerCase(); }).replace(/^ms-/, '-ms-'); /* If the CSS parsing is there we need to determine if wrap-flow actually works to avoid false positive cases, e.g. the browser parses the property, but it hasn't got the implementation for the functionality yet. */ var container = createElement('div'); var exclusion = createElement('div'); var content = createElement('span'); /* First we create a div with two adjacent divs inside it. The first div will be the content, the second div will be the exclusion area. We use the "wrap-flow: end" property to test the actual behavior. (http://dev.w3.org/csswg/css3-exclusions/#wrap-flow-property) The wrap-flow property is applied to the exclusion area what has a 50px left offset and a 100px width. If the wrap-flow property is working correctly then the content should start after the exclusion area, so the content's left offset should be 150px. */ exclusion.style.cssText = 'position: absolute; left: 50px; width: 100px; height: 20px;' + wrapFlowProperty + ':end;'; content.innerText = 'X'; container.appendChild(exclusion); container.appendChild(content); docElement.appendChild(container); var leftOffset = content.offsetLeft; docElement.removeChild(container); exclusion = content = container = undefined; return (leftOffset == 150); }); /*! { "name": "Custom protocol handler", "property": "customprotocolhandler", "authors": ["Ben Schwarz"], "notes": [{ "name": "WHATWG overview", "href": "http://developers.whatwg.org/timers.html#custom-handlers" },{ "name": "MDN documentation", "href": "https://developer.mozilla.org/en-US/docs/Web/API/navigator.registerProtocolHandler" }], "warnings": [], "polyfills": [] } !*/ /* DOC Detects support for the `window.registerProtocolHandler()` API to allow web sites to register themselves as possible handlers for particular protocols. */ Modernizr.addTest('customprotocolhandler', !!navigator.registerProtocolHandler); /*! { "name": "Dart", "property": "dart", "authors": ["Theodoor van Donge"], "notes": [{ "name": "Language website", "href": "http://www.dartlang.org/" }] } !*/ /* DOC Detects native support for the Dart programming language. */ Modernizr.addTest('dart', !!prefixed('startDart', navigator)); /*! { "name": "DataView", "property": "dataview", "authors": ["Addy Osmani"], "notes": [{ "name": "MDN documentation", "href": "https://developer.mozilla.org/en/JavaScript_typed_arrays/DataView" }], "polyfills": ["jdataview"] } !*/ /* DOC Detects support for the DataView interface for reading data from an ArrayBuffer as part of the Typed Array spec. */ Modernizr.addTest('dataview', (typeof DataView !== 'undefined' && 'getFloat64' in DataView.prototype)); /*! { "name": "classList", "caniuse": "classlist", "property": "classlist", "tags": ["dom"], "notes": [{ "name": "MDN Docs", "href": "https://developer.mozilla.org/en/DOM/element.classList" }] } !*/ Modernizr.addTest('classlist', 'classList' in docElement); /*! { "name": "createElement with Attributes", "property": ["createelementattrs", "createelement-attrs"], "tags": ["dom"], "authors": ["James A. Rosen"], "notes": [{ "name": "Related Github Issue", "href": "https://github.com/Modernizr/Modernizr/issues/258" }] } !*/ Modernizr.addTest('createelementattrs', function() { try { return createElement('').getAttribute('name') == 'test'; } catch( e ) { return false; } }, { aliases: ['createelement-attrs'] }); /*! { "name": "dataset API", "caniuse": "dataset", "property": "dataset", "tags": ["dom"], "authors": ["@phiggins42"] } !*/ // dataset API for data-* attributes Modernizr.addTest('dataset', function() { var n = createElement('div'); n.setAttribute('data-a-b', 'c'); return !!(n.dataset && n.dataset.aB === 'c'); }); /*! { "name": "Document Fragment", "property": "documentfragment", "notes": [{ "name": "W3C DOM Level 1 Reference", "href": "http://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html#ID-B63ED1A3" }, { "name": "SitePoint Reference", "href": "http://reference.sitepoint.com/javascript/DocumentFragment" }, { "name": "QuirksMode Compatibility Tables", "href": "http://www.quirksmode.org/m/w3c_core.html#t112" }], "authors": ["Ron Waldon (@jokeyrhyme)"], "knownBugs": ["false-positive on Blackberry 9500, see QuirksMode note"], "tags": [] } !*/ /* DOC Append multiple elements to the DOM within a single insertion. */ Modernizr.addTest('documentfragment', function() { return 'createDocumentFragment' in document && 'appendChild' in docElement; }); /*! { "name": "microdata", "property": "microdata", "tags": ["dom"], "notes": [{ "name": "W3 Spec", "href": "http://www.w3.org/TR/html5/microdata.html" }] } !*/ Modernizr.addTest('microdata', 'getItems' in document); /*! { "name": "Drag & Drop", "property": "draganddrop", "caniuse": "dragndrop", "notes": [{ "name": "W3C spec", "href": "http://www.w3.org/TR/2010/WD-html5-20101019/dnd.html" }], "polyfills": ["dropfile", "moxie", "fileapi"] } !*/ /* DOC Detects support for native drag & drop of elements. */ Modernizr.addTest('draganddrop', function() { var div = createElement('div'); return ('draggable' in div) || ('ondragstart' in div && 'ondrop' in div); }); var attrs = {}; var inputattrs = 'autocomplete autofocus list placeholder max min multiple pattern required step'.split(' '); var inputElem = createElement('input'); /*! { "name": "Input attributes", "property": "input", "tags": ["forms"], "authors": ["Mike Taylor"], "notes": [{ "name": "WHATWG spec", "href": "http://www.whatwg.org/specs/web-apps/current-work/multipage/the-input-element.html#input-type-attr-summary" }] } !*/ /* DOC Detects support for HTML5 `` element attributes and exposes Boolean subproperties with the results: ```javascript Modernizr.input.autocomplete Modernizr.input.autofocus Modernizr.input.list Modernizr.input.max Modernizr.input.min Modernizr.input.multiple Modernizr.input.pattern Modernizr.input.placeholder Modernizr.input.required Modernizr.input.step ``` */ // Run through HTML5's new input attributes to see if the UA understands any. // Mike Taylr has created a comprehensive resource for testing these attributes // when applied to all input types: // miketaylr.com/code/input-type-attr.html // Only input placeholder is tested while textarea's placeholder is not. // Currently Safari 4 and Opera 11 have support only for the input placeholder // Both tests are available in feature-detects/forms-placeholder.js Modernizr['input'] = (function( props ) { for ( var i = 0, len = props.length; i < len; i++ ) { attrs[ props[i] ] = !!(props[i] in inputElem); } if (attrs.list){ // safari false positive's on datalist: webk.it/74252 // see also github.com/Modernizr/Modernizr/issues/146 attrs.list = !!(createElement('datalist') && window.HTMLDataListElement); } return attrs; })(inputattrs); /*! { "name": "datalist Element", "caniuse": "datalist", "property": "datalistelem", "tags": ["elem"], "warnings": ["This test is a dupe of Modernizr.input.list. Only around for legacy reasons."], "notes": [{ "name": "CSS Tricks Article", "href": "http://css-tricks.com/15346-relevant-dropdowns-polyfill-for-datalist/" },{ "name": "Mike Taylor Test", "href": "http://miketaylr.com/test/datalist.html" },{ "name": "Mike Taylor Code", "href": "http://miketaylr.com/code/datalist.html" }] } !*/ // lol. we already have a test for datalist built in! silly you. // Leaving it around in case anyone's using it Modernizr.addTest('datalistelem', Modernizr.input.list ); /*! { "name": "details Element", "caniuse": "details", "property": "details", "tags": ["elem"], "authors": ["@mathias"], "notes": [{ "name": "Mathias' Original", "href": "http://mths.be/axh" }] } !*/ Modernizr.addTest('details', function() { var el = createElement('details'); var diff; // return early if possible; thanks @aFarkas! if (!('open' in el)) { return false; } testStyles('#modernizr details{display:block}', function( node ) { node.appendChild(el); el.innerHTML = 'ab'; diff = el.offsetHeight; el.open = true; diff = diff != el.offsetHeight; }); return diff; }); /*! { "name": "output Element", "property": "outputelem", "tags": ["elem"], "notes": [{ "name": "WhatWG Spec", "href": "http://www.whatwg.org/specs/web-apps/current-work/multipage/the-button-element.html#the-output-element" }] } !*/ Modernizr.addTest('outputelem', 'value' in createElement('output')); /*! { "name": "progress Element", "caniuse": "progressmeter", "property": ["progressbar", "meter"], "tags": ["elem"], "authors": ["Stefan Wallin"] } !*/ // Tests for progressbar-support. All browsers that don't support progressbar returns undefined =) Modernizr.addTest('progressbar', createElement('progress').max !== undefined); // Tests for meter-support. All browsers that don't support meters returns undefined =) Modernizr.addTest('meter', createElement('meter').max !== undefined); /*! { "name": "ruby, rp, rt Elements", "caniuse": "ruby", "property": "ruby", "tags": ["elem"], "authors": ["Cătălin Mariș"], "notes": [{ "name": "WHATWG Specification", "href": "http://www.whatwg.org/specs/web-apps/current-work/multipage/text-level-semantics.html#the-ruby-element" }] } !*/ Modernizr.addTest('ruby', function () { var ruby = createElement('ruby'); var rt = createElement('rt'); var rp = createElement('rp'); var displayStyleProperty = 'display'; // 'fontSize' - because it`s only used for IE6 and IE7 var fontSizeStyleProperty = 'fontSize'; ruby.appendChild(rp); ruby.appendChild(rt); docElement.appendChild(ruby); // browsers that support hide the via "display:none" if ( getStyle(rp, displayStyleProperty) == 'none' || // for non-IE browsers // but in IE browsers has "display:inline" so, the test needs other conditions: getStyle(ruby, displayStyleProperty) == 'ruby' && getStyle(rt, displayStyleProperty) == 'ruby-text' || // for IE8+ getStyle(rp, fontSizeStyleProperty) == '6pt' && getStyle(rt, fontSizeStyleProperty) == '6pt' ) { // for IE6 & IE7 cleanUp(); return true; } else { cleanUp(); return false; } function getStyle( element, styleProperty ) { var result; if ( window.getComputedStyle ) { // for non-IE browsers result = document.defaultView.getComputedStyle(element,null).getPropertyValue(styleProperty); } else if ( element.currentStyle ) { // for IE result = element.currentStyle[styleProperty]; } return result; } function cleanUp() { docElement.removeChild(ruby); // the removed child node still exists in memory, so ... ruby = null; rt = null; rp = null; } }); /*! { "name": "Template Tag", "property": "template", "tags": ["elem"], "notes": [{ "name": "HTML5Rocks Article", "href": "http://www.html5rocks.com/en/tutorials/webcomponents/template/" },{ "name": "W3 Spec", "href": "https://dvcs.w3.org/hg/webcomponents/raw-file/tip/spec/templates/index.html" }] } !*/ Modernizr.addTest('template', 'content' in createElement('template')); /*! { "name": "time Element", "caniuse": "html5semantic", "property": "time", "tags": ["elem"], "notes": [{ "name": "WhatWG Spec", "href": "http://www.whatwg.org/specs/web-apps/current-work/multipage/rendering.html#the-time-element-0" }] } !*/ Modernizr.addTest('time', 'valueAsDate' in createElement('time')); /*! { "name": "Track element and Timed Text Track API", "property": ["texttrackapi", "track"], "tags": ["elem"], "authors": ["Addy Osmani"], "notes": [{ "name": "W3 track Element Spec", "href": "http://www.w3.org/TR/html5/video.html#the-track-element" },{ "name": "W3 track API Spec", "href": "http://www.w3.org/TR/html5/media-elements.html#text-track-api" }], "warnings": ["While IE10 has implemented the track element, IE10 does not expose the underlying APIs to create timed text tracks by JS (really sad)"] } !*/ Modernizr.addTest('texttrackapi', typeof (createElement('video').addTextTrack) === 'function'); // a more strict test for track including UI support: document.createElement('track').kind === 'subtitles' Modernizr.addTest('track', 'kind' in createElement('track')); /*! { "name": "Emoji", "property": "emoji" } !*/ /* DOC Detects support for emoji character sets. */ Modernizr.addTest('emoji', function() { if (!Modernizr.canvastext) return false; var node = createElement('canvas'), ctx = node.getContext('2d'); ctx.textBaseline = 'top'; ctx.font = '32px Arial'; ctx.fillText('\ud83d\ude03', 0, 0); // "smiling face with open mouth" emoji return ctx.getImageData(16, 16, 1, 1).data[0] !== 0; }); /*! { "name": "ES5 Array", "property": "es5array", "notes": [{ "name": "ECMAScript 5.1 Language Specification", "href": "http://www.ecma-international.org/ecma-262/5.1/" }], "polyfills": ["es5shim"], "authors": ["Ron Waldon (@jokeyrhyme)"], "tags": ["es5"] } !*/ /* DOC Check if browser implements ECMAScript 5 Array per specification. */ Modernizr.addTest('es5array', function () { return !!(Array.prototype && Array.prototype.every && Array.prototype.filter && Array.prototype.forEach && Array.prototype.indexOf && Array.prototype.lastIndexOf && Array.prototype.map && Array.prototype.some && Array.prototype.reduce && Array.prototype.reduceRight && Array.isArray); }); /*! { "name": "ES5 Date", "property": "es5date", "notes": [{ "name": "ECMAScript 5.1 Language Specification", "href": "http://www.ecma-international.org/ecma-262/5.1/" }], "polyfills": ["es5shim"], "authors": ["Ron Waldon (@jokeyrhyme)"], "tags": ["es5"] } !*/ /* DOC Check if browser implements ECMAScript 5 Date per specification. */ Modernizr.addTest('es5date', function () { var isoDate = '2013-04-12T06:06:37.307Z', canParseISODate = false; try { canParseISODate = !!Date.parse(isoDate); } catch (e) { // no ISO date parsing yet } return !!(Date.now && Date.prototype && Date.prototype.toISOString && Date.prototype.toJSON && canParseISODate); }); /*! { "name": "ES5 Function", "property": "es5function", "notes": [{ "name": "ECMAScript 5.1 Language Specification", "href": "http://www.ecma-international.org/ecma-262/5.1/" }], "polyfills": ["es5shim"], "authors": ["Ron Waldon (@jokeyrhyme)"], "tags": ["es5"] } !*/ /* DOC Check if browser implements ECMAScript 5 Function per specification. */ Modernizr.addTest('es5function', function () { return !!(Function.prototype && Function.prototype.bind); }); /*! { "name": "ES5 Object", "property": "es5object", "notes": [{ "name": "ECMAScript 5.1 Language Specification", "href": "http://www.ecma-international.org/ecma-262/5.1/" }], "polyfills": ["es5shim", "es5sham"], "authors": ["Ron Waldon (@jokeyrhyme)"], "tags": ["es5"] } !*/ /* DOC Check if browser implements ECMAScript 5 Object per specification. */ Modernizr.addTest('es5object', function () { return !!(Object.keys && Object.create && Object.getPrototypeOf && Object.getOwnPropertyNames && Object.isSealed && Object.isFrozen && Object.isExtensible && Object.getOwnPropertyDescriptor && Object.defineProperty && Object.defineProperties && Object.seal && Object.freeze && Object.preventExtensions); }); /*! { "name": "ES5 Strict Mode", "property": "strictmode", "caniuse": "sctrict-mode", "notes": [{ "name": "ECMAScript 5.1 Language Specification", "href": "http://www.ecma-international.org/ecma-262/5.1/" }], "authors": ["@kangax"], "tags": ["es5"] } !*/ /* DOC Check if browser implements ECMAScript 5 Object strict mode. */ Modernizr.addTest('strictmode', (function(){ return !this; })()); /*! { "name": "ES5 String", "property": "es5string", "notes": [{ "name": "ECMAScript 5.1 Language Specification", "href": "http://www.ecma-international.org/ecma-262/5.1/" }], "polyfills": ["es5shim"], "authors": ["Ron Waldon (@jokeyrhyme)"], "tags": ["es5"] } !*/ /* DOC Check if browser implements ECMAScript 5 String per specification. */ Modernizr.addTest('es5string', function () { return !!(String.prototype && String.prototype.trim); }); /*! { "name": "ES5 String.prototype.contains", "property": "contains", "authors": ["Robert Kowalski"], "tags": ["es6"] } !*/ /* DOC Check if browser implements ECMAScript 6 `String.prototype.contains` per specification. */ Modernizr.addTest('contains', is(String.prototype.contains, 'function')); /*! { "name": "Device Orientation and Motion Events", "property": ["devicemotion", "deviceorientation"], "caniuse": "deviceorientation", "notes": [{ "name": "W3C Editor's Draft", "href": "http://dev.w3.org/geo/api/spec-source-orientation.html" },{ "name": "Implementation by iOS Safari (Orientation)", "href": "http://goo.gl/fhce3" },{ "name": "Implementation by iOS Safari (Motion)", "href": "http://goo.gl/rLKz8" }], "authors": ["Shi Chuan"], "tags": ["event"] } !*/ /* DOC Part of Device Access aspect of HTML5, same category as geolocation. `devicemotion` tests for Device Motion Event support, returns boolean value true/false. `deviceorientation` tests for Device Orientation Event support, returns boolean value true/false */ Modernizr.addTest('devicemotion', 'DeviceMotionEvent' in window); Modernizr.addTest('deviceorientation', 'DeviceOrientationEvent' in window); // isEventSupported determines if the given element supports the given event // kangax.github.com/iseventsupported/ // github.com/Modernizr/Modernizr/pull/636 // // Known incorrects: // Modernizr.hasEvent("webkitTransitionEnd", elem) // false negative // Modernizr.hasEvent("textInput") // in Webkit. github.com/Modernizr/Modernizr/issues/333 var isEventSupported = (function (undefined) { // Detect whether event support can be detected via `in`. Test on a DOM element // using the "blur" event b/c it should always exist. bit.ly/event-detection var needsFallback = !('onblur' in document.documentElement); /** * @param {string|*} eventName is the name of an event to test for (e.g. "resize") * @param {(Object|string|*)=} element is the element|document|window|tagName to test on * @return {boolean} */ function isEventSupportedInner( eventName, element ) { var isSupported; if ( !eventName ) { return false; } if ( !element || typeof element === 'string' ) { element = createElement(element || 'div'); } // Testing via the `in` operator is sufficient for modern browsers and IE. // When using `setAttribute`, IE skips "unload", WebKit skips "unload" and // "resize", whereas `in` "catches" those. eventName = 'on' + eventName; isSupported = eventName in element; // Fallback technique for old Firefox - bit.ly/event-detection if ( !isSupported && needsFallback ) { if ( !element.setAttribute ) { // Switch to generic element if it lacks `setAttribute`. // It could be the `document`, `window`, or something else. element = createElement('div'); } if ( element.setAttribute && element.removeAttribute ) { element.setAttribute(eventName, ''); isSupported = typeof element[eventName] === 'function'; if ( element[eventName] !== undefined ) { // If property was created, "remove it" by setting value to `undefined`. element[eventName] = undefined; } element.removeAttribute(eventName); } } return isSupported; } return isEventSupportedInner; })(); // Modernizr.hasEvent() detects support for a given event, with an optional element to test on // Modernizr.hasEvent('gesturestart', elem) var hasEvent = ModernizrProto.hasEvent = isEventSupported; /*! { "name": "onInput Event", "property": "oninput", "notes": [{ "name": "MDN article", "href": "https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers.oninput" },{ "name": "WHATWG spec", "href": "http://www.whatwg.org/specs/web-apps/current-work/multipage/common-input-element-attributes.html#common-event-behaviors" },{ "name": "Detecting onInput support", "href": "http://danielfriesen.name/blog/2010/02/16/html5-browser-maze-oninput-support" }], "authors": ["Patrick Kettner"], "tags": ["event"] } !*/ /* DOC `oninput` tests if the browser is able to detect the input event */ Modernizr.addTest('oninput', function() { var input = createElement('input'); input.setAttribute('oninput', 'return'); if (hasEvent('oninput', docElement) || typeof input.oninput == 'function') { return true; } // IE doesn't support onInput, so we wrap up the non IE APIs // (createEvent, addEventListener) in a try catch, rather than test for // their trident equivalent. try { // Older Firefox didn't map oninput attribute to oninput property var testEvent = document.createEvent('KeyboardEvent'); var supportsOnInput = false; var handler = function(e) { supportsOnInput = true; e.preventDefault(); e.stopPropagation(); }; testEvent.initKeyEvent('keypress', true, true, window, false, false, false, false, 0, 'e'.charCodeAt(0)); docElement.appendChild(input); input.addEventListener('input', handler, false); input.focus(); input.dispatchEvent(testEvent); input.removeEventListener('input', handler, false); docElement.removeChild(input); return supportsOnInput; } catch (e) {} }); /*! { "name": "EXIF Orientation", "property": "exiforientation", "tags": ["image"], "async": true, "authors": ["Paul Sayre"], "notes": [{ "name": "Article by Dave Perrett", "href": "http://recursive-design.com/blog/2012/07/28/exif-orientation-handling-is-a-ghetto/" },{ "name": "Article by Calvin Hass", "href": "http://www.impulseadventure.com/photo/exif-orientation.html" }] } !*/ /* DOC Detects support for EXIF Orientation in JPEG images. iOS looks at the EXIF Orientation flag in JPEGs and rotates the image accordingly. Most desktop browsers just ignore this data. */ // Bug trackers: // bugzil.la/298619 (unimplemented) // crbug.com/56845 (looks incomplete) // webk.it/19688 (available upstream but its up all ports to turn on individually) Modernizr.addAsyncTest(function() { var img = new Image(); img.onerror = function() { addTest('exiforientation', false, { aliases: ['exif-orientation'] }); }; img.onload = function() { addTest('exiforientation', img.width !== 2, { aliases: ['exif-orientation'] }); }; // There may be a way to shrink this more, it's a 1x2 white jpg with the orientation flag set to 6 img.src = 'data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAYABgAAD/4QAiRXhpZgAASUkqAAgAAAABABIBAwABAAAABgASAAAAAAD/2wBDAAEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQH/2wBDAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQH/wAARCAABAAIDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwD+/iiiigD/2Q=='; }); /*! { "name": "File API", "property": "filereader", "caniuse": "fileapi", "notes": [{ "name": "W3C Working Draft", "href": "http://www.w3.org/TR/FileAPI/" }], "tags": ["file"], "knownBugs": ["Will fail in Safari 5 due to its lack of support for the standards defined FileReader object"] } !*/ /* DOC `filereader` tests for the File API specification Tests for objects specific to the File API W3C specification without being redundant (don't bother testing for Blob since it is assumed to be the File object's prototype.) */ Modernizr.addTest('filereader', !!(window.File && window.FileList && window.FileReader)); /*! { "name": "Filesystem API", "property": "filesystem", "caniuse": "filesystem", "notes": [{ "name": "W3 Draft", "href": "dev.w3.org/2009/dap/file-system/file-dir-sys.html" }], "authors": ["Eric Bidelman (@ebidel)"], "tags": ["file"], "knownBugs": ["The API will be present in Chrome incognito, but will throw an exception. See crbug.com/93417"] } !*/ Modernizr.addTest('filesystem', !!prefixed('requestFileSystem', window)); /*! { "name": "Flash", "property": "flash", "tags": ["flash"], "polyfills": ["shumway"] } !*/ /* DOC Detects support flash, as well as flash blocking plugins */ Modernizr.addAsyncTest(function() { /* jshint -W053 */ var runTest = function(result, embed) { var bool = !!result; if (bool) { bool = new Boolean(bool); bool.blocked = (result === 'blocked'); } addTest('flash', function() { return bool; }); if (embed) { docElement.removeChild(embed); } }; var easy_detect; var activex; // we wrap activex in a try/catch becuase when flash is disabled through // ActiveX controls, it throws an error. try { // Pan is an API that exists for flash objects. activex = 'Pan' in new window.ActiveXObject('ShockwaveFlash.ShockwaveFlash'); } catch(e) {} easy_detect = !( ( 'plugins' in navigator && 'Shockwave Flash' in navigator.plugins ) || activex ); if (easy_detect) { runTest(false); } else { // flash seems to be installed, but it might be blocked. We have to // actually create an element to see what happens to it. var embed = createElement('embed'); var inline_style; embed.type = 'application/x-shockwave-flash'; docElement.appendChild(embed); // Pan doesn't exist in the embed if its IE (its on the ActiveXObjeect) // so this check is for all other browsers. if (!('Pan' in embed) && !activex) { runTest('blocked', embed); return; } // If we have got this far, there is still a chance a userland plugin // is blocking us (either changing the styles, or automatically removing // the element). Both of these require us to take a step back for a moment // to allow for them to get time of the thread, hence a setTimeout. setTimeout(function() { if (!docElement.contains(embed)) { runTest('blocked'); return; } inline_style = embed.style.cssText; if (inline_style !== '') { // the style of the element has changed automatically. This is a // really poor heuristic, but for lower end flash blocks, it the // only change they can make. runTest('blocked', embed); return; } runTest(true, embed); }, 10); } }); /*! { "name": "input[capture] Attribute", "property": "capture", "tags": ["video", "image", "audio", "media", "attribute"], "notes": [{ "name": "W3C draft: HTML Media Capture", "href": "http://www.w3.org/TR/html-media-capture/" }] } !*/ /* DOC When used on an ``, this attribute signifies that the resource it takes should be generated via device's camera, camcorder, sound recorder. */ // testing for capture attribute in inputs Modernizr.addTest('capture', ('capture' in createElement('input'))); /*! { "name": "input[file] Attribute", "property": "fileinput", "caniuse" : "forms", "tags": ["file", "forms", "input"] } !*/ /* DOC Detects whether input type="file" is available on the platform E.g. iOS < 6 and some android version don't support this */ Modernizr.addTest('fileinput', function() { if(navigator.userAgent.match(/(Android (1.0|1.1|1.5|1.6|2.0|2.1))|(Windows Phone (OS 7|8.0))|(XBLWP)|(ZuneWP)|(w(eb)?OSBrowser)|(webOS)|(Kindle\/(1.0|2.0|2.5|3.0))/)) { return false; } var elem = createElement('input'); elem.type = 'file'; return !elem.disabled; }); /*! { "name": "input[directory] Attribute", "property": "directory", "authors": ["silverwind"], "tags": ["file", "input", "attribute"] } !*/ /* DOC When used on an ``, the `directory` attribute instructs the user agent to present a directory selection dialog instead of the usual file selection dialog. */ Modernizr.addTest('fileinputdirectory', function() { var elem = createElement('input'), dir = 'directory'; elem.type = 'file'; if (dir in elem) { return true; } else { for (var i = 0, len = domPrefixes.length; i < len; i++) { if (domPrefixes[i] + dir in elem) { return true; } } } return false; }); /*! { "name": "input[form] Attribute", "property": "formattribute", "tags": ["attribute", "forms", "input"] } !*/ /* DOC Detects whether input form="form_id" is available on the platform E.g. IE 10 (and below), don't support this */ Modernizr.addTest('formattribute', function() { var form = createElement('form'); var input = createElement('input'); var div = createElement('div'); var id = 'formtest' + (new Date()).getTime(); var attr; var bool = false; form.id = id; //IE6/7 confuses the form idl attribute and the form content attribute, so we use document.createAttribute try { input.setAttribute('form', id); } catch( e ) { if( document.createAttribute ) { attr = document.createAttribute('form'); attr.nodeValue = id; input.setAttributeNode(attr); } } div.appendChild(form); div.appendChild(input); docElement.appendChild(div); bool = form.elements.length === 1 && input.form == form; div.parentNode.removeChild(div); return bool; }); /*! { "name": "input[type=\"number\"] Localization", "property": "localizednumber", "tags": ["forms", "localization", "attribute"], "authors": ["Peter Janes"], "notes": [{ "name": "Webkit Bug Tracker Listing", "href": "https://bugs.webkit.org/show_bug.cgi?id=42484" },{ "name": "Based on This", "href": "http://trac.webkit.org/browser/trunk/LayoutTests/fast/forms/script-tests/input-number-keyoperation.js?rev=80096#L9" }] } !*/ /* DOC Detects whether input type="number" is capable of receiving and displaying localized numbers, e.g. with comma separator */ Modernizr.addTest('localizednumber', function() { var el = createElement('div'); var diff; var body = getBody(); var root = (function() { return docElement.insertBefore(body, docElement.firstElementChild || docElement.firstChild); }()); el.innerHTML = ''; var input = el.childNodes[0]; root.appendChild(el); input.focus(); try { document.execCommand('InsertText', false, '1,1'); } catch(e) { // prevent warnings in IE } diff = input.type === 'number' && input.valueAsNumber === 1.1 && input.checkValidity(); root.removeChild(el); body.fake && root.parentNode.removeChild(root); return diff; }); /*! { "name": "placeholder attribute", "property": "placeholder", "tags": ["forms", "attribute"] } !*/ /* DOC Tests for placeholder attribute in inputs and textareas */ Modernizr.addTest('placeholder', ('placeholder' in createElement('input') && 'placeholder' in createElement('textarea'))); /*! { "name": "form#requestAutocomplete()", "property": "requestautocomplete", "tags": ["form", "forms", "requestAutocomplete", "payments"], "notes": [{ "name": "WHATWG proposed spec", "href": "http://wiki.whatwg.org/wiki/RequestAutocomplete" }] } !*/ /* DOC When used with input[autocomplete] to annotate a form, form.requestAutocomplete() shows a dialog in Chrome that speeds up checkout flows (payments specific for now). */ Modernizr.addTest('requestautocomplete', !!Modernizr.prefixed('requestAutocomplete', createElement('form'))); /*! { "name": "Speech Input API", "property": "speechinput", "tags": ["forms", "speech", "attribute"], "authors": ["Cătălin Mariș"], "knownBugs": [ "This detect only checks the webkit version because the Speech Input API was only implemented in Chrome and it was deprecated in favor of the Web Speech API." ], "notes": [{ "name": "W3C Speech Input API Specification", "href": "http://lists.w3.org/Archives/Public/public-xg-htmlspeech/2011Feb/att-0020/api-draft.html" }], "warnings": [ "Do not use the Speech Input API as it was deprecated in favor of the Web Speech API.", "Only Chrome ever implemented this API, and they are planning to deprecate and remove the related code: https://code.google.com/p/chromium/issues/detail?id=223198." ] } !*/ // `webkitSpeech` in elem doesn`t work correctly in all versions of Chromium based browsers. // It can return false even if they have support for speech i.imgur.com/2Y40n.png // Testing with 'onwebkitspeechchange' seems to fix this problem. Modernizr.addTest('speechinput', function() { var elem = createElement('input'); return 'speech' in elem || 'onwebkitspeechchange' in elem; }); /*! { "name": "Form Validation", "property": "formvalidation", "tags": ["forms", "validation", "attribute"] } !*/ /* DOC This implementation only tests support for interactive form validation. To check validation for a specific type or a specific other constraint, the test can be combined: - `Modernizr.inputtypes.number && Modernizr.formvalidation` (browser supports rangeOverflow, typeMismatch etc. for type=number) - `Modernizr.input.required && Modernizr.formvalidation` (browser supports valueMissing) */ Modernizr.addTest('formvalidation', function() { var form = createElement('form'); if ( !('checkValidity' in form) || !('addEventListener' in form) ) { return false; } var invaildFired = false; var input; Modernizr.formvalidationapi = true; // Prevent form from being submitted form.addEventListener('submit', function(e) { //Opera does not validate form, if submit is prevented if ( !window.opera ) { e.preventDefault(); } e.stopPropagation(); }, false); // Calling form.submit() doesn't trigger interactive validation, // use a submit button instead //older opera browsers need a name attribute form.innerHTML = ''; testStyles('#modernizr form{position:absolute;top:-99999em}', function( node ) { node.appendChild(form); input = form.getElementsByTagName('input')[0]; // Record whether "invalid" event is fired input.addEventListener('invalid', function(e) { invaildFired = true; e.preventDefault(); e.stopPropagation(); }, false); //Opera does not fully support the validationMessage property Modernizr.formvalidationmessage = !!input.validationMessage; // Submit form by clicking submit button form.getElementsByTagName('button')[0].click(); }); return invaildFired; }); /*! { "name": "Fullscreen API", "property": "fullscreen", "caniuse": "fullscreen", "notes": [{ "name": "MDN documentation", "href": "https://developer.mozilla.org/en/API/Fullscreen" }], "polyfills": ["screenfulljs"] } !*/ // github.com/Modernizr/Modernizr/issues/739 Modernizr.addTest('fullscreen', !!(prefixed('exitFullscreen', document, false) || prefixed('cancelFullScreen', document, false))); /*! { "name": "GamePad API", "property": "gamepads", "authors": ["Eric Bidelman"], "tags": ["media"], "notes": [{ "name": "W3C spec", "href": "http://www.w3.org/TR/gamepad/" },{ "name": "HTML5 Rocks tutorial", "href": "http://www.html5rocks.com/en/tutorials/doodles/gamepad/#toc-featuredetect" }], "warnings": [], "polyfills": [] } !*/ /* DOC Detects support for the Gamepad API, for access to gamepads and controllers. */ // FF has Gamepad API support only in special builds, but not in any release (even behind a flag) // Their current implementation has no way to feature detect, only events to bind to, but a patch // will bring them up to date with the spec when it lands (and they'll pass this test) // https://bugzilla.mozilla.org/show_bug.cgi?id=690935 Modernizr.addTest('gamepads', !!prefixed('getGamepads', navigator)); /*! { "name": "Geolocation API", "property": "geolocation", "caniuse": "geolocation", "tags": ["media"], "notes": [{ "name": "MDN documentation", "href": "https://developer.mozilla.org/en-US/docs/WebAPI/Using_geolocation" }], "polyfills": [ "joshuabell-polyfill", "webshims", "geolocationshim", "geo-location-javascript", "geolocation-api-polyfill" ] } !*/ /* DOC Detects support for the Geolocation API for users to provide their location to web applications. */ // geolocation is often considered a trivial feature detect... // Turns out, it's quite tricky to get right: // // Using !!navigator.geolocation does two things we don't want. It: // 1. Leaks memory in IE9: github.com/Modernizr/Modernizr/issues/513 // 2. Disables page caching in WebKit: webk.it/43956 // // Meanwhile, in Firefox < 8, an about:config setting could expose // a false positive that would throw an exception: bugzil.la/688158 Modernizr.addTest('geolocation', 'geolocation' in navigator); /*! { "name": "Hashchange event", "property": "hashchange", "caniuse": "hashchange", "tags": ["history"], "notes": [{ "name": "MDN documentation", "href": "https://developer.mozilla.org/en-US/docs/Web/API/window.onhashchange" }], "polyfills": [ "jquery-hashchange", "moo-historymanager", "jquery-ajaxy", "hasher", "shistory" ] } !*/ /* DOC Detects support for the `hashchange` event, fired when the current location fragment changes. */ Modernizr.addTest('hashchange', function() { if (hasEvent('hashchange', window) === false) { return false; } // documentMode logic from YUI to filter out IE8 Compat Mode // which false positives. return (document.documentMode === undefined || document.documentMode > 7); }); /*! { "name": "History API", "property": "history", "caniuse": "history", "tags": ["history"], "authors": ["Hay Kranen", "Alexander Farkas"], "notes": [{ "name": "W3C Spec", "href": "http://www.w3.org/TR/html51/browsers.html#the-history-interface" }, { "name": "MDN documentation", "href": "https://developer.mozilla.org/en-US/docs/Web/API/window.history" }], "polyfills": ["historyjs", "html5historyapi"] } !*/ /* DOC Detects support for the History API for manipulating the browser session history. */ Modernizr.addTest('history', function() { // Issue #733 // The stock browser on Android 2.2 & 2.3 returns positive on history support // Unfortunately support is really buggy and there is no clean way to detect // these bugs, so we fall back to a user agent sniff :( var ua = navigator.userAgent; // We only want Android 2, stock browser, and not Chrome which identifies // itself as 'Mobile Safari' as well if (ua.indexOf('Android 2') !== -1 && ua.indexOf('Mobile Safari') !== -1 && ua.indexOf('Chrome') === -1) { return false; } // Return the regular check return (window.history && 'pushState' in window.history); }); /*! { "name": "IE8 compat mode", "property": "ie8compat", "authors": ["Erich Ocean"] } !*/ /* DOC Detects whether or not the current browser is IE8 in compatibility mode (i.e. acting as IE7). */ // In this case, IE8 will be acting as IE7. You may choose to remove features in this case. // related: // james.padolsey.com/javascript/detect-ie-in-js-using-conditional-comments/ Modernizr.addTest('ie8compat', (!window.addEventListener && !!document.documentMode && document.documentMode === 7)); /*! { "name": "iframe[sandbox] Attribute", "property": "sandbox", "tags": ["iframe"], "notes": [{ "name": "WhatWG Spec", "href": "http://www.whatwg.org/specs/web-apps/current-work/multipage/the-iframe-element.html#attr-iframe-sandbox" }] } !*/ /* DOC Test for `sandbox` attribute in iframes. */ Modernizr.addTest('sandbox', 'sandbox' in createElement('iframe')); /*! { "name": "iframe[seamless] Attribute", "property": "seamless", "tags": ["iframe"], "notes": [{ "name": "WhatWG Spec", "href": "http://www.whatwg.org/specs/web-apps/current-work/multipage/the-iframe-element.html#attr-iframe-seamless" }] } !*/ /* DOC Test for `seamless` attribute in iframes. */ Modernizr.addTest('seamless', 'seamless' in createElement('iframe')); /*! { "name": "iframe[srcdoc] Attribute", "property": "srcdoc", "tags": ["iframe"], "notes": [{ "name": "WhatWG Spec", "href": "http://www.whatwg.org/specs/web-apps/current-work/multipage/the-iframe-element.html#attr-iframe-srcdoc" }] } !*/ /* DOC Test for `srcdoc` attribute in iframes. */ Modernizr.addTest('srcdoc', 'srcdoc' in createElement('iframe')); /*! { "name": "Animated PNG", "async": true, "property": "apng", "tags": ["image"], "notes": [{ "name": "Wikipedia Article", "href": "http://en.wikipedia.org/wiki/APNG" }] } !*/ /* DOC Test for animated png support. */ Modernizr.addAsyncTest(function () { if (!Modernizr.canvas) { return false; } var image = new Image(); var canvas = createElement('canvas'); var ctx = canvas.getContext('2d'); image.onload = function () { addTest('apng', function () { if (typeof canvas.getContext == 'undefined') { return false; } else { ctx.drawImage(image, 0, 0); return ctx.getImageData(0, 0, 1, 1).data[3] === 0; } }); }; image.src = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAACGFjVEwAAAABAAAAAcMq2TYAAAANSURBVAiZY2BgYPgPAAEEAQB9ssjfAAAAGmZjVEwAAAAAAAAAAQAAAAEAAAAAAAAAAAD6A+gBAbNU+2sAAAARZmRBVAAAAAEImWNgYGBgAAAABQAB6MzFdgAAAABJRU5ErkJggg=='; }); /*! { "name": "JPEG XR (extended range)", "async": true, "aliases": ["jpeg-xr"], "property": "jpegxr", "tags": ["image"], "notes": [{ "name": "Wikipedia Article", "href": "http://en.wikipedia.org/wiki/JPEG_XR" }] } !*/ /* DOC Test for JPEG XR support */ Modernizr.addAsyncTest(function() { var image = new Image(); image.onload = image.onerror = function() { addTest('jpegxr', image.width == 1, { aliases: ['jpeg-xr'] }); }; image.src = 'data:image/vnd.ms-photo;base64,SUm8AQgAAAAFAAG8AQAQAAAASgAAAIC8BAABAAAAAQAAAIG8BAABAAAAAQAAAMC8BAABAAAAWgAAAMG8BAABAAAAHwAAAAAAAAAkw91vA07+S7GFPXd2jckNV01QSE9UTwAZAYBxAAAAABP/gAAEb/8AAQAAAQAAAA=='; }); /*! { "name": "srcset attribute", "property": "srcset", "tags": ["image"], "notes": [{ "name": "Smashing Magazine Article", "href": "http://en.wikipedia.org/wiki/APNG" },{ "name": "Generate multi-resolution images for srcset with Grunt", "href": "http://addyosmani.com/blog/generate-multi-resolution-images-for-srcset-with-grunt/" }] } !*/ /* DOC Test for the srcset attribute of images */ Modernizr.addTest('srcset', 'srcset' in createElement('img')); /*! { "name": "Webp Lossless", "async": true, "property": ["webplossless", "webp-lossless"], "tags": ["image"], "authors": ["@amandeep", "Rich Bradshaw", "Ryan Seddon", "Paul Irish"], "notes": [{ "name": "Webp Info", "href": "http://code.google.com/speed/webp/" },{ "name": "Webp Lossless Spec", "href": "https://developers.google.com/speed/webp/docs/webp_lossless_bitstream_specification" }] } !*/ /* DOC Tests for non-alpha lossless webp support. */ Modernizr.addAsyncTest(function(){ var image = new Image(); image.onerror = function() { addTest('webplossless', false, { aliases: ['webp-lossless'] }); }; image.onload = function() { addTest('webplossless', image.width == 1, { aliases: ['webp-lossless'] }); }; image.src = 'data:image/webp;base64,UklGRh4AAABXRUJQVlA4TBEAAAAvAAAAAAfQ//73v/+BiOh/AAA='; }); /*! { "name": "Webp Alpha", "async": true, "property": "webpalpha", "aliases": ["webp-alpha"], "tags": ["image"], "authors": ["Krister Kari", "Rich Bradshaw", "Ryan Seddon", "Paul Irish"], "notes": [{ "name": "WebP Info", "href": "http://code.google.com/speed/webp/" },{ "name": "Article about WebP support on Android browsers", "href": "http://www.wope-framework.com/en/2013/06/24/webp-support-on-android-browsers/" },{ "name": "Chormium WebP announcement", "href": "http://blog.chromium.org/2011/11/lossless-and-transparency-encoding-in.html?m=1" }] } !*/ /* DOC Tests for transparent webp support. */ Modernizr.addAsyncTest(function(){ var image = new Image(); image.onerror = function() { addTest('webpalpha', false, { aliases: ['webp-alpha'] }); }; image.onload = function() { addTest('webpalpha', image.width == 1, { aliases: ['webp-alpha'] }); }; image.src = 'data:image/webp;base64,UklGRkoAAABXRUJQVlA4WAoAAAAQAAAAAAAAAAAAQUxQSAwAAAABBxAR/Q9ERP8DAABWUDggGAAAADABAJ0BKgEAAQADADQlpAADcAD++/1QAA=='; }); /*! { "name": "Webp Animation", "async": true, "property": "webpanimation", "aliases": ["webp-animation"], "tags": ["image"], "authors": ["Krister Kari", "Rich Bradshaw", "Ryan Seddon", "Paul Irish"], "notes": [{ "name": "WebP Info", "href": "http://code.google.com/speed/webp/" },{ "name": "Chormium blog - Chrome 32 Beta: Animated WebP images and faster Chrome for Android touch input", "href": "http://blog.chromium.org/2013/11/chrome-32-beta-animated-webp-images-and.html" }] } !*/ /* DOC Tests for animated webp support. */ Modernizr.addAsyncTest(function(){ var image = new Image(); image.onerror = function() { addTest('webpanimation', false, { aliases: ['webp-animation'] }); }; image.onload = function() { addTest('webpanimation', image.width == 1, { aliases: ['webp-animation'] }); }; image.src = 'data:image/webp;base64,UklGRlIAAABXRUJQVlA4WAoAAAASAAAAAAAAAAAAQU5JTQYAAAD/////AABBTk1GJgAAAAAAAAAAAAAAAAAAAGQAAABWUDhMDQAAAC8AAAAQBxAREYiI/gcA'; }); /*! { "name": "Webp", "async": true, "property": "webp", "tags": ["image"], "authors": ["Rich Bradshaw", "Ryan Seddon", "Paul Irish"], "notes": [{ "name": "Webp Info", "href": "http://code.google.com/speed/webp/" }] } !*/ /* DOC Tests for lossy, non-alpha webp support. */ Modernizr.addAsyncTest(function(){ var image = new Image(); image.onerror = function() { addTest('webp', false); }; image.onload = function() { addTest('webp', image.width == 1); }; image.src = 'data:image/webp;base64,UklGRiQAAABXRUJQVlA4IBgAAAAwAQCdASoBAAEAAwA0JaQAA3AA/vuUAAA='; }); /*! { "name": "IndexedDB", "property": "indexeddb", "caniuse": "indexeddb", "tags": ["storage"], "polyfills": ["indexeddb"] } !*/ /* DOC Detects support for the IndexedDB client-side storage API (final spec). */ // Vendors had inconsistent prefixing with the experimental Indexed DB: // - Webkit's implementation is accessible through webkitIndexedDB // - Firefox shipped moz_indexedDB before FF4b9, but since then has been mozIndexedDB // For speed, we don't test the legacy (and beta-only) indexedDB Modernizr.addTest('indexeddb', !!prefixed('indexedDB', window)); /*! { "name": "input formaction", "property": "inputformaction", "aliases": ["input-formaction"], "notes": [{ "name": "WHATWG Spec", "href": "http://www.whatwg.org/specs/web-apps/current-work/multipage/association-of-controls-and-forms.html#attr-fs-formaction" }, { "name": "Wufoo demo", "href": "http://www.wufoo.com/html5/attributes/13-formaction.html" }], "polyfills": [ "webshims" ] } !*/ /* DOC Detect support for the formaction attribute on form inputs */ Modernizr.addTest('inputformaction', !!('formAction' in createElement('input')), { aliases: ['input-formaction'] }); /*! { "name": "input[search] search event", "property": "search", "tags": ["input","search"], "authors": ["Calvin Webster"], "notes": [{ "name": "Wufoo demo", "href": "http://www.wufoo.com/html5/types/5-search.html?" }, { "name": "CSS Tricks", "href": "http://css-tricks.com/webkit-html5-search-inputs/" }] } !*/ /* DOC There is a custom `search` event implemented in webkit browsers when using an `input[search]` element. */ Modernizr.addTest('inputsearchevent', hasEvent('search')); var inputtypes = 'search tel url email datetime date month week time datetime-local number range color'.split(' '); var inputs = {}; var smile = ':)'; /*! { "name": "Form input types", "property": "inputtypes", "caniuse": "forms", "tags": ["forms"], "authors": ["Mike Taylor"], "polyfills": [ "jquerytools", "webshims", "h5f", "webforms2", "nwxforms", "fdslider", "html5slider", "galleryhtml5forms", "jscolor", "html5formshim", "jqueryformshim", "selectedoptionsjs", "formvalidationjs" ] } !*/ /* DOC Detects support for HTML5 form input types and exposes Boolean subproperties with the results: ```javascript Modernizr.inputtypes.color Modernizr.inputtypes.date Modernizr.inputtypes.datetime Modernizr.inputtypes['datetime-local'] Modernizr.inputtypes.email Modernizr.inputtypes.month Modernizr.inputtypes.number Modernizr.inputtypes.range Modernizr.inputtypes.search Modernizr.inputtypes.tel Modernizr.inputtypes.time Modernizr.inputtypes.url Modernizr.inputtypes.week ``` */ // Run through HTML5's new input types to see if the UA understands any. // This is put behind the tests runloop because it doesn't return a // true/false like all the other tests; instead, it returns an object // containing each input type with its corresponding true/false value // Big thanks to @miketaylr for the html5 forms expertise. miketaylr.com/ Modernizr['inputtypes'] = (function(props) { var bool; var inputElemType; var defaultView; var len = props.length; for ( var i = 0; i < len; i++ ) { inputElem.setAttribute('type', inputElemType = props[i]); bool = inputElem.type !== 'text'; // We first check to see if the type we give it sticks.. // If the type does, we feed it a textual value, which shouldn't be valid. // If the value doesn't stick, we know there's input sanitization which infers a custom UI if ( bool ) { inputElem.value = smile; inputElem.style.cssText = 'position:absolute;visibility:hidden;'; if ( /^range$/.test(inputElemType) && inputElem.style.WebkitAppearance !== undefined ) { docElement.appendChild(inputElem); defaultView = document.defaultView; // Safari 2-4 allows the smiley as a value, despite making a slider bool = defaultView.getComputedStyle && defaultView.getComputedStyle(inputElem, null).WebkitAppearance !== 'textfield' && // Mobile android web browser has false positive, so must // check the height to see if the widget is actually there. (inputElem.offsetHeight !== 0); docElement.removeChild(inputElem); } else if ( /^(search|tel)$/.test(inputElemType) ){ // Spec doesn't define any special parsing or detectable UI // behaviors so we pass these through as true // Interestingly, opera fails the earlier test, so it doesn't // even make it here. } else if ( /^(url|email)$/.test(inputElemType) ) { // Real url and email support comes with prebaked validation. bool = inputElem.checkValidity && inputElem.checkValidity() === false; } else { // If the upgraded input compontent rejects the :) text, we got a winner bool = inputElem.value != smile; } } inputs[ props[i] ] = !!bool; } return inputs; })(inputtypes); /*! { "name": "Internationalization API", "property": "Intl", "notes": [{ "name": "MDN documentation", "href": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl" },{ "name": "ECMAScript spec", "href": "http://www.ecma-international.org/ecma-402/1.0/" }] } !*/ /* DOC Detects support for the Internationalization API which allow easy formatting of number and dates and sorting string based on a locale */ Modernizr.addTest('intl', !!prefixed('Intl', window)); /*! { "name": "JSON", "property": "json", "caniuse": "json", "notes": [{ "name": "MDN documentation", "href": "http://developer.mozilla.org/en/JSON" }], "polyfills": ["json2"] } !*/ /* DOC Detects native support for JSON handling functions. */ // this will also succeed if you've loaded the JSON2.js polyfill ahead of time // ... but that should be obvious. :) Modernizr.addTest('json', 'JSON' in window && 'parse' in JSON); /*! { "name": "Reverse Ordered Lists", "property": "olreversed", "notes": [{ "name": "Impressive Webs article", "href": "http://impressivewebs.com/reverse-ordered-lists-html5" }], "polyfills": ["impressivewebs"] } !*/ /* DOC Detects support for the `reversed` attribute on the `
    ` element. */ Modernizr.addTest('olreversed', 'reversed' in createElement('ol')); /*! { "name": "MathML", "property": "mathml", "caniuse": "mathml", "authors": ["Addy Osmani", "Davide P. Cervone", "David Carlisle"], "notes": [{ "name": "W3C spec", "href": "http://www.w3.org/Math/" }], "polyfills": ["mathjax"] } !*/ /* DOC Detects support for MathML, for mathematic equations in web pages. */ // Based on work by Davide (@dpvc) and David (@davidcarlisle) // in https://github.com/mathjax/MathJax/issues/182 Modernizr.addTest('mathml', function() { var ret; Modernizr.testStyles('#modernizr{position:absolute}', function(node){ node.innerHTML = 'xxyy'; ret = node.offsetHeight > node.offsetWidth; }); return ret; }); /*! { "name": "Low Bandwidth Connection", "property": "lowbandwidth", "tags": ["network"] } !*/ /* DOC Tests for determining low-bandwidth via `navigator.connection` There are two iterations of the `navigator.connection` interface. The first is present in Android 2.2+ and only in the Browser (not WebView) - http://docs.phonegap.com/en/1.2.0/phonegap_connection_connection.md.html#connection.type - http://davidbcalhoun.com/2010/using-navigator-connection-android The second is specced at http://dev.w3.org/2009/dap/netinfo/ and perhaps landing in WebKit - http://bugs.webkit.org/show_bug.cgi?id=73528 Unknown devices are assumed as fast For more rigorous network testing, consider boomerang.js: http://github.com/bluesmoon/boomerang/ */ Modernizr.addTest('lowbandwidth', function() { // polyfill var connection = navigator.connection || { type: 0 }; return connection.type == 3 || // connection.CELL_2G connection.type == 4 || // connection.CELL_3G /^[23]g$/.test(connection.type); // string value in new spec }); /*! { "name": "Server Sent Events", "property": "eventsource", "tags": ["network"], "notes": [{ "name": "W3 Spec", "href": "http://dev.w3.org/html5/eventsource/" }] } !*/ /* DOC Tests for server sent events aka eventsource. */ Modernizr.addTest('eventsource', 'EventSource' in window); // http://mathiasbynens.be/notes/xhr-responsetype-json#comment-4 var testXhrType = function(type) { if (typeof XMLHttpRequest == 'undefined') { return false; } var xhr = new XMLHttpRequest(); xhr.open('get', '/', true); try { xhr.responseType = type; } catch(error) { return false; } return 'response' in xhr && xhr.responseType == type; }; /*! { "name": "XMLHttpRequest xhr.responseType='arraybuffer'", "property": "xhrresponsetypearraybuffer", "tags": ["network"], "notes": [{ "name": "XMLHttpRequest Living Standard", "href": "http://xhr.spec.whatwg.org/#the-responsetype-attribute" }] } !*/ /* DOC Tests for XMLHttpRequest xhr.responseType='arraybuffer'. */ Modernizr.addTest('xhrresponsetypearraybuffer', testXhrType('arraybuffer')); /*! { "name": "XMLHttpRequest xhr.responseType='document'", "property": "xhrresponsetypedocument", "tags": ["network"], "notes": [{ "name": "XMLHttpRequest Living Standard", "href": "http://xhr.spec.whatwg.org/#the-responsetype-attribute" }] } !*/ /* DOC Tests for XMLHttpRequest xhr.responseType='document'. */ Modernizr.addTest('xhrresponsetypedocument', testXhrType('document')); /*! { "name": "XMLHttpRequest xhr.responseType='json'", "property": "xhrresponsetypejson", "tags": ["network"], "notes": [{ "name": "XMLHttpRequest Living Standard", "href": "http://xhr.spec.whatwg.org/#the-responsetype-attribute" },{ "name": "Explanation of xhr.responseType='json'", "href": "http://mathiasbynens.be/notes/xhr-responsetype-json" }] } !*/ /* DOC Tests for XMLHttpRequest xhr.responseType='json'. */ Modernizr.addTest('xhrresponsetypejson', testXhrType('json')); /*! { "name": "XMLHttpRequest xhr.responseType='text'", "property": "xhrresponsetypetext", "tags": ["network"], "notes": [{ "name": "XMLHttpRequest Living Standard", "href": "http://xhr.spec.whatwg.org/#the-responsetype-attribute" }] } !*/ /* DOC Tests for XMLHttpRequest xhr.responseType='text'. */ Modernizr.addTest('xhrresponsetypetext', testXhrType('text')); /*! { "name": "XMLHttpRequest xhr.responseType", "property": "xhrresponsetype", "tags": ["network"], "notes": [{ "name": "XMLHttpRequest Living Standard", "href": "http://xhr.spec.whatwg.org/#the-responsetype-attribute" }] } !*/ /* DOC Tests for XMLHttpRequest xhr.responseType. */ Modernizr.addTest('xhrresponsetype', (function() { if (typeof XMLHttpRequest == 'undefined') { return false; } var xhr = new XMLHttpRequest(); xhr.open('get', '/', true); return 'response' in xhr; }())); /*! { "name": "XML HTTP Request Level 2 XHR2", "property": "xhr2", "tags": ["network"], "notes": [{ "name": "W3 Spec", "href": "http://www.w3.org/TR/XMLHttpRequest2/" },{ "name": "Details on Related Github Issue", "href": "http://github.com/Modernizr/Modernizr/issues/385" }] } !*/ /* DOC Tests for XHR2. */ // all three of these details report consistently across all target browsers: // !!(window.ProgressEvent); // !!(window.FormData); // window.XMLHttpRequest && "withCredentials" in new XMLHttpRequest; Modernizr.addTest('xhr2', 'FormData' in window); /*! { "name": "Notification", "property": "notification", "caniuse": "notifications", "authors": ["Theodoor van Donge", "Hendrik Beskow"], "notes": [{ "name": "HTML5 Rocks tutorial", "href": "http://www.html5rocks.com/en/tutorials/notifications/quick/" },{ "name": "W3C spec", "href": "www.w3.org/TR/notifications/" }], "polyfills": ["desktop-notify", "html5-notifications"] } !*/ /* DOC Detects support for the Notifications API */ Modernizr.addTest('notification', 'Notification' in window && 'permission' in window.Notification && 'requestPermission' in window.Notification); /*! { "name": "Page Visibility API", "property": "pagevisibility", "caniuse": "pagevisibility", "tags": ["performance"], "notes": [{ "name": "MDN documentation", "href": "https://developer.mozilla.org/en-US/docs/DOM/Using_the_Page_Visibility_API" },{ "name": "W3C spec", "href": "http://www.w3.org/TR/2011/WD-page-visibility-20110602/" },{ "name": "HTML5 Rocks tutorial", "href": "http://www.html5rocks.com/en/tutorials/pagevisibility/intro/" }], "polyfills": ["visibilityjs", "visiblyjs", "jquery-visibility"] } !*/ /* DOC Detects support for the Page Visibility API, which can be used to disable unnecessary actions and otherwise improve user experience. */ Modernizr.addTest('pagevisibility', !!prefixed('hidden', document, false)); /*! { "name": "Navigation Timing API", "property": "performance", "caniuse": "nav-timing", "tags": ["performance"], "authors": ["Scott Murphy (@uxder)"], "notes": [{ "name": "W3C Spec", "href": "http://www.w3.org/TR/navigation-timing/" },{ "name": "HTML5 Rocks article", "href": "http://www.html5rocks.com/en/tutorials/webperformance/basics/" }], "polyfills": ["perfnow"] } !*/ /* DOC Detects support for the Navigation Timing API, for measuring browser and connection performance. */ Modernizr.addTest('performance', !!prefixed('performance', window)); /*! { "name": "DOM Pointer Events API", "property": "pointerevents", "tags": ["input"], "authors": ["Stu Cox"], "notes": [ "This property name used to refer to the CSS `pointer-events` property, which is now named `csspointerevents`.", { "name": "W3C spec submission", "href": "http://www.w3.org/Submission/pointer-events/" } ], "warnings": ["This property name now refers to W3C DOM PointerEvents: https://github.com/Modernizr/Modernizr/issues/548#issuecomment-12812099"], "polyfills": ["handjs"] } !*/ /* DOC Detects support for the DOM Pointer Events API, which provides a unified event interface for pointing input devices, as implemented in IE10+. */ // **Test name hijacked!** // Now refers to W3C DOM PointerEvents spec rather than the CSS pointer-events property. Modernizr.addTest('pointerevents', function () { // Cannot use `.prefixed()` for events, so test each prefix var bool = false, i = domPrefixes.length; // Don't forget un-prefixed... bool = Modernizr.hasEvent('pointerdown'); while (i-- && !bool) { if (hasEvent(domPrefixes[i] + 'pointerdown')) { bool = true; } } return bool; }); /*! { "name": "Pointer Lock API", "property": "pointerlock", "notes": [{ "name": "MDN documentation", "href": "https://developer.mozilla.org/en-US/docs/API/Pointer_Lock_API" }] } !*/ // https://developer.mozilla.org/en-US/docs/API/Pointer_Lock_API Modernizr.addTest('pointerlock', !!prefixed('exitPointerLock', document)); /*! { "name": "postMessage", "property": "postmessage", "caniuse": "x-doc-messaging", "notes": [{ "name": "W3C Spec", "href": "http://www.w3.org/TR/html5/comms.html#posting-messages" }], "polyfills": ["easyxdm", "postmessage-jquery"] } !*/ /* DOC Detects support for the `window.postMessage` protocol for cross-document messaging. */ Modernizr.addTest('postmessage', 'postMessage' in window); /*! { "name": "Quota Storage Management API", "property": "quotamanagement", "tags": ["storage"], "notes": [{ "name": "W3C Spec", "href": "http://www.w3.org/TR/quota-api/" }] } !*/ /* DOC */ Modernizr.addTest('quotamanagement', function() { var tempStorage = prefixed('temporaryStorage', navigator); var persStorage = prefixed('persistentStorage', navigator); return !!(tempStorage && persStorage); }); /*! { "name": "requestAnimationFrame", "property": "requestanimationframe", "aliases": ["raf"], "caniuse": "requestanimationframe", "tags": ["animation"], "authors": ["Addy Osmani"], "notes": [{ "name": "W3C spec", "href": "http://www.w3.org/TR/animation-timing/" }], "polyfills": ["raf"] } !*/ /* DOC Detects support for the `window.requestAnimationFrame` API, for offloading animation repainting to the browser for optimized performance. */ Modernizr.addTest('requestanimationframe', !!prefixed('requestAnimationFrame', window), { aliases: ['raf'] }); /*! { "name": "script[async]", "property": "scriptasync", "caniuse": "script-async", "tags": ["script"], "authors": ["Theodoor van Donge"] } !*/ /* DOC Detects support for the `async` attribute on the `