Index: trunk/extensions/WebFonts/tests/qunit/ext.webfonts.tests.js |
— | — | @@ -12,11 +12,11 @@ |
13 | 13 | var validFontName = 'Lohit Devanagari'; |
14 | 14 | mw.webfonts.fonts = []; |
15 | 15 | var cssRulesLength = document.styleSheets.length; |
16 | | - assertTrue( mw.webfonts.addFont( validFontName ) , 'Add the ' + validFontName + ' font' ); |
17 | | - assertTrue( $.inArray( validFontName, mw.webfonts.fonts ) >= 0 , validFontName + ' font loaded' ); |
| 16 | + assertTrue( mw.webfonts.addFont( validFontName ) , 'Add a Devanagari font' ); |
| 17 | + assertTrue( $.inArray( validFontName, mw.webfonts.fonts ) >= 0 , 'Devanagari font loaded' ); |
18 | 18 | assertTrue( cssRulesLength + 1 === document.styleSheets.length, 'New css rule added to the document' ); |
19 | 19 | var loadedFontsSize = mw.webfonts.fonts.length; |
20 | | - assertTrue( mw.webfonts.addFont( validFontName ) , 'Add the ' + validFontName + ' font again' ); |
| 20 | + assertTrue( mw.webfonts.addFont( validFontName ) , 'Add the Devanagari font again' ); |
21 | 21 | assertTrue( loadedFontsSize === mw.webfonts.fonts.length , 'A font that is already loaded is not loaded again' ); |
22 | 22 | assertFalse( mw.webfonts.addFont( 'Some non-existing font' ), 'addFont returns false if the font was not found' ); |
23 | 23 | assertTrue( cssRulesLength + 1 === document.styleSheets.length, 'Loading the font does not add new css rules' ); |
— | — | @@ -33,7 +33,7 @@ |
34 | 34 | wgPageContentLanguage: "en", |
35 | 35 | } ); |
36 | 36 | |
37 | | - ok( $( 'body' ).append( "<p class='webfonts-testing-lang-attr'>Some content</p>"), ' A testing element was appended to <body>' ); |
| 37 | + ok( $( 'body' ).append( "<p class='webfonts-testing-lang-attr'>Some content</p>"), ' A element for testing lang-based loading was appended to <body>' ); |
38 | 38 | $testElement = $( 'p.webfonts-testing-lang-attr' ) |
39 | 39 | assertTrue( $testElement !== [], 'The test element is defined' ); |
40 | 40 | |
— | — | @@ -48,8 +48,8 @@ |
49 | 49 | ok( $testElement.attr( 'lang' , 'ta' ) , 'Set lang attribute to ta (Tamil)' ); |
50 | 50 | ok( mw.webfonts.loadFontsForLangAttr(), 'Attempted to load fonts for the lang attribute ta' ); |
51 | 51 | assertTrue( $testElement.hasClass( 'webfonts-lang-attr' ), 'The test element has webfonts-lang-attr class' ); |
52 | | - assertTrue( $.inArray( tamilFont, mw.webfonts.fonts ) >= 0 , tamilFont + ' font loaded' ); |
53 | | - assertTrue( isFontFaceLoaded( tamilFont ), 'New css rule font-face was added to the document for font ' + tamilFont ); |
| 52 | + assertTrue( $.inArray( tamilFont, mw.webfonts.fonts ) >= 0 , 'Tamil font loaded' ); |
| 53 | + assertTrue( isFontFaceLoaded( tamilFont ), 'New css rule font-face was added to the document for Tamil font' ); |
54 | 54 | |
55 | 55 | ok( mw.webfonts.reset(), 'Reset webfonts' ); |
56 | 56 | assertFalse( $testElement.hasClass( 'webfonts-lang-attr' ), 'The element has no webfonts-lang-attr since we reset it' ); |
— | — | @@ -61,41 +61,47 @@ |
62 | 62 | expect( 14 ) |
63 | 63 | |
64 | 64 | mw.webfonts.fonts = []; |
65 | | - ok( $( 'body' ).append( "<p class='webfonts-testing-font-family-style'>Some Content</p>" ) ); |
| 65 | + ok( $( 'body' ).append( "<p class='webfonts-testing-font-family-style'>Some content</p>" ), 'An element for testing font-family loading was appended to <body>' ); |
66 | 66 | var $testElement = $( 'p.webfonts-testing-font-family-style' ); |
67 | | - assertTrue( $testElement !== [], 'Test element added' ); |
| 67 | + assertTrue( $testElement !== [], 'The test element is defined' ); |
68 | 68 | |
69 | | - $testElement.attr( 'style','font-family: RufScript, Arial, Helvetica, sans' ); |
70 | | - assertTrue( $.inArray( 'RufScript', mw.webfonts.fonts ) === -1 , 'RufScript Font not loaded yet' ); |
71 | | - ok( mw.webfonts.loadFontsForFontFamilyStyle() ); |
72 | | - assertTrue( $.inArray( 'RufScript', mw.webfonts.fonts ) >= 0 , 'Font loaded' ); |
73 | | - assertTrue( isFontFaceLoaded('RufScript'), 'New css rule added to the document for RufScript' ); |
| 69 | + var latinWebFont = 'RufScript'; |
| 70 | + var fallbackFonts = ', Arial, Helvetica, sans'; |
| 71 | + $testElement.attr( 'style','font-family: ' + latinWebFont + fallbackFonts ); |
| 72 | + assertTrue( $.inArray( latinWebFont, mw.webfonts.fonts ) === -1 , 'Latin font not loaded yet' ); |
| 73 | + ok( mw.webfonts.loadFontsForFontFamilyStyle(), 'Loaded fonts from font-family' ); |
| 74 | + assertTrue( $.inArray( latinWebFont, mw.webfonts.fonts ) >= 0 , 'Latin font loaded' ); |
| 75 | + assertTrue( isFontFaceLoaded( latinWebFont ), 'New css rule added to the document for Latin' ); |
74 | 76 | |
75 | | - $testElement.attr( 'style','font-family: NonExistingFont, Arial, Helvetica, sans' ); |
76 | | - ok( mw.webfonts.loadFontsForFontFamilyStyle() ); |
77 | | - assertTrue( $.inArray( 'NonExistingFont', mw.webfonts.fonts ) === -1 , 'Font not loaded since it is not existing, including fallback fonts' ); |
78 | | - assertFalse( isFontFaceLoaded( 'NonExistingFont' ), 'No new css rule added to the document' ); |
79 | | - |
80 | | - $testElement.attr( 'style','font-family: NonExistingFont, AnjaliOldLipi, Arial, Helvetica, sans' ); |
81 | | - assertTrue( $.inArray( 'AnjaliOldLipi', mw.webfonts.fonts ) === -1 , 'Fallback font AnjaliOldLipi not loaded yet' ); |
82 | | - ok( mw.webfonts.loadFontsForFontFamilyStyle() ); |
83 | | - assertTrue( $.inArray( 'AnjaliOldLipi', mw.webfonts.fonts ) >= 0 , 'Fallback font AnjaliOldLipi loaded' ); |
84 | | - assertTrue( isFontFaceLoaded('AnjaliOldLipi') , 'New css rule added to the document for fallbackfont AnjaliOldLipi' ); |
| 77 | + var invalidFont = 'NonExistingFont'; |
| 78 | + $testElement.attr( 'style','font-family: ' + invalidFont + fallbackFonts ); |
| 79 | + ok( mw.webfonts.loadFontsForFontFamilyStyle(), 'Attempted to load non-existing fonts specified in font-family' ); |
| 80 | + assertTrue( $.inArray( invalidFont, mw.webfonts.fonts ) === -1 , 'Font not loaded since it is not existing, including fallback fonts' ); |
| 81 | + assertFalse( isFontFaceLoaded( invalidFont ), 'No new css rule added to the document since the font does not exist' ); |
85 | 82 | |
| 83 | + var malayalamFont = 'AnjaliOldLipi'; |
| 84 | + $testElement.attr( 'style', 'font-family: ' + invalidFont + ', ' + malayalamFont + fallbackFonts ); |
| 85 | + assertTrue( $.inArray( malayalamFont, mw.webfonts.fonts ) === -1 , 'Fallback font not loaded yet' ); |
| 86 | + ok( mw.webfonts.loadFontsForFontFamilyStyle(), 'Loading fonts from font-family' ); |
| 87 | + assertTrue( $.inArray( malayalamFont, mw.webfonts.fonts ) >= 0 , 'A fallback font was loaded' ); |
| 88 | + assertTrue( isFontFaceLoaded( malayalamFont ) , 'New css rule added to the document for fallback font' ); |
| 89 | + |
86 | 90 | ok( $testElement.remove() ); |
87 | 91 | } ); |
88 | 92 | |
89 | | -isFontFaceLoaded = function(fontFamilyName){ |
90 | | - var lastStyleIndex = document.styleSheets.length-1; |
| 93 | +isFontFaceLoaded = function( fontFamilyName ) { |
| 94 | + var lastStyleIndex = document.styleSheets.length - 1; |
| 95 | + |
91 | 96 | // Iterate from last. |
92 | | - for( var styleIndex = lastStyleIndex; styleIndex > 0; styleIndex-- ){ |
| 97 | + for( var styleIndex = lastStyleIndex; styleIndex > 0; styleIndex-- ) { |
93 | 98 | var lastStyleSheet = document.styleSheets[styleIndex]; |
94 | 99 | if ( !lastStyleSheet ) continue; |
95 | 100 | if ( !lastStyleSheet.cssRules[0] ) continue; |
96 | 101 | var cssText = lastStyleSheet.cssRules[0].cssText; |
97 | | - if ( cssText.indexOf( '@font-face' ) >= 0 && cssText.indexOf( fontFamilyName ) >= 0 ){ |
| 102 | + if ( cssText.indexOf( '@font-face' ) >= 0 && cssText.indexOf( fontFamilyName ) >= 0 ) { |
98 | 103 | return true; |
99 | 104 | } |
100 | 105 | } |
| 106 | + |
101 | 107 | return false; |
102 | 108 | } |