Repository: filamentgroup/loadCSS
Branch: master
Commit: e2fa3939a641
Files: 34
Total size: 92.5 KB
Directory structure:
gitextract_fe3l29rk/
├── .gitignore
├── .jshintrc
├── .npmignore
├── .travis.yml
├── CONTRIBUTING.md
├── Gruntfile.js
├── LICENSE
├── README.md
├── bower.json
├── package.json
├── server.js
├── src/
│ ├── loadCSS.js
│ └── onloadCSS.js
└── test/
├── .htaccess
├── attributes.html
├── body.html
├── control.html
├── dom-append.html
├── import-head.html
├── import.html
├── index.html
├── mediatoggle.html
├── new-high.html
├── new-low.html
├── qunit/
│ ├── files/
│ │ ├── preloadtest.css
│ │ └── test.css
│ ├── index.html
│ ├── libs/
│ │ └── qunit/
│ │ ├── qunit.css
│ │ └── qunit.js
│ └── tests.js
├── recommended.html
├── slow.css
├── test-onload.html
└── test.html
================================================
FILE CONTENTS
================================================
================================================
FILE: .gitignore
================================================
node_modules
dist
================================================
FILE: .jshintrc
================================================
{
"boss": true,
"curly": true,
"eqeqeq": true,
"eqnull": true,
"expr": true,
"immed": true,
"noarg": true,
"smarttabs": true,
"trailing": true,
"undef": true,
"unused": true,
"node": true,
"loopfunc": true,
"browser": true,
"qunit": true,
"globals": {
"loadCSS": false,
"onloadCSS": false
}
}
================================================
FILE: .npmignore
================================================
node_modules
================================================
FILE: .travis.yml
================================================
language: node_js
node_js:
- 12.6.0
before_script:
- npm install
script: grunt -v
================================================
FILE: CONTRIBUTING.md
================================================
# Contributing to loadCSS
Contributions are appreciated. In order for us to consider including a contribution, it does have to meet a few criteria:
* Code is specific to one issue (eg. feature, extension or bug)
* Code is formatted according to JavaScript Style Guide.
* Code has full test coverage and all tests pass.
## Code to an Issue
Use a separate git branch for each contribution. Give the branch a meaningful name.
When you are contributing a new extensions use the name of this extension, like `dom-toggleclass`.
Otherwise give it a descriptive name like `doc-generator` or reference a specific issue like `issues-12`.
When the issue is resolved create a pull request to allow us to review and accept your contribution.
## JavaScript Style Guide
Code should be formatted according to the [jQuery JavaScript Style Guide](http://contribute.jquery.org/style-guide/).
================================================
FILE: Gruntfile.js
================================================
/* global module:false */
module.exports = function(grunt) {
require( 'matchdep' ).filterDev( ['grunt-*', '!grunt-cli'] ).forEach( grunt.loadNpmTasks );
// Project configuration.
grunt.initConfig({
jshint: {
all: {
options: {
jshintrc: ".jshintrc"
},
src: [
'*.js',
'test/**/*.js',
'src/**/*.js',
]
}
},
concat: {
dist: {
files: {
'dist/loadCSS.js': ['src/loadCSS.js'],
'dist/onloadCSS.js': ['src/onloadCSS.js']
}
}
},
uglify: {
options: {
preserveComments: /^\!/
},
dist: {
files: {
'dist/loadCSS.min.js': ['src/loadCSS.js'],
'dist/onloadCSS.min.js': ['src/onloadCSS.js']
}
}
},
qunit: {
files: ['test/qunit/**/*.html']
}
});
grunt.registerTask('default', ['jshint', 'qunit', 'concat', 'uglify']);
grunt.registerTask('stage', ['default']);
};
================================================
FILE: LICENSE
================================================
The MIT License (MIT)
Copyright (c) @scottjehl, 2016 Filament Group
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
================================================
FILE: README.md
================================================
:warning: This project is archived and the repository is no longer maintained.
# loadCSS
A pattern for loading CSS asynchronously
[c]2020 @scottjehl, @zachleat [Filament Group, Inc.](https://www.filamentgroup.com/)
Licensed MIT
## Why an ansychronous CSS loader?
Referencing CSS stylesheets with `link[rel=stylesheet]` or `@import` causes browsers to delay page rendering while a stylesheet loads. When loading stylesheets that are not critical to the initial rendering of a page, this blocking behavior is undesirable. The pattern below allows us to fetch and apply CSS asynchronously. If necessary, this repo also offers a separate (and optional) JavaScript function for loading stylesheets dynamically.
## How to use
As a primary pattern, we recommend loading asynchronous CSS like this from HTML:
`<link rel="stylesheet" href="/path/to/my.css" media="print" onload="this.media='all'; this.onload=null;">`
This article explains why this approach is best: https://www.filamentgroup.com/lab/load-css-simpler/
That is probably all you need! But if you want to load a CSS file from a JavaScript function, read on...
## Dynamic CSS loading with the loadCSS function
The [loadCSS.js](https://github.com/filamentgroup/loadCSS/blob/master/src/loadCSS.js) file exposes a global `loadCSS` function that you can call to load CSS files programmatically, if needed. This is handy for cases where you need to dynamically load CSS from script.
``` javascript
loadCSS( "path/to/mystylesheet.css" );
```
The code above will insert a new CSS stylesheet `link` *after* the last stylesheet or script that it finds in the page, and the function will return a reference to that `link` element, should you want to reference it later in your script. Multiple calls to loadCSS will reference CSS files in the order they are called, but keep in mind that they may finish loading in a different order than they were called.
## Function API
The loadCSS function has 3 optional arguments.
- `before`: By default, loadCSS attempts to inject the stylesheet link *after* all CSS and JS in the page. However, if you desire a more specific location in your document, such as before a particular stylesheet link, you can use the `before` argument to specify a particular element to use as an insertion point. Your stylesheet will be inserted *before* the element you specify. For example, here's how that can be done by simply applying an `id` attribute to your `script`.
```html
<head>
...
<script id="loadcss">
// load a CSS file just before the script element containing this code
loadCSS( "path/to/mystylesheet.css", document.getElementById("loadcss") );
</script>
...
</head>
```
- `media`: You can optionally pass a string to the media argument to set the `media=""` of the stylesheet - the default value is `all`.
- `attributes`: You can also optionally pass an Object of attribute name/attribute value pairs to set on the stylesheet. This can be used to specify Subresource Integrity attributes:
```javascript
loadCSS(
"https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css",
null,
null,
{
"crossorigin": "anonymous",
"integrity": "sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm"
}
);
```
#### Using with `onload`
Onload event support for `link` elements is spotty in some browsers, so if you need to add an onload callback, include [`onloadCSS` function](https://github.com/filamentgroup/loadCSS/blob/master/src/onloadCSS.js) on your page and use the `onloadCSS` function:
```javascript
var stylesheet = loadCSS( "path/to/mystylesheet.css" );
onloadCSS( stylesheet, function() {
console.log( "Stylesheet has loaded." );
});
```
### Browser Support
The loadCSS patterns attempt to load a css file asynchronously in any JavaScript-capable browser. However, some older browsers such as Internet Explorer 8 and older will block rendering while the stylesheet is loading. This merely means that the stylesheet will load as if you referenced it with an ordinary link element.
# Changes in version 3.0 (no more preload polyfill)
As of version 3.0, we no longer support or include a polyfill for a `rel=preload` markup pattern. This is because we have since determined that the markup pattern described at the top of this readme is simpler and better for performance, while the former preload pattern could sometimes conflict with resource priorities in ways that aren't helpful for loading CSS in a non-blocking way.
To update, you can change your preload markup to [this HTML pattern](https://github.com/filamentgroup/loadCSS/blob/master/README.md#how-to-use) and delete the JS from your build.
Since this change breaks the API from prior versions, we made it a major version bump. That way, if you are still needing to use the now-deprecated preload pattern, you can keep your code pointing at prior versions that are still on NPM, such as version 2.1.0 https://github.com/filamentgroup/loadCSS/releases/tag/v2.1.0
#### Contributions and bug fixes
Both are very much appreciated - especially bug fixes. As for contributions, the goals of this project are to keep things very simple and utilitarian, so if we don't accept a feature addition, it's not necessarily because it's a bad idea. It just may not meet the goals of the project. Thanks!
================================================
FILE: bower.json
================================================
{
"name": "loadcss",
"main": [
"src/loadCSS.js"
],
"ignore": [
"**/.*"
]
}
================================================
FILE: package.json
================================================
{
"name": "fg-loadcss",
"version": "3.1.0",
"description": "A function for loading CSS asynchronously",
"main": "src/loadCSS.js",
"repository": {
"type": "git",
"url": "https://github.com/filamentgroup/loadCSS.git"
},
"author": "Filament Group <hello@filamentgroup.com>",
"license": "MIT",
"bugs": {
"url": "https://github.com/filamentgroup/loadCSS/issues"
},
"homepage": "https://github.com/filamentgroup/loadCSS",
"engines": {
"node": ">= 11.9.0"
},
"devDependencies": {
"grunt": "^1.1.0",
"grunt-cli": "~1.3.2",
"grunt-contrib-concat": "^1.0.1",
"grunt-contrib-jshint": "~2.0.0",
"grunt-contrib-qunit": "^3.1.0",
"grunt-contrib-uglify": "^4.0.0",
"husky": "^1.3.1",
"matchdep": "^2.0.0"
},
"scripts": {
"start": "npx ./server.js",
"test": "npx grunt"
},
"husky": {
"hooks": {
"pre-commit": "npm test"
}
}
}
================================================
FILE: server.js
================================================
/* jshint esversion: 6 */
const fs = require('fs');
const http = require('http');
const path = require('path');
const port = 3000;
const server = http.createServer(requestHandler);
server.listen(port, (err) => {
if (err) {
return console.error('could not run server', err);
}
console.log(`server is listening on ${port}`);
});
const contentTypes = {
'.css': 'text/css',
'.html': 'text/html',
'.js': 'application/javascript',
};
function requestHandler (request, response) {
console.log(JSON.stringify(request.url));
try {
response.setHeader('charset', 'UTF-8');
response.setHeader('Cache-Control', 'max-age=500');
if (!path.extname(request.url)) {
request.url += '/index.html';
}
response.setHeader('Content-type', contentTypes[path.extname(request.url)]);
const content = fs.readFileSync(
path.join('.', request.url)
).toString().replace(/<!--#include virtual="([^"]+)" -->/g, (match, filepath) => fs.readFileSync(
path.resolve(path.dirname(path.join('.', request.url)), filepath)
));
if (request.url.endsWith('slow.css')) {
setTimeout(() => {
response.end( content );
}, 5000);
} else {
response.end( content );
}
} catch (error) {
const errorMessage = (error.message && (error.message + '\n' + error.stack)) || error;
if (errorMessage.includes('ENOENT')) {
response.statusCode = 404;
} else {
response.statusCode = 500;
}
response.end('<pre>' + errorMessage);
}
}
================================================
FILE: src/loadCSS.js
================================================
/*! loadCSS. [c]2020 Filament Group, Inc. MIT License */
(function(w){
"use strict";
/* exported loadCSS */
var loadCSS = function( href, before, media, attributes ){
// Arguments explained:
// `href` [REQUIRED] is the URL for your CSS file.
// `before` [OPTIONAL] is the element the script should use as a reference for injecting our stylesheet <link> before
// By default, loadCSS attempts to inject the link after the last stylesheet or script in the DOM. However, you might desire a more specific location in your document.
// `media` [OPTIONAL] is the media type or query of the stylesheet. By default it will be 'all'
// `attributes` [OPTIONAL] is the Object of attribute name/attribute value pairs to set on the stylesheet's DOM Element.
var doc = w.document;
var ss = doc.createElement( "link" );
var ref;
if( before ){
ref = before;
}
else {
var refs = ( doc.body || doc.getElementsByTagName( "head" )[ 0 ] ).childNodes;
ref = refs[ refs.length - 1];
}
var sheets = doc.styleSheets;
// Set any of the provided attributes to the stylesheet DOM Element.
if( attributes ){
for( var attributeName in attributes ){
if( attributes.hasOwnProperty( attributeName ) ){
ss.setAttribute( attributeName, attributes[attributeName] );
}
}
}
ss.rel = "stylesheet";
ss.href = href;
// temporarily set media to something inapplicable to ensure it'll fetch without blocking render
ss.media = "only x";
// wait until body is defined before injecting link. This ensures a non-blocking load in IE11.
function ready( cb ){
if( doc.body ){
return cb();
}
setTimeout(function(){
ready( cb );
});
}
// Inject link
// Note: the ternary preserves the existing behavior of "before" argument, but we could choose to change the argument to "after" in a later release and standardize on ref.nextSibling for all refs
// Note: `insertBefore` is used instead of `appendChild`, for safety re: http://www.paulirish.com/2011/surefire-dom-element-insertion/
ready( function(){
ref.parentNode.insertBefore( ss, ( before ? ref : ref.nextSibling ) );
});
// A method (exposed on return object for external use) that mimics onload by polling document.styleSheets until it includes the new sheet.
var onloadcssdefined = function( cb ){
var resolvedHref = ss.href;
var i = sheets.length;
while( i-- ){
if( sheets[ i ].href === resolvedHref ){
return cb();
}
}
setTimeout(function() {
onloadcssdefined( cb );
});
};
function loadCB(){
if( ss.addEventListener ){
ss.removeEventListener( "load", loadCB );
}
ss.media = media || "all";
}
// once loaded, set link's media back to `all` so that the stylesheet applies once it loads
if( ss.addEventListener ){
ss.addEventListener( "load", loadCB);
}
ss.onloadcssdefined = onloadcssdefined;
onloadcssdefined( loadCB );
return ss;
};
// commonjs
if( typeof exports !== "undefined" ){
exports.loadCSS = loadCSS;
}
else {
w.loadCSS = loadCSS;
}
}( typeof global !== "undefined" ? global : this ));
================================================
FILE: src/onloadCSS.js
================================================
/*! onloadCSS. (onload callback for loadCSS) [c]2017 Filament Group, Inc. MIT License */
/* global navigator */
/* exported onloadCSS */
function onloadCSS( ss, callback ) {
var called;
function newcb(){
if( !called && callback ){
called = true;
callback.call( ss );
}
}
if( ss.addEventListener ){
ss.addEventListener( "load", newcb );
}
if( ss.attachEvent ){
ss.attachEvent( "onload", newcb );
}
// This code is for browsers that don’t support onload
// No support for onload (it'll bind but never fire):
// * Android 4.3 (Samsung Galaxy S4, Browserstack)
// * Android 4.2 Browser (Samsung Galaxy SIII Mini GT-I8200L)
// * Android 2.3 (Pantech Burst P9070)
// Weak inference targets Android < 4.4
if( "isApplicationInstalled" in navigator && "onloadcssdefined" in ss ) {
ss.onloadcssdefined( newcb );
}
}
================================================
FILE: test/.htaccess
================================================
# make sure our ssi includes work
SSILegacyExprParser on
# enabled SSI for .html files
AddType text/html .html
AddHandler server-parsed .html
Options Indexes Includes FollowSymlinks
# ----------------------------------------------------------------------
# | Expires headers |
# ----------------------------------------------------------------------
# Serve resources with far-future expires headers.
#
# (!) If you don't control versioning with filename-based
# cache busting, you should consider lowering the cache times
# to something like one week.
#
# https://httpd.apache.org/docs/current/mod/mod_expires.html
<IfModule mod_expires.c>
ExpiresActive on
ExpiresDefault "access plus 1 minutes"
</IfModule>
================================================
FILE: test/attributes.html
================================================
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Tests for "link" attributes</title>
<script type="text/javascript">
<!--#include virtual="../src/loadCSS.js" -->
<!--#include virtual="../src/onloadCSS.js" -->
(function () {
function loadBootstrapCSS( attributes ) {
const cacheBuster = Math.random();
return loadCSS(
"https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" + '?cb=' + cacheBuster,
null,
null,
attributes
);
}
// Load Bootstrap with "incorrect" integrity attribute:
var incorrectCSSIntegrity = loadBootstrapCSS( {
"crossorigin": "anonymous",
"integrity": "sha384-incorrect-digest"
});
incorrectCSSIntegrity.onerror = function( error ) {
document.getElementById('incorrect-integrity').innerHTML = '<span class="text-success">Success!</span> Resource not loaded.';
}
onloadCSS( incorrectCSSIntegrity, function() {
document.getElementById('incorrect-integrity').innerHTML = '<span class="text-warning">Warning:</span> Resource should not have loaded.';
} );
// Load Bootstrap with "incorrect" crossorigin attribute:
var incorrectCSSCrossOrigin = loadBootstrapCSS( {
"crossorigin": "use-credentials",
"integrity": "sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm"
});
incorrectCSSCrossOrigin.onerror = function( error ) {
document.getElementById('incorrect-crossorigin').innerHTML = '<span class="text-success">Success!</span> Resource not loaded.';
}
onloadCSS( incorrectCSSCrossOrigin, function() {
document.getElementById('incorrect-crossorigin').innerHTML = '<span class="text-warning">Warning:</span> Resource should not have loaded.';
} );
// Load Bootstrap with "correct" integrity attribute:
var correctCSSIntegrity = loadBootstrapCSS( {
"crossorigin": "anonymous",
"integrity": "sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm"
} );
correctCSSIntegrity.onerror = function( error ) {
document.getElementById('correct-integrity').innerHTML = '<span class="text-warning">Warning:</span> Resource should have loaded.';
}
onloadCSS( correctCSSIntegrity, function() {
document.getElementById('correct-integrity').innerHTML = '<span class="text-success">Success!</span> Resource loaded.';
} );
})();
</script>
</head>
<body style="margin: 50px">
<h1>Tests for <code>link</code> attributes</h1>
<p>Support for <a href="https://developer.mozilla.org/en-US/docs/Web/Security/Subresource_Integrity">Subresource Integrity</a> requires providing <code>integrity</code> and <code>crossorigin</code> attributes to the <code>link</code> Element.</p>
<p>By supplying an Object of attribue name/attribute value pairs as the fourth argument to <code>loadCSS()</code>, attributes can be set on the stylesheet's DOM Element.</p>
<pre><code>
loadCSS(
"https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css",
null,
null,
{
"title": "Bootstrap Styles",
"type": "text/css",
"crossorigin": "anonymous",
"integrity": "sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm"
// etc.
}
);
</code></pre>
<p>The following tests aim to validate the behavior of the API using correct and incorrect configurations:</p>
<table class="table">
<thead>
<tr>
<th>Test</th>
<th>Result</th>
</tr>
</thead>
<tbody>
<tr>
<td>Correct <code>integrity</code> digest</td>
<td id="correct-integrity">Running test...</td>
</tr>
<tr>
<td>Incorrect <code>integrity</code> digest</td>
<td id="incorrect-integrity">Running test...</td>
</tr>
<tr>
<td>Incorrect <code>crossorigin</code> attribute</td>
<td id="incorrect-crossorigin">Running test...</td>
</tr>
</tbody>
</table>
</body>
</html>
================================================
FILE: test/body.html
================================================
<!doctype HTML>
<html>
<head>
<title>Link in body Test</title>
<meta charset="utf-8">
</head>
<body>
<h1>Text before the link</h1>
<link rel="stylesheet" href="slow.css">
<h1>Text after the link</h1>
</body>
</html>
================================================
FILE: test/control.html
================================================
<!doctype HTML>
<html>
<head>
<title>Blocking Test</title>
<meta charset="utf-8">
<link rel="stylesheet" href="slow.css">
</head>
<body>
<p>This is a control test file to verify that an ordinary link to a slow-responding stylesheet will block render. If this text is not visible for 5 seconds or so, assumptions about CSS blocking render are valid in your browser.</p>
</body>
</html>
================================================
FILE: test/dom-append.html
================================================
<!doctype HTML>
<html>
<head>
<title>Blocking Test</title>
<meta charset="utf-8">
</head>
<body>
<p>This is a control test file to verify that a JavaScript appended link to a slow-responding stylesheet will block render. If this text is not visible for 5 seconds or so, assumptions about CSS blocking render are valid in your browser.</p>
<script>
(function() {
var req = document.createElement("link");
req.rel = "stylesheet";
req.href = "slow.css";
document.body.appendChild(req);
})();
</script>
</body>
</html>
================================================
FILE: test/import-head.html
================================================
<!doctype HTML>
<html>
<head>
<title>Blocking Test</title>
<meta charset="utf-8">
<style>
@import url("slow.css" );
</style>
</head>
<body>
<p>This is a control test file to verify that an ordinary link to a slow-responding stylesheet will block render. If this text is not visible for 5 seconds or so, assumptions about CSS blocking render are valid in your browser.</p>
</body>
</html>
================================================
FILE: test/import.html
================================================
<!doctype HTML>
<html>
<head>
<title>Blocking Test</title>
<meta charset="utf-8">
</head>
<body>
<p>This is a control test file to verify that an ordinary link to a slow-responding stylesheet will block render. If this text is not visible for 5 seconds or so, assumptions about CSS blocking render are valid in your browser.</p>
<style>
@import url("slow.css" );
</style>
</body>
</html>
================================================
FILE: test/index.html
================================================
<!doctype HTML>
<html>
<head>
<title>LoadCSS Diagnostic Test Files</title>
<meta charset="utf-8">
<style>
/* a few demo styles */
body {
font-family: sans-serif;
margin: 50px auto;
max-width: 40em;
padding: 0 20px;
line-height: 1.5
}
</style>
</head>
<body>
<h1>CSS Loading Diagnostic Tests</h1>
<p>This directory contains a variety of files that employ various CSS loading techniques.
Most files reference a CSS file that may include a 5-second server delay to mimic latency, when tested on a node server.
The delay makes it easier to determine if content is rendered before the CSS loads.</p>
<p><a href="recommended.html">Recommended Pattern</a></p>
<h2>Standard Loading Tests</h2>
<ul>
<li><strong><a href="control.html">Link in Head</a>:</strong> Does a link to a stylesheet from the head of the page block page rendering?</li>
<li><strong><a href="body.html">Link in Body</a>:</strong> Does a stylesheet link in the body of the page block all page rendering, rendering of content that comes after it, or not block at all?</li>
<li><strong><a href="import-head.html">@import in Head</a>:</strong> Does an inline @import reference from the head of the page block rendering?</li>
<li><strong><a href="import.html">@import in Body</a>:</strong> Does an inline @import reference from the body of the page block rendering of content below it?</li>
<li><strong><a href="dom-append.html">DOM appendChild</a>:</strong> Create a link element and append to the document.</li>
<li><strong><a href="attributes.html">Link attributes</a>:</strong> Do browsers supporting Subresource Integrity correctly handle link attributes?</li>
</ul>
<h2>LoadCSS Assisted Loading</h2>
<ul>
<li><strong><a href="test.html">loadCSS Dynamic Load</a>:</strong> Stylesheet loaded with loadCSS() dynamically.</li>
<li><strong><a href="test-onload.html">loadCSS Dynamic Load with onload handler</a>:</strong> Same as above with onload script handler.</li>
</ul>
</body>
</html>
================================================
FILE: test/mediatoggle.html
================================================
<!doctype HTML>
<html>
<head>
<title>CSS link media toggle</title>
<link rel="stylesheet" href="slow.css" media="print" onload="this.media='all'; this.onload=null;">
<noscript><link rel="stylesheet" href="slow.css"></noscript>
<style>
/* a few demo styles */
body {
font-family: sans-serif;
margin: 50px auto;
max-width: 40em;
padding: 0 20px;
line-height: 1.5
}
pre {
white-space: normal;
background: #fff;
padding: 15px;
border: 1px solid rgba(0,0,0,.3);
color: #333;
}
</style>
</head>
<body>
<p>This is a test page that references a stylesheet using a standard <code>link[rel=stylesheet] with a print media type, which is swapped to all media when loaded.</code>.<p>
<p>That markup looks like this:</p>
<pre><code><link rel="stylesheet" href="slow.css" media="print" onload="this.media='all'"></code></pre>
<p>Note: When run locally, the CSS file has a 5 second delay built into its server response time. If it is loaded in a non-blocking manner as desired, you should be able to read this text before the page is styled as white text on green background.</p>
</body>
</html>
================================================
FILE: test/new-high.html
================================================
<!doctype HTML>
<html>
<head>
<title>Recommended Pattern Test</title>
<meta charset="utf-8">
<link rel="alternate stylesheet preload" href="slow.css" title="styles" as="style" onload="this.title='';this.rel='stylesheet'">
</head>
<body style="font-family: sans-serif;">
<p><a href="https://github.com/filamentgroup/loadCSS/">LoadCSS Project</a></p>
<h1>LoadCSS: High-Priority Asynchronous CSS Loading Demo</h1>
<p>This test page demonstrates a new pattern for loading a stylesheet asynchronously at a low priority. The page will turn green when the CSS loads. </p>
<pre><code>
<link rel="alternate stylesheet preload" href="slow.css" title="styles" as="style" onload="this.title='';this.rel='stylesheet'">
</code></pre>
<p>Instead of the <a href="recommended.html"> usual print toggle</a>, this page is loading CSS with rel="alternate stylesheet preload", which will load async at a high priority.
On load, the rel is set to stylesheet and title is turned off, causing it to apply.
What's nice about this pattern is you can lower the priority by removing the rel value of "preload" to decrease its priority from high to low. <a href="new-low.html">View low priority async demo</a> </p>
</body>
</html>
================================================
FILE: test/new-low.html
================================================
<!doctype HTML>
<html>
<head>
<title>Recommended Pattern Test</title>
<meta charset="utf-8">
<link rel="alternate stylesheet" href="slow.css" title="styles" as="style" onload="this.title='';this.rel='stylesheet'">
</head>
<body style="font-family: sans-serif;">
<p><a href="https://github.com/filamentgroup/loadCSS/">LoadCSS Project</a></p>
<h1>LoadCSS: Low-Priority Asynchronous CSS Loading Demo</h1>
<p>This test page demonstrates a new pattern for loading a stylesheet asynchronously at a low priority. The page will turn green when the CSS loads. </p>
<pre><code>
<link rel="alternate stylesheet" href="slow.css" title="styles" as="style" onload="this.title='';this.rel='stylesheet'">
</code></pre>
<p>Instead of the <a href="recommended.html"> usual print toggle</a>, this page is loading CSS with rel="alternate stylesheet", which will load async at a low priority. Onload, the rel is set to stylesheet and title is turned off, causing it to apply.
What's nice about this pattern is you can add another rel value of "preload" to increase its priority from low to high. <a href="new-high.html">View high priority async demo</a> </p>
</body>
</html>
================================================
FILE: test/qunit/files/preloadtest.css
================================================
// just a file
================================================
FILE: test/qunit/files/test.css
================================================
.foo {
background: white;
}
.bar {
background: rgb(0, 128, 0);
}
================================================
FILE: test/qunit/index.html
================================================
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>LoadCSS Test Suite</title>
<meta id="before-test" name=""></meta>
<!-- Load local QUnit. -->
<link rel="stylesheet" href="./libs/qunit/qunit.css" media="screen">
<script src="./libs/qunit/qunit.js"></script>
<!-- Load local lib and tests. -->
<script src="../../src/loadCSS.js" id="loadCSS"></script>
<script src="../../src/onloadCSS.js"></script>
<script src="./tests.js"></script>
</head>
<body>
<div id="qunit"></div>
<div id="qunit-fixture">
</div>
</body>
</html>
================================================
FILE: test/qunit/libs/qunit/qunit.css
================================================
/**
* QUnit v1.11.0 - A JavaScript Unit Testing Framework
*
* http://qunitjs.com
*
* Copyright 2012 jQuery Foundation and other contributors
* Released under the MIT license.
* http://jquery.org/license
*/
/** Font Family and Sizes */
#qunit-tests, #qunit-header, #qunit-banner, #qunit-testrunner-toolbar, #qunit-userAgent, #qunit-testresult {
font-family: "Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial, sans-serif;
}
#qunit-testrunner-toolbar, #qunit-userAgent, #qunit-testresult, #qunit-tests li { font-size: small; }
#qunit-tests { font-size: smaller; }
/** Resets */
#qunit-tests, #qunit-header, #qunit-banner, #qunit-userAgent, #qunit-testresult, #qunit-modulefilter {
margin: 0;
padding: 0;
}
/** Header */
#qunit-header {
padding: 0.5em 0 0.5em 1em;
color: #8699a4;
background-color: #0d3349;
font-size: 1.5em;
line-height: 1em;
font-weight: normal;
border-radius: 5px 5px 0 0;
-moz-border-radius: 5px 5px 0 0;
-webkit-border-top-right-radius: 5px;
-webkit-border-top-left-radius: 5px;
}
#qunit-header a {
text-decoration: none;
color: #c2ccd1;
}
#qunit-header a:hover,
#qunit-header a:focus {
color: #fff;
}
#qunit-testrunner-toolbar label {
display: inline-block;
padding: 0 .5em 0 .1em;
}
#qunit-banner {
height: 5px;
}
#qunit-testrunner-toolbar {
padding: 0.5em 0 0.5em 2em;
color: #5E740B;
background-color: #eee;
overflow: hidden;
}
#qunit-userAgent {
padding: 0.5em 0 0.5em 2.5em;
background-color: #2b81af;
color: #fff;
text-shadow: rgba(0, 0, 0, 0.5) 2px 2px 1px;
}
#qunit-modulefilter-container {
float: right;
}
/** Tests: Pass/Fail */
#qunit-tests {
list-style-position: inside;
}
#qunit-tests li {
padding: 0.4em 0.5em 0.4em 2.5em;
border-bottom: 1px solid #fff;
list-style-position: inside;
}
#qunit-tests.hidepass li.pass, #qunit-tests.hidepass li.running {
display: none;
}
#qunit-tests li strong {
cursor: pointer;
}
#qunit-tests li a {
padding: 0.5em;
color: #c2ccd1;
text-decoration: none;
}
#qunit-tests li a:hover,
#qunit-tests li a:focus {
color: #000;
}
#qunit-tests li .runtime {
float: right;
font-size: smaller;
}
.qunit-assert-list {
margin-top: 0.5em;
padding: 0.5em;
background-color: #fff;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}
.qunit-collapsed {
display: none;
}
#qunit-tests table {
border-collapse: collapse;
margin-top: .2em;
}
#qunit-tests th {
text-align: right;
vertical-align: top;
padding: 0 .5em 0 0;
}
#qunit-tests td {
vertical-align: top;
}
#qunit-tests pre {
margin: 0;
white-space: pre-wrap;
word-wrap: break-word;
}
#qunit-tests del {
background-color: #e0f2be;
color: #374e0c;
text-decoration: none;
}
#qunit-tests ins {
background-color: #ffcaca;
color: #500;
text-decoration: none;
}
/*** Test Counts */
#qunit-tests b.counts { color: black; }
#qunit-tests b.passed { color: #5E740B; }
#qunit-tests b.failed { color: #710909; }
#qunit-tests li li {
padding: 5px;
background-color: #fff;
border-bottom: none;
list-style-position: inside;
}
/*** Passing Styles */
#qunit-tests li li.pass {
color: #3c510c;
background-color: #fff;
border-left: 10px solid #C6E746;
}
#qunit-tests .pass { color: #528CE0; background-color: #D2E0E6; }
#qunit-tests .pass .test-name { color: #366097; }
#qunit-tests .pass .test-actual,
#qunit-tests .pass .test-expected { color: #999999; }
#qunit-banner.qunit-pass { background-color: #C6E746; }
/*** Failing Styles */
#qunit-tests li li.fail {
color: #710909;
background-color: #fff;
border-left: 10px solid #EE5757;
white-space: pre;
}
#qunit-tests > li:last-child {
border-radius: 0 0 5px 5px;
-moz-border-radius: 0 0 5px 5px;
-webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
}
#qunit-tests .fail { color: #000000; background-color: #EE5757; }
#qunit-tests .fail .test-name,
#qunit-tests .fail .module-name { color: #000000; }
#qunit-tests .fail .test-actual { color: #EE5757; }
#qunit-tests .fail .test-expected { color: green; }
#qunit-banner.qunit-fail { background-color: #EE5757; }
/** Result */
#qunit-testresult {
padding: 0.5em 0.5em 0.5em 2.5em;
color: #2b81af;
background-color: #D2E0E6;
border-bottom: 1px solid white;
}
#qunit-testresult .module-name {
font-weight: bold;
}
/** Fixture */
#qunit-fixture {
position: absolute;
top: -10000px;
left: -10000px;
width: 1000px;
height: 1000px;
}
================================================
FILE: test/qunit/libs/qunit/qunit.js
================================================
/**
* QUnit v1.11.0 - A JavaScript Unit Testing Framework
*
* http://qunitjs.com
*
* Copyright 2012 jQuery Foundation and other contributors
* Released under the MIT license.
* http://jquery.org/license
*/
/* jshint ignore:start */
(function( window ) {
var QUnit,
assert,
config,
onErrorFnPrev,
testId = 0,
fileName = (sourceFromStacktrace( 0 ) || "" ).replace(/(:\d+)+\)?/, "").replace(/.+\//, ""),
toString = Object.prototype.toString,
hasOwn = Object.prototype.hasOwnProperty,
// Keep a local reference to Date (GH-283)
Date = window.Date,
defined = {
setTimeout: typeof window.setTimeout !== "undefined",
sessionStorage: (function() {
var x = "qunit-test-string";
try {
sessionStorage.setItem( x, x );
sessionStorage.removeItem( x );
return true;
} catch( e ) {
return false;
}
}())
},
/**
* Provides a normalized error string, correcting an issue
* with IE 7 (and prior) where Error.prototype.toString is
* not properly implemented
*
* Based on http://es5.github.com/#x15.11.4.4
*
* @param {String|Error} error
* @return {String} error message
*/
errorString = function( error ) {
var name, message,
errorString = error.toString();
if ( errorString.substring( 0, 7 ) === "[object" ) {
name = error.name ? error.name.toString() : "Error";
message = error.message ? error.message.toString() : "";
if ( name && message ) {
return name + ": " + message;
} else if ( name ) {
return name;
} else if ( message ) {
return message;
} else {
return "Error";
}
} else {
return errorString;
}
},
/**
* Makes a clone of an object using only Array or Object as base,
* and copies over the own enumerable properties.
*
* @param {Object} obj
* @return {Object} New object with only the own properties (recursively).
*/
objectValues = function( obj ) {
// Grunt 0.3.x uses an older version of jshint that still has jshint/jshint#392.
/*jshint newcap: false */
var key, val,
vals = QUnit.is( "array", obj ) ? [] : {};
for ( key in obj ) {
if ( hasOwn.call( obj, key ) ) {
val = obj[key];
vals[key] = val === Object(val) ? objectValues(val) : val;
}
}
return vals;
};
function Test( settings ) {
extend( this, settings );
this.assertions = [];
this.testNumber = ++Test.count;
}
Test.count = 0;
Test.prototype = {
init: function() {
var a, b, li,
tests = id( "qunit-tests" );
if ( tests ) {
b = document.createElement( "strong" );
b.innerHTML = this.nameHtml;
// `a` initialized at top of scope
a = document.createElement( "a" );
a.innerHTML = "Rerun";
a.href = QUnit.url({ testNumber: this.testNumber });
li = document.createElement( "li" );
li.appendChild( b );
li.appendChild( a );
li.className = "running";
li.id = this.id = "qunit-test-output" + testId++;
tests.appendChild( li );
}
},
setup: function() {
if ( this.module !== config.previousModule ) {
if ( config.previousModule ) {
runLoggingCallbacks( "moduleDone", QUnit, {
name: config.previousModule,
failed: config.moduleStats.bad,
passed: config.moduleStats.all - config.moduleStats.bad,
total: config.moduleStats.all
});
}
config.previousModule = this.module;
config.moduleStats = { all: 0, bad: 0 };
runLoggingCallbacks( "moduleStart", QUnit, {
name: this.module
});
} else if ( config.autorun ) {
runLoggingCallbacks( "moduleStart", QUnit, {
name: this.module
});
}
config.current = this;
this.testEnvironment = extend({
setup: function() {},
teardown: function() {}
}, this.moduleTestEnvironment );
this.started = +new Date();
runLoggingCallbacks( "testStart", QUnit, {
name: this.testName,
module: this.module
});
// allow utility functions to access the current test environment
// TODO why??
QUnit.current_testEnvironment = this.testEnvironment;
if ( !config.pollution ) {
saveGlobal();
}
if ( config.notrycatch ) {
this.testEnvironment.setup.call( this.testEnvironment );
return;
}
try {
this.testEnvironment.setup.call( this.testEnvironment );
} catch( e ) {
QUnit.pushFailure( "Setup failed on " + this.testName + ": " + ( e.message || e ), extractStacktrace( e, 1 ) );
}
},
run: function() {
config.current = this;
var running = id( "qunit-testresult" );
if ( running ) {
running.innerHTML = "Running: <br/>" + this.nameHtml;
}
if ( this.async ) {
QUnit.stop();
}
this.callbackStarted = +new Date();
if ( config.notrycatch ) {
this.callback.call( this.testEnvironment, QUnit.assert );
this.callbackRuntime = +new Date() - this.callbackStarted;
return;
}
try {
this.callback.call( this.testEnvironment, QUnit.assert );
this.callbackRuntime = +new Date() - this.callbackStarted;
} catch( e ) {
this.callbackRuntime = +new Date() - this.callbackStarted;
QUnit.pushFailure( "Died on test #" + (this.assertions.length + 1) + " " + this.stack + ": " + ( e.message || e ), extractStacktrace( e, 0 ) );
// else next test will carry the responsibility
saveGlobal();
// Restart the tests if they're blocking
if ( config.blocking ) {
QUnit.start();
}
}
},
teardown: function() {
config.current = this;
if ( config.notrycatch ) {
if ( typeof this.callbackRuntime === "undefined" ) {
this.callbackRuntime = +new Date() - this.callbackStarted;
}
this.testEnvironment.teardown.call( this.testEnvironment );
return;
} else {
try {
this.testEnvironment.teardown.call( this.testEnvironment );
} catch( e ) {
QUnit.pushFailure( "Teardown failed on " + this.testName + ": " + ( e.message || e ), extractStacktrace( e, 1 ) );
}
}
checkPollution();
},
finish: function() {
config.current = this;
if ( config.requireExpects && this.expected === null ) {
QUnit.pushFailure( "Expected number of assertions to be defined, but expect() was not called.", this.stack );
} else if ( this.expected !== null && this.expected !== this.assertions.length ) {
QUnit.pushFailure( "Expected " + this.expected + " assertions, but " + this.assertions.length + " were run", this.stack );
} else if ( this.expected === null && !this.assertions.length ) {
QUnit.pushFailure( "Expected at least one assertion, but none were run - call expect(0) to accept zero assertions.", this.stack );
}
var i, assertion, a, b, time, li, ol,
test = this,
good = 0,
bad = 0,
tests = id( "qunit-tests" );
this.runtime = +new Date() - this.started;
config.stats.all += this.assertions.length;
config.moduleStats.all += this.assertions.length;
if ( tests ) {
ol = document.createElement( "ol" );
ol.className = "qunit-assert-list";
for ( i = 0; i < this.assertions.length; i++ ) {
assertion = this.assertions[i];
li = document.createElement( "li" );
li.className = assertion.result ? "pass" : "fail";
li.innerHTML = assertion.message || ( assertion.result ? "okay" : "failed" );
ol.appendChild( li );
if ( assertion.result ) {
good++;
} else {
bad++;
config.stats.bad++;
config.moduleStats.bad++;
}
}
// store result when possible
if ( QUnit.config.reorder && defined.sessionStorage ) {
if ( bad ) {
sessionStorage.setItem( "qunit-test-" + this.module + "-" + this.testName, bad );
} else {
sessionStorage.removeItem( "qunit-test-" + this.module + "-" + this.testName );
}
}
if ( bad === 0 ) {
addClass( ol, "qunit-collapsed" );
}
// `b` initialized at top of scope
b = document.createElement( "strong" );
b.innerHTML = this.nameHtml + " <b class='counts'>(<b class='failed'>" + bad + "</b>, <b class='passed'>" + good + "</b>, " + this.assertions.length + ")</b>";
addEvent(b, "click", function() {
var next = b.parentNode.lastChild,
collapsed = hasClass( next, "qunit-collapsed" );
( collapsed ? removeClass : addClass )( next, "qunit-collapsed" );
});
addEvent(b, "dblclick", function( e ) {
var target = e && e.target ? e.target : window.event.srcElement;
if ( target.nodeName.toLowerCase() === "span" || target.nodeName.toLowerCase() === "b" ) {
target = target.parentNode;
}
if ( window.location && target.nodeName.toLowerCase() === "strong" ) {
window.location = QUnit.url({ testNumber: test.testNumber });
}
});
// `time` initialized at top of scope
time = document.createElement( "span" );
time.className = "runtime";
time.innerHTML = this.runtime + " ms";
// `li` initialized at top of scope
li = id( this.id );
li.className = bad ? "fail" : "pass";
li.removeChild( li.firstChild );
a = li.firstChild;
li.appendChild( b );
li.appendChild( a );
li.appendChild( time );
li.appendChild( ol );
} else {
for ( i = 0; i < this.assertions.length; i++ ) {
if ( !this.assertions[i].result ) {
bad++;
config.stats.bad++;
config.moduleStats.bad++;
}
}
}
runLoggingCallbacks( "testDone", QUnit, {
name: this.testName,
module: this.module,
failed: bad,
passed: this.assertions.length - bad,
total: this.assertions.length,
duration: this.runtime
});
QUnit.reset();
config.current = undefined;
},
queue: function() {
var bad,
test = this;
synchronize(function() {
test.init();
});
function run() {
// each of these can by async
synchronize(function() {
test.setup();
});
synchronize(function() {
test.run();
});
synchronize(function() {
test.teardown();
});
synchronize(function() {
test.finish();
});
}
// `bad` initialized at top of scope
// defer when previous test run passed, if storage is available
bad = QUnit.config.reorder && defined.sessionStorage &&
+sessionStorage.getItem( "qunit-test-" + this.module + "-" + this.testName );
if ( bad ) {
run();
} else {
synchronize( run, true );
}
}
};
// Root QUnit object.
// `QUnit` initialized at top of scope
QUnit = {
// call on start of module test to prepend name to all tests
module: function( name, testEnvironment ) {
config.currentModule = name;
config.currentModuleTestEnvironment = testEnvironment;
config.modules[name] = true;
},
asyncTest: function( testName, expected, callback ) {
if ( arguments.length === 2 ) {
callback = expected;
expected = null;
}
QUnit.test( testName, expected, callback, true );
},
test: function( testName, expected, callback, async ) {
var test,
nameHtml = "<span class='test-name'>" + escapeText( testName ) + "</span>";
if ( arguments.length === 2 ) {
callback = expected;
expected = null;
}
if ( config.currentModule ) {
nameHtml = "<span class='module-name'>" + escapeText( config.currentModule ) + "</span>: " + nameHtml;
}
test = new Test({
nameHtml: nameHtml,
testName: testName,
expected: expected,
async: async,
callback: callback,
module: config.currentModule,
moduleTestEnvironment: config.currentModuleTestEnvironment,
stack: sourceFromStacktrace( 2 )
});
if ( !validTest( test ) ) {
return;
}
test.queue();
},
// Specify the number of expected assertions to gurantee that failed test (no assertions are run at all) don't slip through.
expect: function( asserts ) {
if (arguments.length === 1) {
config.current.expected = asserts;
} else {
return config.current.expected;
}
},
start: function( count ) {
// QUnit hasn't been initialized yet.
// Note: RequireJS (et al) may delay onLoad
if ( config.semaphore === undefined ) {
QUnit.begin(function() {
// This is triggered at the top of QUnit.load, push start() to the event loop, to allow QUnit.load to finish first
setTimeout(function() {
QUnit.start( count );
});
});
return;
}
config.semaphore -= count || 1;
// don't start until equal number of stop-calls
if ( config.semaphore > 0 ) {
return;
}
// ignore if start is called more often then stop
if ( config.semaphore < 0 ) {
config.semaphore = 0;
QUnit.pushFailure( "Called start() while already started (QUnit.config.semaphore was 0 already)", null, sourceFromStacktrace(2) );
return;
}
// A slight delay, to avoid any current callbacks
if ( defined.setTimeout ) {
window.setTimeout(function() {
if ( config.semaphore > 0 ) {
return;
}
if ( config.timeout ) {
clearTimeout( config.timeout );
}
config.blocking = false;
process( true );
}, 13);
} else {
config.blocking = false;
process( true );
}
},
stop: function( count ) {
config.semaphore += count || 1;
config.blocking = true;
if ( config.testTimeout && defined.setTimeout ) {
clearTimeout( config.timeout );
config.timeout = window.setTimeout(function() {
QUnit.ok( false, "Test timed out" );
config.semaphore = 1;
QUnit.start();
}, config.testTimeout );
}
}
};
// `assert` initialized at top of scope
// Asssert helpers
// All of these must either call QUnit.push() or manually do:
// - runLoggingCallbacks( "log", .. );
// - config.current.assertions.push({ .. });
// We attach it to the QUnit object *after* we expose the public API,
// otherwise `assert` will become a global variable in browsers (#341).
assert = {
/**
* Asserts rough true-ish result.
* @name ok
* @function
* @example ok( "asdfasdf".length > 5, "There must be at least 5 chars" );
*/
ok: function( result, msg ) {
if ( !config.current ) {
throw new Error( "ok() assertion outside test context, was " + sourceFromStacktrace(2) );
}
result = !!result;
var source,
details = {
module: config.current.module,
name: config.current.testName,
result: result,
message: msg
};
msg = escapeText( msg || (result ? "okay" : "failed" ) );
msg = "<span class='test-message'>" + msg + "</span>";
if ( !result ) {
source = sourceFromStacktrace( 2 );
if ( source ) {
details.source = source;
msg += "<table><tr class='test-source'><th>Source: </th><td><pre>" + escapeText( source ) + "</pre></td></tr></table>";
}
}
runLoggingCallbacks( "log", QUnit, details );
config.current.assertions.push({
result: result,
message: msg
});
},
/**
* Assert that the first two arguments are equal, with an optional message.
* Prints out both actual and expected values.
* @name equal
* @function
* @example equal( format( "Received {0} bytes.", 2), "Received 2 bytes.", "format() replaces {0} with next argument" );
*/
equal: function( actual, expected, message ) {
/*jshint eqeqeq:false */
QUnit.push( expected == actual, actual, expected, message );
},
/**
* @name notEqual
* @function
*/
notEqual: function( actual, expected, message ) {
/*jshint eqeqeq:false */
QUnit.push( expected != actual, actual, expected, message );
},
/**
* @name propEqual
* @function
*/
propEqual: function( actual, expected, message ) {
actual = objectValues(actual);
expected = objectValues(expected);
QUnit.push( QUnit.equiv(actual, expected), actual, expected, message );
},
/**
* @name notPropEqual
* @function
*/
notPropEqual: function( actual, expected, message ) {
actual = objectValues(actual);
expected = objectValues(expected);
QUnit.push( !QUnit.equiv(actual, expected), actual, expected, message );
},
/**
* @name deepEqual
* @function
*/
deepEqual: function( actual, expected, message ) {
QUnit.push( QUnit.equiv(actual, expected), actual, expected, message );
},
/**
* @name notDeepEqual
* @function
*/
notDeepEqual: function( actual, expected, message ) {
QUnit.push( !QUnit.equiv(actual, expected), actual, expected, message );
},
/**
* @name strictEqual
* @function
*/
strictEqual: function( actual, expected, message ) {
QUnit.push( expected === actual, actual, expected, message );
},
/**
* @name notStrictEqual
* @function
*/
notStrictEqual: function( actual, expected, message ) {
QUnit.push( expected !== actual, actual, expected, message );
},
"throws": function( block, expected, message ) {
var actual,
expectedOutput = expected,
ok = false;
// 'expected' is optional
if ( typeof expected === "string" ) {
message = expected;
expected = null;
}
config.current.ignoreGlobalErrors = true;
try {
block.call( config.current.testEnvironment );
} catch (e) {
actual = e;
}
config.current.ignoreGlobalErrors = false;
if ( actual ) {
// we don't want to validate thrown error
if ( !expected ) {
ok = true;
expectedOutput = null;
// expected is a regexp
} else if ( QUnit.objectType( expected ) === "regexp" ) {
ok = expected.test( errorString( actual ) );
// expected is a constructor
} else if ( actual instanceof expected ) {
ok = true;
// expected is a validation function which returns true is validation passed
} else if ( expected.call( {}, actual ) === true ) {
expectedOutput = null;
ok = true;
}
QUnit.push( ok, actual, expectedOutput, message );
} else {
QUnit.pushFailure( message, null, 'No exception was thrown.' );
}
}
};
/**
* @deprecate since 1.8.0
* Kept assertion helpers in root for backwards compatibility.
*/
extend( QUnit, assert );
/**
* @deprecated since 1.9.0
* Kept root "raises()" for backwards compatibility.
* (Note that we don't introduce assert.raises).
*/
QUnit.raises = assert[ "throws" ];
/**
* @deprecated since 1.0.0, replaced with error pushes since 1.3.0
* Kept to avoid TypeErrors for undefined methods.
*/
QUnit.equals = function() {
QUnit.push( false, false, false, "QUnit.equals has been deprecated since 2009 (e88049a0), use QUnit.equal instead" );
};
QUnit.same = function() {
QUnit.push( false, false, false, "QUnit.same has been deprecated since 2009 (e88049a0), use QUnit.deepEqual instead" );
};
// We want access to the constructor's prototype
(function() {
function F() {}
F.prototype = QUnit;
QUnit = new F();
// Make F QUnit's constructor so that we can add to the prototype later
QUnit.constructor = F;
}());
/**
* Config object: Maintain internal state
* Later exposed as QUnit.config
* `config` initialized at top of scope
*/
config = {
// The queue of tests to run
queue: [],
// block until document ready
blocking: true,
// when enabled, show only failing tests
// gets persisted through sessionStorage and can be changed in UI via checkbox
hidepassed: false,
// by default, run previously failed tests first
// very useful in combination with "Hide passed tests" checked
reorder: true,
// by default, modify document.title when suite is done
altertitle: true,
// when enabled, all tests must call expect()
requireExpects: false,
// add checkboxes that are persisted in the query-string
// when enabled, the id is set to `true` as a `QUnit.config` property
urlConfig: [
{
id: "noglobals",
label: "Check for Globals",
tooltip: "Enabling this will test if any test introduces new properties on the `window` object. Stored as query-strings."
},
{
id: "notrycatch",
label: "No try-catch",
tooltip: "Enabling this will run tests outside of a try-catch block. Makes debugging exceptions in IE reasonable. Stored as query-strings."
}
],
// Set of all modules.
modules: {},
// logging callback queues
begin: [],
done: [],
log: [],
testStart: [],
testDone: [],
moduleStart: [],
moduleDone: []
};
// Export global variables, unless an 'exports' object exists,
// in that case we assume we're in CommonJS (dealt with on the bottom of the script)
if ( typeof exports === "undefined" ) {
extend( window, QUnit );
// Expose QUnit object
window.QUnit = QUnit;
}
// Initialize more QUnit.config and QUnit.urlParams
(function() {
var i,
location = window.location || { search: "", protocol: "file:" },
params = location.search.slice( 1 ).split( "&" ),
length = params.length,
urlParams = {},
current;
if ( params[ 0 ] ) {
for ( i = 0; i < length; i++ ) {
current = params[ i ].split( "=" );
current[ 0 ] = decodeURIComponent( current[ 0 ] );
// allow just a key to turn on a flag, e.g., test.html?noglobals
current[ 1 ] = current[ 1 ] ? decodeURIComponent( current[ 1 ] ) : true;
urlParams[ current[ 0 ] ] = current[ 1 ];
}
}
QUnit.urlParams = urlParams;
// String search anywhere in moduleName+testName
config.filter = urlParams.filter;
// Exact match of the module name
config.module = urlParams.module;
config.testNumber = parseInt( urlParams.testNumber, 10 ) || null;
// Figure out if we're running the tests from a server or not
QUnit.isLocal = location.protocol === "file:";
}());
// Extend QUnit object,
// these after set here because they should not be exposed as global functions
extend( QUnit, {
assert: assert,
config: config,
// Initialize the configuration options
init: function() {
extend( config, {
stats: { all: 0, bad: 0 },
moduleStats: { all: 0, bad: 0 },
started: +new Date(),
updateRate: 1000,
blocking: false,
autostart: true,
autorun: false,
filter: "",
queue: [],
semaphore: 1
});
var tests, banner, result,
qunit = id( "qunit" );
if ( qunit ) {
qunit.innerHTML =
"<h1 id='qunit-header'>" + escapeText( document.title ) + "</h1>" +
"<h2 id='qunit-banner'></h2>" +
"<div id='qunit-testrunner-toolbar'></div>" +
"<h2 id='qunit-userAgent'></h2>" +
"<ol id='qunit-tests'></ol>";
}
tests = id( "qunit-tests" );
banner = id( "qunit-banner" );
result = id( "qunit-testresult" );
if ( tests ) {
tests.innerHTML = "";
}
if ( banner ) {
banner.className = "";
}
if ( result ) {
result.parentNode.removeChild( result );
}
if ( tests ) {
result = document.createElement( "p" );
result.id = "qunit-testresult";
result.className = "result";
tests.parentNode.insertBefore( result, tests );
result.innerHTML = "Running...<br/> ";
}
},
// Resets the test setup. Useful for tests that modify the DOM.
reset: function() {
var fixture = id( "qunit-fixture" );
if ( fixture ) {
fixture.innerHTML = config.fixture;
}
},
// Trigger an event on an element.
// @example triggerEvent( document.body, "click" );
triggerEvent: function( elem, type, event ) {
if ( document.createEvent ) {
event = document.createEvent( "MouseEvents" );
event.initMouseEvent(type, true, true, elem.ownerDocument.defaultView,
0, 0, 0, 0, 0, false, false, false, false, 0, null);
elem.dispatchEvent( event );
} else if ( elem.fireEvent ) {
elem.fireEvent( "on" + type );
}
},
// Safe object type checking
is: function( type, obj ) {
return QUnit.objectType( obj ) === type;
},
objectType: function( obj ) {
if ( typeof obj === "undefined" ) {
return "undefined";
// consider: typeof null === object
}
if ( obj === null ) {
return "null";
}
var match = toString.call( obj ).match(/^\[object\s(.*)\]$/),
type = match && match[1] || "";
switch ( type ) {
case "Number":
if ( isNaN(obj) ) {
return "nan";
}
return "number";
case "String":
case "Boolean":
case "Array":
case "Date":
case "RegExp":
case "Function":
return type.toLowerCase();
}
if ( typeof obj === "object" ) {
return "object";
}
return undefined;
},
push: function( result, actual, expected, message ) {
if ( !config.current ) {
throw new Error( "assertion outside test context, was " + sourceFromStacktrace() );
}
var output, source,
details = {
module: config.current.module,
name: config.current.testName,
result: result,
message: message,
actual: actual,
expected: expected
};
message = escapeText( message ) || ( result ? "okay" : "failed" );
message = "<span class='test-message'>" + message + "</span>";
output = message;
if ( !result ) {
expected = escapeText( QUnit.jsDump.parse(expected) );
actual = escapeText( QUnit.jsDump.parse(actual) );
output += "<table><tr class='test-expected'><th>Expected: </th><td><pre>" + expected + "</pre></td></tr>";
if ( actual !== expected ) {
output += "<tr class='test-actual'><th>Result: </th><td><pre>" + actual + "</pre></td></tr>";
output += "<tr class='test-diff'><th>Diff: </th><td><pre>" + QUnit.diff( expected, actual ) + "</pre></td></tr>";
}
source = sourceFromStacktrace();
if ( source ) {
details.source = source;
output += "<tr class='test-source'><th>Source: </th><td><pre>" + escapeText( source ) + "</pre></td></tr>";
}
output += "</table>";
}
runLoggingCallbacks( "log", QUnit, details );
config.current.assertions.push({
result: !!result,
message: output
});
},
pushFailure: function( message, source, actual ) {
if ( !config.current ) {
throw new Error( "pushFailure() assertion outside test context, was " + sourceFromStacktrace(2) );
}
var output,
details = {
module: config.current.module,
name: config.current.testName,
result: false,
message: message
};
message = escapeText( message ) || "error";
message = "<span class='test-message'>" + message + "</span>";
output = message;
output += "<table>";
if ( actual ) {
output += "<tr class='test-actual'><th>Result: </th><td><pre>" + escapeText( actual ) + "</pre></td></tr>";
}
if ( source ) {
details.source = source;
output += "<tr class='test-source'><th>Source: </th><td><pre>" + escapeText( source ) + "</pre></td></tr>";
}
output += "</table>";
runLoggingCallbacks( "log", QUnit, details );
config.current.assertions.push({
result: false,
message: output
});
},
url: function( params ) {
params = extend( extend( {}, QUnit.urlParams ), params );
var key,
querystring = "?";
for ( key in params ) {
if ( !hasOwn.call( params, key ) ) {
continue;
}
querystring += encodeURIComponent( key ) + "=" +
encodeURIComponent( params[ key ] ) + "&";
}
return window.location.protocol + "//" + window.location.host +
window.location.pathname + querystring.slice( 0, -1 );
},
extend: extend,
id: id,
addEvent: addEvent
// load, equiv, jsDump, diff: Attached later
});
/**
* @deprecated: Created for backwards compatibility with test runner that set the hook function
* into QUnit.{hook}, instead of invoking it and passing the hook function.
* QUnit.constructor is set to the empty F() above so that we can add to it's prototype here.
* Doing this allows us to tell if the following methods have been overwritten on the actual
* QUnit object.
*/
extend( QUnit.constructor.prototype, {
// Logging callbacks; all receive a single argument with the listed properties
// run test/logs.html for any related changes
begin: registerLoggingCallback( "begin" ),
// done: { failed, passed, total, runtime }
done: registerLoggingCallback( "done" ),
// log: { result, actual, expected, message }
log: registerLoggingCallback( "log" ),
// testStart: { name }
testStart: registerLoggingCallback( "testStart" ),
// testDone: { name, failed, passed, total, duration }
testDone: registerLoggingCallback( "testDone" ),
// moduleStart: { name }
moduleStart: registerLoggingCallback( "moduleStart" ),
// moduleDone: { name, failed, passed, total }
moduleDone: registerLoggingCallback( "moduleDone" )
});
if ( typeof document === "undefined" || document.readyState === "complete" ) {
config.autorun = true;
}
QUnit.load = function() {
runLoggingCallbacks( "begin", QUnit, {} );
// Initialize the config, saving the execution queue
var banner, filter, i, label, len, main, ol, toolbar, userAgent, val,
urlConfigCheckboxesContainer, urlConfigCheckboxes, moduleFilter,
numModules = 0,
moduleFilterHtml = "",
urlConfigHtml = "",
oldconfig = extend( {}, config );
QUnit.init();
extend(config, oldconfig);
config.blocking = false;
len = config.urlConfig.length;
for ( i = 0; i < len; i++ ) {
val = config.urlConfig[i];
if ( typeof val === "string" ) {
val = {
id: val,
label: val,
tooltip: "[no tooltip available]"
};
}
config[ val.id ] = QUnit.urlParams[ val.id ];
urlConfigHtml += "<input id='qunit-urlconfig-" + escapeText( val.id ) +
"' name='" + escapeText( val.id ) +
"' type='checkbox'" + ( config[ val.id ] ? " checked='checked'" : "" ) +
" title='" + escapeText( val.tooltip ) +
"'><label for='qunit-urlconfig-" + escapeText( val.id ) +
"' title='" + escapeText( val.tooltip ) + "'>" + val.label + "</label>";
}
moduleFilterHtml += "<label for='qunit-modulefilter'>Module: </label><select id='qunit-modulefilter' name='modulefilter'><option value='' " +
( config.module === undefined ? "selected='selected'" : "" ) +
">< All Modules ></option>";
for ( i in config.modules ) {
if ( config.modules.hasOwnProperty( i ) ) {
numModules += 1;
moduleFilterHtml += "<option value='" + escapeText( encodeURIComponent(i) ) + "' " +
( config.module === i ? "selected='selected'" : "" ) +
">" + escapeText(i) + "</option>";
}
}
moduleFilterHtml += "</select>";
// `userAgent` initialized at top of scope
userAgent = id( "qunit-userAgent" );
if ( userAgent ) {
userAgent.innerHTML = navigator.userAgent;
}
// `banner` initialized at top of scope
banner = id( "qunit-header" );
if ( banner ) {
banner.innerHTML = "<a href='" + QUnit.url({ filter: undefined, module: undefined, testNumber: undefined }) + "'>" + banner.innerHTML + "</a> ";
}
// `toolbar` initialized at top of scope
toolbar = id( "qunit-testrunner-toolbar" );
if ( toolbar ) {
// `filter` initialized at top of scope
filter = document.createElement( "input" );
filter.type = "checkbox";
filter.id = "qunit-filter-pass";
addEvent( filter, "click", function() {
var tmp,
ol = document.getElementById( "qunit-tests" );
if ( filter.checked ) {
ol.className = ol.className + " hidepass";
} else {
tmp = " " + ol.className.replace( /[\n\t\r]/g, " " ) + " ";
ol.className = tmp.replace( / hidepass /, " " );
}
if ( defined.sessionStorage ) {
if (filter.checked) {
sessionStorage.setItem( "qunit-filter-passed-tests", "true" );
} else {
sessionStorage.removeItem( "qunit-filter-passed-tests" );
}
}
});
if ( config.hidepassed || defined.sessionStorage && sessionStorage.getItem( "qunit-filter-passed-tests" ) ) {
filter.checked = true;
// `ol` initialized at top of scope
ol = document.getElementById( "qunit-tests" );
ol.className = ol.className + " hidepass";
}
toolbar.appendChild( filter );
// `label` initialized at top of scope
label = document.createElement( "label" );
label.setAttribute( "for", "qunit-filter-pass" );
label.setAttribute( "title", "Only show tests and assertons that fail. Stored in sessionStorage." );
label.innerHTML = "Hide passed tests";
toolbar.appendChild( label );
urlConfigCheckboxesContainer = document.createElement("span");
urlConfigCheckboxesContainer.innerHTML = urlConfigHtml;
urlConfigCheckboxes = urlConfigCheckboxesContainer.getElementsByTagName("input");
// For oldIE support:
// * Add handlers to the individual elements instead of the container
// * Use "click" instead of "change"
// * Fallback from event.target to event.srcElement
addEvents( urlConfigCheckboxes, "click", function( event ) {
var params = {},
target = event.target || event.srcElement;
params[ target.name ] = target.checked ? true : undefined;
window.location = QUnit.url( params );
});
toolbar.appendChild( urlConfigCheckboxesContainer );
if (numModules > 1) {
moduleFilter = document.createElement( 'span' );
moduleFilter.setAttribute( 'id', 'qunit-modulefilter-container' );
moduleFilter.innerHTML = moduleFilterHtml;
addEvent( moduleFilter.lastChild, "change", function() {
var selectBox = moduleFilter.getElementsByTagName("select")[0],
selectedModule = decodeURIComponent(selectBox.options[selectBox.selectedIndex].value);
window.location = QUnit.url( { module: ( selectedModule === "" ) ? undefined : selectedModule } );
});
toolbar.appendChild(moduleFilter);
}
}
// `main` initialized at top of scope
main = id( "qunit-fixture" );
if ( main ) {
config.fixture = main.innerHTML;
}
if ( config.autostart ) {
QUnit.start();
}
};
addEvent( window, "load", QUnit.load );
// `onErrorFnPrev` initialized at top of scope
// Preserve other handlers
onErrorFnPrev = window.onerror;
// Cover uncaught exceptions
// Returning true will surpress the default browser handler,
// returning false will let it run.
window.onerror = function ( error, filePath, linerNr ) {
var ret = false;
if ( onErrorFnPrev ) {
ret = onErrorFnPrev( error, filePath, linerNr );
}
// Treat return value as window.onerror itself does,
// Only do our handling if not surpressed.
if ( ret !== true ) {
if ( QUnit.config.current ) {
if ( QUnit.config.current.ignoreGlobalErrors ) {
return true;
}
QUnit.pushFailure( error, filePath + ":" + linerNr );
} else {
QUnit.test( "global failure", extend( function() {
QUnit.pushFailure( error, filePath + ":" + linerNr );
}, { validTest: validTest } ) );
}
return false;
}
return ret;
};
function done() {
config.autorun = true;
// Log the last module results
if ( config.currentModule ) {
runLoggingCallbacks( "moduleDone", QUnit, {
name: config.currentModule,
failed: config.moduleStats.bad,
passed: config.moduleStats.all - config.moduleStats.bad,
total: config.moduleStats.all
});
}
var i, key,
banner = id( "qunit-banner" ),
tests = id( "qunit-tests" ),
runtime = +new Date() - config.started,
passed = config.stats.all - config.stats.bad,
html = [
"Tests completed in ",
runtime,
" milliseconds.<br/>",
"<span class='passed'>",
passed,
"</span> assertions of <span class='total'>",
config.stats.all,
"</span> passed, <span class='failed'>",
config.stats.bad,
"</span> failed."
].join( "" );
if ( banner ) {
banner.className = ( config.stats.bad ? "qunit-fail" : "qunit-pass" );
}
if ( tests ) {
id( "qunit-testresult" ).innerHTML = html;
}
if ( config.altertitle && typeof document !== "undefined" && document.title ) {
// show ✖ for good, ✔ for bad suite result in title
// use escape sequences in case file gets loaded with non-utf-8-charset
document.title = [
( config.stats.bad ? "\u2716" : "\u2714" ),
document.title.replace( /^[\u2714\u2716] /i, "" )
].join( " " );
}
// clear own sessionStorage items if all tests passed
if ( config.reorder && defined.sessionStorage && config.stats.bad === 0 ) {
// `key` & `i` initialized at top of scope
for ( i = 0; i < sessionStorage.length; i++ ) {
key = sessionStorage.key( i++ );
if ( key.indexOf( "qunit-test-" ) === 0 ) {
sessionStorage.removeItem( key );
}
}
}
// scroll back to top to show results
if ( window.scrollTo ) {
window.scrollTo(0, 0);
}
runLoggingCallbacks( "done", QUnit, {
failed: config.stats.bad,
passed: passed,
total: config.stats.all,
runtime: runtime
});
}
/** @return Boolean: true if this test should be ran */
function validTest( test ) {
var include,
filter = config.filter && config.filter.toLowerCase(),
module = config.module && config.module.toLowerCase(),
fullName = (test.module + ": " + test.testName).toLowerCase();
// Internally-generated tests are always valid
if ( test.callback && test.callback.validTest === validTest ) {
delete test.callback.validTest;
return true;
}
if ( config.testNumber ) {
return test.testNumber === config.testNumber;
}
if ( module && ( !test.module || test.module.toLowerCase() !== module ) ) {
return false;
}
if ( !filter ) {
return true;
}
include = filter.charAt( 0 ) !== "!";
if ( !include ) {
filter = filter.slice( 1 );
}
// If the filter matches, we need to honour include
if ( fullName.indexOf( filter ) !== -1 ) {
return include;
}
// Otherwise, do the opposite
return !include;
}
// so far supports only Firefox, Chrome and Opera (buggy), Safari (for real exceptions)
// Later Safari and IE10 are supposed to support error.stack as well
// See also https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Error/Stack
function extractStacktrace( e, offset ) {
offset = offset === undefined ? 3 : offset;
var stack, include, i;
if ( e.stacktrace ) {
// Opera
return e.stacktrace.split( "\n" )[ offset + 3 ];
} else if ( e.stack ) {
// Firefox, Chrome
stack = e.stack.split( "\n" );
if (/^error$/i.test( stack[0] ) ) {
stack.shift();
}
if ( fileName ) {
include = [];
for ( i = offset; i < stack.length; i++ ) {
if ( stack[ i ].indexOf( fileName ) !== -1 ) {
break;
}
include.push( stack[ i ] );
}
if ( include.length ) {
return include.join( "\n" );
}
}
return stack[ offset ];
} else if ( e.sourceURL ) {
// Safari, PhantomJS
// hopefully one day Safari provides actual stacktraces
// exclude useless self-reference for generated Error objects
if ( /qunit.js$/.test( e.sourceURL ) ) {
return;
}
// for actual exceptions, this is useful
return e.sourceURL + ":" + e.line;
}
}
function sourceFromStacktrace( offset ) {
try {
throw new Error();
} catch ( e ) {
return extractStacktrace( e, offset );
}
}
/**
* Escape text for attribute or text content.
*/
function escapeText( s ) {
if ( !s ) {
return "";
}
s = s + "";
// Both single quotes and double quotes (for attributes)
return s.replace( /['"<>&]/g, function( s ) {
switch( s ) {
case '\'':
return ''';
case '"':
return '"';
case '<':
return '<';
case '>':
return '>';
case '&':
return '&';
}
});
}
function synchronize( callback, last ) {
config.queue.push( callback );
if ( config.autorun && !config.blocking ) {
process( last );
}
}
function process( last ) {
function next() {
process( last );
}
var start = new Date().getTime();
config.depth = config.depth ? config.depth + 1 : 1;
while ( config.queue.length && !config.blocking ) {
if ( !defined.setTimeout || config.updateRate <= 0 || ( ( new Date().getTime() - start ) < config.updateRate ) ) {
config.queue.shift()();
} else {
window.setTimeout( next, 13 );
break;
}
}
config.depth--;
if ( last && !config.blocking && !config.queue.length && config.depth === 0 ) {
done();
}
}
function saveGlobal() {
config.pollution = [];
if ( config.noglobals ) {
for ( var key in window ) {
// in Opera sometimes DOM element ids show up here, ignore them
if ( !hasOwn.call( window, key ) || /^qunit-test-output/.test( key ) ) {
continue;
}
config.pollution.push( key );
}
}
}
function checkPollution() {
var newGlobals,
deletedGlobals,
old = config.pollution;
saveGlobal();
newGlobals = diff( config.pollution, old );
if ( newGlobals.length > 0 ) {
QUnit.pushFailure( "Introduced global variable(s): " + newGlobals.join(", ") );
}
deletedGlobals = diff( old, config.pollution );
if ( deletedGlobals.length > 0 ) {
QUnit.pushFailure( "Deleted global variable(s): " + deletedGlobals.join(", ") );
}
}
// returns a new Array with the elements that are in a but not in b
function diff( a, b ) {
var i, j,
result = a.slice();
for ( i = 0; i < result.length; i++ ) {
for ( j = 0; j < b.length; j++ ) {
if ( result[i] === b[j] ) {
result.splice( i, 1 );
i--;
break;
}
}
}
return result;
}
function extend( a, b ) {
for ( var prop in b ) {
if ( b[ prop ] === undefined ) {
delete a[ prop ];
// Avoid "Member not found" error in IE8 caused by setting window.constructor
} else if ( prop !== "constructor" || a !== window ) {
a[ prop ] = b[ prop ];
}
}
return a;
}
/**
* @param {HTMLElement} elem
* @param {string} type
* @param {Function} fn
*/
function addEvent( elem, type, fn ) {
// Standards-based browsers
if ( elem.addEventListener ) {
elem.addEventListener( type, fn, false );
// IE
} else {
elem.attachEvent( "on" + type, fn );
}
}
/**
* @param {Array|NodeList} elems
* @param {string} type
* @param {Function} fn
*/
function addEvents( elems, type, fn ) {
var i = elems.length;
while ( i-- ) {
addEvent( elems[i], type, fn );
}
}
function hasClass( elem, name ) {
return (" " + elem.className + " ").indexOf(" " + name + " ") > -1;
}
function addClass( elem, name ) {
if ( !hasClass( elem, name ) ) {
elem.className += (elem.className ? " " : "") + name;
}
}
function removeClass( elem, name ) {
var set = " " + elem.className + " ";
// Class name may appear multiple times
while ( set.indexOf(" " + name + " ") > -1 ) {
set = set.replace(" " + name + " " , " ");
}
// If possible, trim it for prettiness, but not neccecarily
elem.className = window.jQuery ? jQuery.trim( set ) : ( set.trim ? set.trim() : set );
}
function id( name ) {
return !!( typeof document !== "undefined" && document && document.getElementById ) &&
document.getElementById( name );
}
function registerLoggingCallback( key ) {
return function( callback ) {
config[key].push( callback );
};
}
// Supports deprecated method of completely overwriting logging callbacks
function runLoggingCallbacks( key, scope, args ) {
var i, callbacks;
if ( QUnit.hasOwnProperty( key ) ) {
QUnit[ key ].call(scope, args );
} else {
callbacks = config[ key ];
for ( i = 0; i < callbacks.length; i++ ) {
callbacks[ i ].call( scope, args );
}
}
}
// Test for equality any JavaScript type.
// Author: Philippe Rathé <prathe@gmail.com>
QUnit.equiv = (function() {
// Call the o related callback with the given arguments.
function bindCallbacks( o, callbacks, args ) {
var prop = QUnit.objectType( o );
if ( prop ) {
if ( QUnit.objectType( callbacks[ prop ] ) === "function" ) {
return callbacks[ prop ].apply( callbacks, args );
} else {
return callbacks[ prop ]; // or undefined
}
}
}
// the real equiv function
var innerEquiv,
// stack to decide between skip/abort functions
callers = [],
// stack to avoiding loops from circular referencing
parents = [],
getProto = Object.getPrototypeOf || function ( obj ) {
return obj.__proto__;
},
callbacks = (function () {
// for string, boolean, number and null
function useStrictEquality( b, a ) {
/*jshint eqeqeq:false */
if ( b instanceof a.constructor || a instanceof b.constructor ) {
// to catch short annotaion VS 'new' annotation of a
// declaration
// e.g. var i = 1;
// var j = new Number(1);
return a == b;
} else {
return a === b;
}
}
return {
"string": useStrictEquality,
"boolean": useStrictEquality,
"number": useStrictEquality,
"null": useStrictEquality,
"undefined": useStrictEquality,
"nan": function( b ) {
return isNaN( b );
},
"date": function( b, a ) {
return QUnit.objectType( b ) === "date" && a.valueOf() === b.valueOf();
},
"regexp": function( b, a ) {
return QUnit.objectType( b ) === "regexp" &&
// the regex itself
a.source === b.source &&
// and its modifers
a.global === b.global &&
// (gmi) ...
a.ignoreCase === b.ignoreCase &&
a.multiline === b.multiline &&
a.sticky === b.sticky;
},
// - skip when the property is a method of an instance (OOP)
// - abort otherwise,
// initial === would have catch identical references anyway
"function": function() {
var caller = callers[callers.length - 1];
return caller !== Object && typeof caller !== "undefined";
},
"array": function( b, a ) {
var i, j, len, loop;
// b could be an object literal here
if ( QUnit.objectType( b ) !== "array" ) {
return false;
}
len = a.length;
if ( len !== b.length ) {
// safe and faster
return false;
}
// track reference to avoid circular references
parents.push( a );
for ( i = 0; i < len; i++ ) {
loop = false;
for ( j = 0; j < parents.length; j++ ) {
if ( parents[j] === a[i] ) {
loop = true;// dont rewalk array
}
}
if ( !loop && !innerEquiv(a[i], b[i]) ) {
parents.pop();
return false;
}
}
parents.pop();
return true;
},
"object": function( b, a ) {
var i, j, loop,
// Default to true
eq = true,
aProperties = [],
bProperties = [];
// comparing constructors is more strict than using
// instanceof
if ( a.constructor !== b.constructor ) {
// Allow objects with no prototype to be equivalent to
// objects with Object as their constructor.
if ( !(( getProto(a) === null && getProto(b) === Object.prototype ) ||
( getProto(b) === null && getProto(a) === Object.prototype ) ) ) {
return false;
}
}
// stack constructor before traversing properties
callers.push( a.constructor );
// track reference to avoid circular references
parents.push( a );
for ( i in a ) { // be strict: don't ensures hasOwnProperty
// and go deep
loop = false;
for ( j = 0; j < parents.length; j++ ) {
if ( parents[j] === a[i] ) {
// don't go down the same path twice
loop = true;
}
}
aProperties.push(i); // collect a's properties
if (!loop && !innerEquiv( a[i], b[i] ) ) {
eq = false;
break;
}
}
callers.pop(); // unstack, we are done
parents.pop();
for ( i in b ) {
bProperties.push( i ); // collect b's properties
}
// Ensures identical properties name
return eq && innerEquiv( aProperties.sort(), bProperties.sort() );
}
};
}());
innerEquiv = function() { // can take multiple arguments
var args = [].slice.apply( arguments );
if ( args.length < 2 ) {
return true; // end transition
}
return (function( a, b ) {
if ( a === b ) {
return true; // catch the most you can
} else if ( a === null || b === null || typeof a === "undefined" ||
typeof b === "undefined" ||
QUnit.objectType(a) !== QUnit.objectType(b) ) {
return false; // don't lose time with error prone cases
} else {
return bindCallbacks(a, callbacks, [ b, a ]);
}
// apply transition with (1..n) arguments
}( args[0], args[1] ) && arguments.callee.apply( this, args.splice(1, args.length - 1 )) );
};
return innerEquiv;
}());
/**
* jsDump Copyright (c) 2008 Ariel Flesler - aflesler(at)gmail(dot)com |
* http://flesler.blogspot.com Licensed under BSD
* (http://www.opensource.org/licenses/bsd-license.php) Date: 5/15/2008
*
* @projectDescription Advanced and extensible data dumping for Javascript.
* @version 1.0.0
* @author Ariel Flesler
* @link {http://flesler.blogspot.com/2008/05/jsdump-pretty-dump-of-any-javascript.html}
*/
QUnit.jsDump = (function() {
function quote( str ) {
return '"' + str.toString().replace( /"/g, '\\"' ) + '"';
}
function literal( o ) {
return o + "";
}
function join( pre, arr, post ) {
var s = jsDump.separator(),
base = jsDump.indent(),
inner = jsDump.indent(1);
if ( arr.join ) {
arr = arr.join( "," + s + inner );
}
if ( !arr ) {
return pre + post;
}
return [ pre, inner + arr, base + post ].join(s);
}
function array( arr, stack ) {
var i = arr.length, ret = new Array(i);
this.up();
while ( i-- ) {
ret[i] = this.parse( arr[i] , undefined , stack);
}
this.down();
return join( "[", ret, "]" );
}
var reName = /^function (\w+)/,
jsDump = {
// type is used mostly internally, you can fix a (custom)type in advance
parse: function( obj, type, stack ) {
stack = stack || [ ];
var inStack, res,
parser = this.parsers[ type || this.typeOf(obj) ];
type = typeof parser;
inStack = inArray( obj, stack );
if ( inStack !== -1 ) {
return "recursion(" + (inStack - stack.length) + ")";
}
if ( type === "function" ) {
stack.push( obj );
res = parser.call( this, obj, stack );
stack.pop();
return res;
}
return ( type === "string" ) ? parser : this.parsers.error;
},
typeOf: function( obj ) {
var type;
if ( obj === null ) {
type = "null";
} else if ( typeof obj === "undefined" ) {
type = "undefined";
} else if ( QUnit.is( "regexp", obj) ) {
type = "regexp";
} else if ( QUnit.is( "date", obj) ) {
type = "date";
} else if ( QUnit.is( "function", obj) ) {
type = "function";
} else if ( typeof obj.setInterval !== undefined && typeof obj.document !== "undefined" && typeof obj.nodeType === "undefined" ) {
type = "window";
} else if ( obj.nodeType === 9 ) {
type = "document";
} else if ( obj.nodeType ) {
type = "node";
} else if (
// native arrays
toString.call( obj ) === "[object Array]" ||
// NodeList objects
( typeof obj.length === "number" && typeof obj.item !== "undefined" && ( obj.length ? obj.item(0) === obj[0] : ( obj.item( 0 ) === null && typeof obj[0] === "undefined" ) ) )
) {
type = "array";
} else if ( obj.constructor === Error.prototype.constructor ) {
type = "error";
} else {
type = typeof obj;
}
return type;
},
separator: function() {
return this.multiline ? this.HTML ? "<br />" : "\n" : this.HTML ? " " : " ";
},
// extra can be a number, shortcut for increasing-calling-decreasing
indent: function( extra ) {
if ( !this.multiline ) {
return "";
}
var chr = this.indentChar;
if ( this.HTML ) {
chr = chr.replace( /\t/g, " " ).replace( / /g, " " );
}
return new Array( this._depth_ + (extra||0) ).join(chr);
},
up: function( a ) {
this._depth_ += a || 1;
},
down: function( a ) {
this._depth_ -= a || 1;
},
setParser: function( name, parser ) {
this.parsers[name] = parser;
},
// The next 3 are exposed so you can use them
quote: quote,
literal: literal,
join: join,
//
_depth_: 1,
// This is the list of parsers, to modify them, use jsDump.setParser
parsers: {
window: "[Window]",
document: "[Document]",
error: function(error) {
return "Error(\"" + error.message + "\")";
},
unknown: "[Unknown]",
"null": "null",
"undefined": "undefined",
"function": function( fn ) {
var ret = "function",
// functions never have name in IE
name = "name" in fn ? fn.name : (reName.exec(fn) || [])[1];
if ( name ) {
ret += " " + name;
}
ret += "( ";
ret = [ ret, QUnit.jsDump.parse( fn, "functionArgs" ), "){" ].join( "" );
return join( ret, QUnit.jsDump.parse(fn,"functionCode" ), "}" );
},
array: array,
nodelist: array,
"arguments": array,
object: function( map, stack ) {
var ret = [ ], keys, key, val, i;
QUnit.jsDump.up();
keys = [];
for ( key in map ) {
keys.push( key );
}
keys.sort();
for ( i = 0; i < keys.length; i++ ) {
key = keys[ i ];
val = map[ key ];
ret.push( QUnit.jsDump.parse( key, "key" ) + ": " + QUnit.jsDump.parse( val, undefined, stack ) );
}
QUnit.jsDump.down();
return join( "{", ret, "}" );
},
node: function( node ) {
var len, i, val,
open = QUnit.jsDump.HTML ? "<" : "<",
close = QUnit.jsDump.HTML ? ">" : ">",
tag = node.nodeName.toLowerCase(),
ret = open + tag,
attrs = node.attributes;
if ( attrs ) {
for ( i = 0, len = attrs.length; i < len; i++ ) {
val = attrs[i].nodeValue;
// IE6 includes all attributes in .attributes, even ones not explicitly set.
// Those have values like undefined, null, 0, false, "" or "inherit".
if ( val && val !== "inherit" ) {
ret += " " + attrs[i].nodeName + "=" + QUnit.jsDump.parse( val, "attribute" );
}
}
}
ret += close;
// Show content of TextNode or CDATASection
if ( node.nodeType === 3 || node.nodeType === 4 ) {
ret += node.nodeValue;
}
return ret + open + "/" + tag + close;
},
// function calls it internally, it's the arguments part of the function
functionArgs: function( fn ) {
var args,
l = fn.length;
if ( !l ) {
return "";
}
args = new Array(l);
while ( l-- ) {
// 97 is 'a'
args[l] = String.fromCharCode(97+l);
}
return " " + args.join( ", " ) + " ";
},
// object calls it internally, the key part of an item in a map
key: quote,
// function calls it internally, it's the content of the function
functionCode: "[code]",
// node calls it internally, it's an html attribute value
attribute: quote,
string: quote,
date: quote,
regexp: literal,
number: literal,
"boolean": literal
},
// if true, entities are escaped ( <, >, \t, space and \n )
HTML: false,
// indentation unit
indentChar: " ",
// if true, items in a collection, are separated by a \n, else just a space.
multiline: true
};
return jsDump;
}());
// from jquery.js
function inArray( elem, array ) {
if ( array.indexOf ) {
return array.indexOf( elem );
}
for ( var i = 0, length = array.length; i < length; i++ ) {
if ( array[ i ] === elem ) {
return i;
}
}
return -1;
}
/*
* Javascript Diff Algorithm
* By John Resig (http://ejohn.org/)
* Modified by Chu Alan "sprite"
*
* Released under the MIT license.
*
* More Info:
* http://ejohn.org/projects/javascript-diff-algorithm/
*
* Usage: QUnit.diff(expected, actual)
*
* QUnit.diff( "the quick brown fox jumped over", "the quick fox jumps over" ) == "the quick <del>brown </del> fox <del>jumped </del><ins>jumps </ins> over"
*/
QUnit.diff = (function() {
/*jshint eqeqeq:false, eqnull:true */
function diff( o, n ) {
var i,
ns = {},
os = {};
for ( i = 0; i < n.length; i++ ) {
if ( !hasOwn.call( ns, n[i] ) ) {
ns[ n[i] ] = {
rows: [],
o: null
};
}
ns[ n[i] ].rows.push( i );
}
for ( i = 0; i < o.length; i++ ) {
if ( !hasOwn.call( os, o[i] ) ) {
os[ o[i] ] = {
rows: [],
n: null
};
}
os[ o[i] ].rows.push( i );
}
for ( i in ns ) {
if ( !hasOwn.call( ns, i ) ) {
continue;
}
if ( ns[i].rows.length === 1 && hasOwn.call( os, i ) && os[i].rows.length === 1 ) {
n[ ns[i].rows[0] ] = {
text: n[ ns[i].rows[0] ],
row: os[i].rows[0]
};
o[ os[i].rows[0] ] = {
text: o[ os[i].rows[0] ],
row: ns[i].rows[0]
};
}
}
for ( i = 0; i < n.length - 1; i++ ) {
if ( n[i].text != null && n[ i + 1 ].text == null && n[i].row + 1 < o.length && o[ n[i].row + 1 ].text == null &&
n[ i + 1 ] == o[ n[i].row + 1 ] ) {
n[ i + 1 ] = {
text: n[ i + 1 ],
row: n[i].row + 1
};
o[ n[i].row + 1 ] = {
text: o[ n[i].row + 1 ],
row: i + 1
};
}
}
for ( i = n.length - 1; i > 0; i-- ) {
if ( n[i].text != null && n[ i - 1 ].text == null && n[i].row > 0 && o[ n[i].row - 1 ].text == null &&
n[ i - 1 ] == o[ n[i].row - 1 ]) {
n[ i - 1 ] = {
text: n[ i - 1 ],
row: n[i].row - 1
};
o[ n[i].row - 1 ] = {
text: o[ n[i].row - 1 ],
row: i - 1
};
}
}
return {
o: o,
n: n
};
}
return function( o, n ) {
o = o.replace( /\s+$/, "" );
n = n.replace( /\s+$/, "" );
var i, pre,
str = "",
out = diff( o === "" ? [] : o.split(/\s+/), n === "" ? [] : n.split(/\s+/) ),
oSpace = o.match(/\s+/g),
nSpace = n.match(/\s+/g);
if ( oSpace == null ) {
oSpace = [ " " ];
}
else {
oSpace.push( " " );
}
if ( nSpace == null ) {
nSpace = [ " " ];
}
else {
nSpace.push( " " );
}
if ( out.n.length === 0 ) {
for ( i = 0; i < out.o.length; i++ ) {
str += "<del>" + out.o[i] + oSpace[i] + "</del>";
}
}
else {
if ( out.n[0].text == null ) {
for ( n = 0; n < out.o.length && out.o[n].text == null; n++ ) {
str += "<del>" + out.o[n] + oSpace[n] + "</del>";
}
}
for ( i = 0; i < out.n.length; i++ ) {
if (out.n[i].text == null) {
str += "<ins>" + out.n[i] + nSpace[i] + "</ins>";
}
else {
// `pre` initialized at top of scope
pre = "";
for ( n = out.n[i].row + 1; n < out.o.length && out.o[n].text == null; n++ ) {
pre += "<del>" + out.o[n] + oSpace[n] + "</del>";
}
str += " " + out.n[i].text + nSpace[i] + pre;
}
}
}
return str;
};
}());
// for CommonJS enviroments, export everything
if ( typeof exports !== "undefined" ) {
extend( exports, QUnit );
}
// get at whatever the global object is, like window in browsers
}( (function() {return this;}.call()) ));
================================================
FILE: test/qunit/tests.js
================================================
(function(window) {
/*
======== A Handy Little QUnit Reference ========
http://api.qunitjs.com/
Test methods:
module(name, {[setup][ ,teardown]})
test(name, callback)
expect(numberOfAssertions)
stop(increment)
start(decrement)
Test assertions:
ok(value, [message])
equal(actual, expected, [message])
notEqual(actual, expected, [message])
deepEqual(actual, expected, [message])
notDeepEqual(actual, expected, [message])
strictEqual(actual, expected, [message])
notStrictEqual(actual, expected, [message])
throws(block, [expected], [message])
*/
// initial value of media attr
var initialMedia = "only x";
test( 'function loadCSS exists', function(){
expect(2);
ok( window.loadCSS, "loadCSS should exist on the window object" );
ok( typeof window.loadCSS === "function", "loadCSS should be a function" );
});
asyncTest( 'loadCSS loads a CSS file', function(){
expect(1);
var ss = loadCSS("files/test.css");
onloadCSS( ss, function(){
ok("stylesheet loaded successfully");
start();
});
});
asyncTest( 'loadCSS loads a CSS file with a relative path', function(){
expect(1);
var ss = loadCSS("../../test/qunit/files/test.css");
onloadCSS( ss, function(){
ok("stylesheet loaded successfully");
start();
});
});
asyncTest( 'loadCSS loads a CSS file with specific attributes', function(){
expect(3);
var attributes = {
title: "Default Style",
type: "text/css"
};
var ss = loadCSS("files/test.css", null, null, attributes);
onloadCSS( ss, function(){
ok("stylesheet loaded successfully");
equal(ss.title, attributes.title, "'title' attribute should be '" + attributes.title + "'");
equal(ss.type, attributes.type, "'type' attribute should be '" + attributes.type + "'");
start();
});
});
asyncTest( 'loadCSS sets media type before and after the stylesheet is loaded', function(){
expect(2);
var ss = loadCSS("files/test.css");
ok(ss.media, initialMedia, "media type begins as" + initialMedia );
onloadCSS( ss, function(){
equal(ss.media, "all", "media type is all");
start();
});
});
asyncTest( 'loadCSS sets media type to a custom value if specified, after load', function(){
expect(2);
var med = "print";
var ss = loadCSS("files/test.css", null, med);
ok(ss.media, initialMedia, "media type begins as " + initialMedia );
onloadCSS( ss, function(){
equal(ss.media, med, "media type is " + med);
start();
});
});
test( 'loadCSS injects before a particular specified element', function(){
expect(1);
var elem = window.document.getElementById("before-test");
var ss = loadCSS("files/test.css", elem);
equal(ss.nextElementSibling, elem );
});
asyncTest( 'onloadCSS callback fires after css is loaded', function(){
expect(1);
var getStyles = window.getComputedStyle ? function (node) { return window.getComputedStyle(node, null); } : function (node) { return node.currentStyle; };
var elem = window.document.createElement("div");
elem.className = "bar";
document.body.appendChild( elem );
var ss = loadCSS("files/test.css?1");
onloadCSS( ss, function(){
equal(getStyles(elem).backgroundColor, 'rgb(0, 128, 0)', 'background is green' );
start();
} );
});
}(window));
================================================
FILE: test/recommended.html
================================================
<!doctype HTML>
<html>
<head>
<title>Recommended Pattern Test</title>
<meta charset="utf-8">
<link rel="stylesheet" href="slow.css" media="print" onload="this.media='all'; this.onload=null;">
</head>
<body>
<p>This is a test file to demonstrate the recommended pattern for loading a stylesheet asynchronously.</p>
</body>
</html>
================================================
FILE: test/slow.css
================================================
/* This file was delivered after a purposeful 5 second delay to demonstrate latency. */
body { background: green; color: #fff; }
a { color: #fff;}
================================================
FILE: test/test-onload.html
================================================
<!doctype HTML>
<html>
<head>
<title>Blocking Test</title>
<meta charset="utf-8">
<script>
<!--#include virtual="../src/loadCSS.js" -->
<!--#include virtual="../src/onloadCSS.js" -->
var ss = loadCSS( "slow.css" );
onloadCSS( ss, function() {
document.body.innerHTML += '<h1>onload!!!</h1>';
});
</script>
</head>
<body>
<p>This is a test to see whether or not a loadCSS call will block render. This page uses loadCss to load a CSS file that has a 5 second delay built into its server response time. If loadCSS works properly, you should be able to read this text before the page is styled as white text on green background.</p>
</body>
</html>
================================================
FILE: test/test.html
================================================
<!doctype HTML>
<html>
<head>
<title>Blocking Test</title>
<meta charset="utf-8">
<style>
body {
background: #ccc;
}
</style>
<script>
<!--#include virtual="../src/loadCSS.js" -->
loadCSS( "slow.css" );
</script>
</head>
<body>
<p>This is a test to see whether or not a loadCSS call will block render. This page uses loadCss to load a CSS file that has a 5 second delay built into its server response time. If loadCSS works properly, you should be able to read this text before the page is styled as white text on green background.</p>
</body>
</html>
gitextract_fe3l29rk/
├── .gitignore
├── .jshintrc
├── .npmignore
├── .travis.yml
├── CONTRIBUTING.md
├── Gruntfile.js
├── LICENSE
├── README.md
├── bower.json
├── package.json
├── server.js
├── src/
│ ├── loadCSS.js
│ └── onloadCSS.js
└── test/
├── .htaccess
├── attributes.html
├── body.html
├── control.html
├── dom-append.html
├── import-head.html
├── import.html
├── index.html
├── mediatoggle.html
├── new-high.html
├── new-low.html
├── qunit/
│ ├── files/
│ │ ├── preloadtest.css
│ │ └── test.css
│ ├── index.html
│ ├── libs/
│ │ └── qunit/
│ │ ├── qunit.css
│ │ └── qunit.js
│ └── tests.js
├── recommended.html
├── slow.css
├── test-onload.html
└── test.html
SYMBOL INDEX (34 symbols across 4 files)
FILE: server.js
function requestHandler (line 25) | function requestHandler (request, response) {
FILE: src/loadCSS.js
function ready (line 38) | function ready( cb ){
function loadCB (line 66) | function loadCB(){
FILE: src/onloadCSS.js
function onloadCSS (line 4) | function onloadCSS( ss, callback ) {
FILE: test/qunit/libs/qunit/qunit.js
function Test (line 87) | function Test( settings ) {
function run (line 343) | function run() {
function F (line 677) | function F() {}
function done (line 1219) | function done() {
function validTest (line 1292) | function validTest( test ) {
function extractStacktrace (line 1333) | function extractStacktrace( e, offset ) {
function sourceFromStacktrace (line 1371) | function sourceFromStacktrace( offset ) {
function escapeText (line 1382) | function escapeText( s ) {
function synchronize (line 1404) | function synchronize( callback, last ) {
function process (line 1412) | function process( last ) {
function saveGlobal (line 1433) | function saveGlobal() {
function checkPollution (line 1447) | function checkPollution() {
function diff (line 1466) | function diff( a, b ) {
function extend (line 1482) | function extend( a, b ) {
function addEvent (line 1501) | function addEvent( elem, type, fn ) {
function addEvents (line 1516) | function addEvents( elems, type, fn ) {
function hasClass (line 1523) | function hasClass( elem, name ) {
function addClass (line 1527) | function addClass( elem, name ) {
function removeClass (line 1533) | function removeClass( elem, name ) {
function id (line 1543) | function id( name ) {
function registerLoggingCallback (line 1548) | function registerLoggingCallback( key ) {
function runLoggingCallbacks (line 1555) | function runLoggingCallbacks( key, scope, args ) {
function bindCallbacks (line 1572) | function bindCallbacks( o, callbacks, args ) {
function useStrictEquality (line 1596) | function useStrictEquality( b, a ) {
function quote (line 1764) | function quote( str ) {
function literal (line 1767) | function literal( o ) {
function join (line 1770) | function join( pre, arr, post ) {
function array (line 1782) | function array( arr, stack ) {
function inArray (line 1984) | function inArray( elem, array ) {
function diff (line 2014) | function diff( o, n ) {
Condensed preview — 34 files, each showing path, character count, and a content snippet. Download the .json file or copy for the full structured content (107K chars).
[
{
"path": ".gitignore",
"chars": 18,
"preview": "node_modules\ndist\n"
},
{
"path": ".jshintrc",
"chars": 316,
"preview": "{\n\t\"boss\": true,\n\t\"curly\": true,\n\t\"eqeqeq\": true,\n\t\"eqnull\": true,\n\t\"expr\": true,\n\t\"immed\": true,\n\t\"noarg\": true,\n\t\"smar"
},
{
"path": ".npmignore",
"chars": 13,
"preview": "node_modules\n"
},
{
"path": ".travis.yml",
"chars": 86,
"preview": "language: node_js\nnode_js:\n - 12.6.0\nbefore_script:\n - npm install\nscript: grunt -v\n"
},
{
"path": "CONTRIBUTING.md",
"chars": 879,
"preview": "# Contributing to loadCSS\n\nContributions are appreciated. In order for us to consider including a contribution, it does "
},
{
"path": "Gruntfile.js",
"chars": 874,
"preview": "/* global module:false */\nmodule.exports = function(grunt) {\n\n\trequire( 'matchdep' ).filterDev( ['grunt-*', '!grunt-cli'"
},
{
"path": "LICENSE",
"chars": 1093,
"preview": "The MIT License (MIT)\n\nCopyright (c) @scottjehl, 2016 Filament Group\n\nPermission is hereby granted, free of charge, to a"
},
{
"path": "README.md",
"chars": 5315,
"preview": ":warning: This project is archived and the repository is no longer maintained. \t\t\t\t\n\n# loadCSS\n\nA pattern for loading CS"
},
{
"path": "bower.json",
"chars": 84,
"preview": "{\n\t\"name\": \"loadcss\",\n\t\"main\": [\n\t\t\"src/loadCSS.js\"\n\t],\n\t\"ignore\": [\n\t\t\"**/.*\"\n\t]\n}\n"
},
{
"path": "package.json",
"chars": 918,
"preview": "{\n \"name\": \"fg-loadcss\",\n \"version\": \"3.1.0\",\n \"description\": \"A function for loading CSS asynchronously\",\n \"main\": "
},
{
"path": "server.js",
"chars": 1452,
"preview": "/* jshint esversion: 6 */\n\nconst fs = require('fs');\nconst http = require('http');\nconst path = require('path');\nconst p"
},
{
"path": "src/loadCSS.js",
"chars": 3103,
"preview": "/*! loadCSS. [c]2020 Filament Group, Inc. MIT License */\n(function(w){\n\t\"use strict\";\n\t/* exported loadCSS */\n\tvar loadC"
},
{
"path": "src/onloadCSS.js",
"chars": 844,
"preview": "/*! onloadCSS. (onload callback for loadCSS) [c]2017 Filament Group, Inc. MIT License */\n/* global navigator */\n/* expor"
},
{
"path": "test/.htaccess",
"chars": 775,
"preview": "# make sure our ssi includes work\nSSILegacyExprParser on\n\n# enabled SSI for .html files\nAddType text/html .html\nAddHandl"
},
{
"path": "test/attributes.html",
"chars": 3958,
"preview": "<!DOCTYPE html>\n<html>\n\t<head>\n\t\t<meta charset=\"utf-8\">\n\t\t<meta name=\"viewport\" content=\"width=device-width\">\n\t\t<title>T"
},
{
"path": "test/body.html",
"chars": 229,
"preview": "<!doctype HTML>\n<html>\n\t<head>\n\t\t<title>Link in body Test</title>\n\t\t<meta charset=\"utf-8\">\n\t</head>\n\t<body>\n <h1>Text b"
},
{
"path": "test/control.html",
"chars": 397,
"preview": "<!doctype HTML>\n<html>\n\t<head>\n\t\t<title>Blocking Test</title>\n\t\t<meta charset=\"utf-8\">\n\t\t<link rel=\"stylesheet\" href=\"sl"
},
{
"path": "test/dom-append.html",
"chars": 543,
"preview": "<!doctype HTML>\n<html>\n\t<head>\n\t\t<title>Blocking Test</title>\n\t\t<meta charset=\"utf-8\">\n\t</head>\n\t<body>\n <p>This is a c"
},
{
"path": "test/import-head.html",
"chars": 403,
"preview": "<!doctype HTML>\n<html>\n\t<head>\n\t\t<title>Blocking Test</title>\n\t\t<meta charset=\"utf-8\">\n\t\t<style>\n\t\t@import url(\"slow.css"
},
{
"path": "test/import.html",
"chars": 403,
"preview": "<!doctype HTML>\n<html>\n\t<head>\n\t\t<title>Blocking Test</title>\n\t\t<meta charset=\"utf-8\">\n\t</head>\n\t<body>\n\t\t<p>This is a c"
},
{
"path": "test/index.html",
"chars": 2043,
"preview": "<!doctype HTML>\n<html>\n\t<head>\n\t\t<title>LoadCSS Diagnostic Test Files</title>\n\t\t<meta charset=\"utf-8\">\n\t\t<style>\n\t\t\t/* a"
},
{
"path": "test/mediatoggle.html",
"chars": 1170,
"preview": "<!doctype HTML>\n<html>\n\t<head>\n\t\t<title>CSS link media toggle</title>\n\t\t<link rel=\"stylesheet\" href=\"slow.css\" media=\"pr"
},
{
"path": "test/new-high.html",
"chars": 1326,
"preview": "<!doctype HTML>\n<html>\n\t<head>\n\t\t<title>Recommended Pattern Test</title>\n\t\t<meta charset=\"utf-8\">\n <link rel=\"alt"
},
{
"path": "test/new-low.html",
"chars": 1259,
"preview": "<!doctype HTML>\n<html>\n\t<head>\n\t\t<title>Recommended Pattern Test</title>\n\t\t<meta charset=\"utf-8\">\n <link rel=\"alt"
},
{
"path": "test/qunit/files/preloadtest.css",
"chars": 15,
"preview": "// just a file\n"
},
{
"path": "test/qunit/files/test.css",
"chars": 67,
"preview": ".foo {\n\tbackground: white;\n}\n.bar {\n\tbackground: rgb(0, 128, 0);\n}\n"
},
{
"path": "test/qunit/index.html",
"chars": 543,
"preview": "<!DOCTYPE html>\n<html>\n<head>\n\t<meta charset=\"utf-8\">\n\t<title>LoadCSS Test Suite</title>\n\t<meta id=\"before-test\" name=\"\""
},
{
"path": "test/qunit/libs/qunit/qunit.css",
"chars": 4668,
"preview": "/**\n * QUnit v1.11.0 - A JavaScript Unit Testing Framework\n *\n * http://qunitjs.com\n *\n * Copyright 2012 jQuery Foundati"
},
{
"path": "test/qunit/libs/qunit/qunit.js",
"chars": 56929,
"preview": "/**\n * QUnit v1.11.0 - A JavaScript Unit Testing Framework\n *\n * http://qunitjs.com\n *\n * Copyright 2012 jQuery Foundati"
},
{
"path": "test/qunit/tests.js",
"chars": 3260,
"preview": "(function(window) {\n\t/*\n\t\t======== A Handy Little QUnit Reference ========\n\t\thttp://api.qunitjs.com/\n\n\t\tTest methods:\n\t\t"
},
{
"path": "test/recommended.html",
"chars": 348,
"preview": "<!doctype HTML>\n<html>\n\t<head>\n\t\t<title>Recommended Pattern Test</title>\n\t\t<meta charset=\"utf-8\">\n <link rel=\"sty"
},
{
"path": "test/slow.css",
"chars": 146,
"preview": "/* This file was delivered after a purposeful 5 second delay to demonstrate latency. */\nbody { background: green; color:"
},
{
"path": "test/test-onload.html",
"chars": 672,
"preview": "<!doctype HTML>\n<html>\n\t<head>\n\t\t<title>Blocking Test</title>\n\t\t<meta charset=\"utf-8\">\n\t\t<script>\n\t\t<!--#include virtual"
},
{
"path": "test/test.html",
"chars": 584,
"preview": "<!doctype HTML>\n<html>\n\t<head>\n\t\t<title>Blocking Test</title>\n\t\t<meta charset=\"utf-8\">\n\t\t<style>\n\t\t\tbody {\n\t\t\t\tbackgroun"
}
]
About this extraction
This page contains the full source code of the filamentgroup/loadCSS GitHub repository, extracted and formatted as plain text for AI agents and large language models (LLMs). The extraction includes 34 files (92.5 KB), approximately 27.4k tokens, and a symbol index with 34 extracted functions, classes, methods, constants, and types. Use this with OpenClaw, Claude, ChatGPT, Cursor, Windsurf, or any other AI tool that accepts text input. You can copy the full output to your clipboard or download it as a .txt file.
Extracted by GitExtract — free GitHub repo to text converter for AI. Built by Nikandr Surkov.