| <!DOCTYPE html> | 
 | <html> | 
 | <head> | 
 |     <title>CSSOM -  Extensions to the Document Interface: Stylesheet header load order</title> | 
 |     <link rel="author" title="Jesse Bounds" href="mailto:jesse@codeforamerica.org"> | 
 |     <link rel="help" href="http://www.w3.org/TR/cssom-1/#extensions-to-the-document-interface"> | 
 |     <link rel="help" href="http://www.w3.org/TR/cssom-1/#the-stylesheetlist-interface"> | 
 |     <link rel="help" href="http://www.w3.org/TR/cssom-1/#css-style-sheet-collections"> | 
 |     <style title="aaa" type="text/css"> | 
 |       H1 {border-width: 1; border: solid; text-align: center} | 
 |     </style> | 
 |     <link title="zebra" rel="stylesheet" href="zebra.css" type="text/css"> | 
 |     <link title="kilo" rel="stylesheet" href="kilo.css"  type="text/css"> | 
 |     <link title="alpha" rel="stylesheet" href="alpha.css" type="text/css"> | 
 |     <link title="zebra" rel="stylesheet" href="/directory01/zebra.css" type="text/css"> | 
 |     <meta name="flags" content="dom"> | 
 |     <meta name="assert" content="Document's style sheets created from HTTP Link headers are first in list and loaded in header order"> | 
 |     <script src="/resources/testharness.js"></script> | 
 |     <script src="/resources/testharnessreport.js"></script> | 
 | </head> | 
 | <body> | 
 |     <div id="log"></div> | 
 |     <script> | 
 |     onload = function() { | 
 |       // Get the Document's styleSheets attribute | 
 |       var styleSheets = document.styleSheets; | 
 |  | 
 |       // Verify that the styleSheets list length is 5 | 
 |       test(function() { | 
 |         assert_equals(styleSheets.length, 5, "styleSheets.length is incorrect:"); | 
 |       }, "styleSheets.length must be 5"); | 
 |  | 
 |       // Verify that titles of loaded sheets are as expected (in the correct order) | 
 |       test(function() { | 
 |         assert_equals(styleSheets.item(0).title, "aaa", "title for item 1 is incorrect:"); | 
 |       }, "styleSheets item 0 title must be aaa"); | 
 |       // Verify that titles of loaded sheets are as expected (in the correct order) | 
 |       test(function() { | 
 |         assert_equals(styleSheets.item(1).title, "zebra", "title for item 1 is incorrect:"); | 
 |       }, "styleSheets item 1 title must be zebra"); | 
 |       // Verify that titles of loaded sheets are as expected (in the correct order) | 
 |       test(function() { | 
 |         assert_equals(styleSheets.item(2).title, "kilo", "title for item 1 is incorrect:"); | 
 |       }, "styleSheets item 0 title must be kilo"); | 
 |       // Verify that titles of loaded sheets are as expected (in the correct order) | 
 |       test(function() { | 
 |         assert_equals(styleSheets.item(3).title, "alpha", "title for item 1 is incorrect:"); | 
 |       }, "styleSheets item 0 title must be alpha"); | 
 |       // Verify that titles of loaded sheets are as expected (in the correct order) | 
 |       test(function() { | 
 |         assert_equals(styleSheets.item(4).title, "zebra", "title for item 1 is incorrect:"); | 
 |       }, "styleSheets item 0 title must be zebra"); | 
 |     }; | 
 |     </script> | 
 | </body> | 
 | </html> |