| Index: trunk/extensions/WebFonts/tests/qunit/ext.webfonts.tests.js |
| — | — | @@ -3,13 +3,20 @@ |
| 4 | 4 | test( '-- Initial check', function() { |
| 5 | 5 | expect(1); |
| 6 | 6 | |
| 7 | | - ok( mw.webfonts, 'mw.webfonts is defined' ); |
| 8 | | - |
| | 7 | + if ( browserIsBlacklisted() ) { |
| | 8 | + ok( mw.webfonts === undefined, 'mw.webfonts is not defined because we are running in a blacklisted browser' ); |
| | 9 | + } else { |
| | 10 | + ok( mw.webfonts, 'mw.webfonts is defined and the browser is supported' ); |
| | 11 | + } |
| 9 | 12 | } ); |
| 10 | 13 | |
| 11 | | -test( '-- Web font application to body', function() { |
| 12 | | - expect( 17 ); |
| | 14 | +test( '-- Application of a web font to the page and its removal', function() { |
| | 15 | + if ( browserIsBlacklisted() ) { |
| | 16 | + return; |
| | 17 | + } |
| 13 | 18 | |
| | 19 | + expect( 25 ); |
| | 20 | + |
| 14 | 21 | var invalidFont = 'NonExistingFont'; |
| 15 | 22 | assertTrue( mw.webfonts.set( invalidFont ) === undefined, 'A non-existent font is not initialized' ); |
| 16 | 23 | // TODO: test that the right thing was written to the log |
| — | — | @@ -38,20 +45,35 @@ |
| 39 | 46 | deepEqual( oldConfig, mw.webfonts.oldconfig, 'Previous body css was saved properly' ); |
| 40 | 47 | |
| 41 | 48 | // Font application |
| 42 | | - equal( $body.css( 'font-family' ), "'" + teluguFont + "', " + fallbackFonts, 'The web font was applied to font-family of body' ); |
| 43 | | - equal( $inputElement.css( 'font-family' ), "'" + teluguFont + "', " + fallbackFonts, 'The web font was applied to font-family of input' ); |
| 44 | | - equal( $selectElement.css( 'font-family' ), "'" + teluguFont + "', " + fallbackFonts, 'The web font was applied to font-family of select' ); |
| 45 | | - equal( $textareaElement.css( 'font-family' ), "'" '"' + teluguFont + "', " + fallbackFonts, 'The web font was applied to font-family of textarea' ); |
| | 49 | + var expectedFontFamilyValue = "'" + teluguFont + "', " + fallbackFonts; |
| | 50 | + equal( $body.css( 'font-family' ), expectedFontFamilyValue, 'The web font was applied to font-family of body' ); |
| | 51 | + equal( $inputElement.css( 'font-family' ), expectedFontFamilyValue, 'The web font was applied to font-family of input' ); |
| | 52 | + equal( $selectElement.css( 'font-family' ), expectedFontFamilyValue, 'The web font was applied to font-family of select' ); |
| | 53 | + equal( $textareaElement.css( 'font-family' ), expectedFontFamilyValue, 'The web font was applied to font-family of textarea' ); |
| 46 | 54 | |
| 47 | | - // Restore <body> |
| 48 | | - $body.attr( 'lang', bodyLang ); |
| 49 | | - ok( mw.webfonts.reset(), 'Reset body after testing font application' ); |
| | 55 | + // Reset everything |
| | 56 | + ok( mw.webfonts.set( false ) === undefined, 'Reset body after testing font application' ); |
| | 57 | + equals( $body.css( 'font-family' ), oldConfig.fontFamily, 'Previous font-family for body was restored' ); |
| | 58 | + equals( $body.css( 'font-size' ), oldConfig.fontSize, 'Previous font-size for body was restored' ); |
| | 59 | + equals( $inputElement.css( 'font-family' ), oldConfig.fontFamily, 'Previous font-family for body was restored' ); |
| | 60 | + equals( $inputElement.css( 'font-size' ), oldConfig.fontSize, 'Previous font-size for body was restored' ); |
| | 61 | + equals( $selectElement.css( 'font-family' ), oldConfig.fontFamily, 'Previous font-family for the select element was restored' ); |
| | 62 | + equals( $selectElement.css( 'font-size' ), oldConfig.fontSize, 'Previous font-size for the select element restored' ); |
| | 63 | + equals( $textareaElement.css( 'font-family' ), oldConfig.fontFamily, 'Previous font-family for the textarea element was restored' ); |
| | 64 | + equals( $textareaElement.css( 'font-size' ), oldConfig.fontSize, 'Previous font-size for the textarea element was restored' ); |
| | 65 | + |
| 50 | 66 | ok( $inputElement.remove(), 'The input test element was removed from body' ); |
| 51 | 67 | ok( $selectElement.remove(), 'The select test element was removed from body' ); |
| 52 | 68 | ok( $textareaElement.remove(), 'The textarea test element was removed from body' ); |
| | 69 | + |
| | 70 | + $body.attr( 'lang', bodyLang ); |
| 53 | 71 | } ); |
| 54 | 72 | |
| 55 | 73 | test( '-- Dynamic font loading', function() { |
| | 74 | + if ( browserIsBlacklisted() ) { |
| | 75 | + return; |
| | 76 | + } |
| | 77 | + |
| 56 | 78 | expect( 7 ); |
| 57 | 79 | |
| 58 | 80 | var validFontName = mw.webfonts.config.languages.hi[0]; |
| — | — | @@ -68,6 +90,10 @@ |
| 69 | 91 | } ); |
| 70 | 92 | |
| 71 | 93 | test( '-- Dynamic font loading based on lang attribute', function() { |
| | 94 | + if ( browserIsBlacklisted() ) { |
| | 95 | + return; |
| | 96 | + } |
| | 97 | + |
| 72 | 98 | expect( 15 ); |
| 73 | 99 | |
| 74 | 100 | mw.webfonts.fonts = []; |
| — | — | @@ -96,13 +122,18 @@ |
| 97 | 123 | assertTrue( $.inArray( tamilFont, mw.webfonts.fonts ) >= 0 , 'Tamil font loaded' ); |
| 98 | 124 | assertTrue( isFontFaceLoaded( tamilFont ), 'New css rule font-face was added to the document for Tamil font' ); |
| 99 | 125 | |
| 100 | | - ok( mw.webfonts.reset(), 'Reset webfonts' ); |
| 101 | | - assertFalse( $testElement.hasClass( 'webfonts-lang-attr' ), 'The element has no webfonts-lang-attr since we reset it' ); |
| | 126 | + ok( mw.webfonts.reset(), 'Reset webfonts after testing application by lang' ); |
| | 127 | + assertFalse( $testElement.hasClass( 'webfonts-lang-attr' ), 'The testing element has no webfonts-lang-attr since we reset it' ); |
| | 128 | + // equals( $( 'body' ).find( '*[lang]' ).length, 0, 'There are no elements with the webfonts-lang-attr class' ); |
| 102 | 129 | |
| 103 | 130 | ok( $testElement.remove(), 'The test element was removed from body' ); |
| 104 | 131 | } ); |
| 105 | 132 | |
| 106 | 133 | test( '-- Dynamic font loading based on font-family style attribute', function() { |
| | 134 | + if ( browserIsBlacklisted() ) { |
| | 135 | + return; |
| | 136 | + } |
| | 137 | + |
| 107 | 138 | expect( 14 ); |
| 108 | 139 | |
| 109 | 140 | mw.webfonts.fonts = []; |
| — | — | @@ -111,21 +142,21 @@ |
| 112 | 143 | assertTrue( $testElement !== [], 'The test element is defined' ); |
| 113 | 144 | |
| 114 | 145 | var latinWebFont = 'RufScript'; |
| 115 | | - var fallbackFonts = ', Arial, Helvetica, sans'; |
| 116 | | - $testElement.attr( 'style','font-family: ' + latinWebFont + fallbackFonts ); |
| | 146 | + var fallbackFonts = 'Helvetica, Arial, sans-serif'; |
| | 147 | + $testElement.attr( 'style','font-family: ' + latinWebFont + ', ' + fallbackFonts ); |
| 117 | 148 | assertTrue( $.inArray( latinWebFont, mw.webfonts.fonts ) === -1 , 'Latin font not loaded yet' ); |
| 118 | 149 | ok( mw.webfonts.loadFontsForFontFamilyStyle(), 'Loaded fonts from font-family' ); |
| 119 | 150 | assertTrue( $.inArray( latinWebFont, mw.webfonts.fonts ) >= 0 , 'Latin font loaded' ); |
| 120 | 151 | assertTrue( isFontFaceLoaded( latinWebFont ), 'New css rule added to the document for Latin' ); |
| 121 | 152 | |
| 122 | 153 | var invalidFont = 'NonExistingFont'; |
| 123 | | - $testElement.attr( 'style','font-family: ' + invalidFont + fallbackFonts ); |
| | 154 | + $testElement.attr( 'style','font-family: ' + invalidFont + ', ' + fallbackFonts ); |
| 124 | 155 | ok( mw.webfonts.loadFontsForFontFamilyStyle(), 'Attempted to load non-existing fonts specified in font-family' ); |
| 125 | 156 | assertTrue( $.inArray( invalidFont, mw.webfonts.fonts ) === -1 , 'Font not loaded since it is not existing, including fallback fonts' ); |
| 126 | 157 | assertFalse( isFontFaceLoaded( invalidFont ), 'No new css rule added to the document since the font does not exist' ); |
| 127 | 158 | |
| 128 | 159 | var malayalamFont = mw.webfonts.config.languages.ml[0]; |
| 129 | | - $testElement.attr( 'style', 'font-family: ' + invalidFont + ', ' + malayalamFont + fallbackFonts ); |
| | 160 | + $testElement.attr( 'style', 'font-family: ' + invalidFont + ', ' + malayalamFont + ', ' + fallbackFonts ); |
| 130 | 161 | assertTrue( $.inArray( malayalamFont, mw.webfonts.fonts ) === -1 , 'Fallback font not loaded yet' ); |
| 131 | 162 | ok( mw.webfonts.loadFontsForFontFamilyStyle(), 'Loading fonts from font-family' ); |
| 132 | 163 | assertTrue( $.inArray( malayalamFont, mw.webfonts.fonts ) >= 0 , 'A fallback font was loaded' ); |
| — | — | @@ -135,24 +166,31 @@ |
| 136 | 167 | } ); |
| 137 | 168 | |
| 138 | 169 | test( '-- Build the menu', function() { |
| | 170 | + if ( browserIsBlacklisted() ) { |
| | 171 | + return; |
| | 172 | + } |
| | 173 | + |
| 139 | 174 | expect( 8 ); |
| | 175 | + |
| 140 | 176 | var oldFonts = mw.webfonts.fonts; |
| 141 | 177 | var fonts = []; |
| 142 | | - assertFalse( mw.webfonts.buildMenu( fonts ) , 'Build the menu with empty fonts list' ); |
| | 178 | + assertFalse( mw.webfonts.buildMenu( fonts ), 'Build the menu with empty fonts list' ); |
| 143 | 179 | fonts = mw.webfonts.config.languages.hi; |
| 144 | | - ok( mw.webfonts.buildMenu( fonts ) , 'Build the menu with hindi fonts list' ); |
| | 180 | + ok( mw.webfonts.buildMenu( fonts ) , 'Build the menu with Hindi fonts list' ); |
| 145 | 181 | equals( $( 'li#pt-webfont' ).length , 1, 'There should be one and only one menu at any time' ); |
| 146 | | - ok( mw.webfonts.buildMenu( fonts ) , 'Build the menu with hindi fonts list again' ); |
| | 182 | + ok( mw.webfonts.buildMenu( fonts ) , 'Build the menu with Hindi fonts list again' ); |
| 147 | 183 | equals( $( 'li#pt-webfont' ).length , 1, 'There should be one and only one menu at any time' ); |
| 148 | | - equals( $( 'ul#webfonts-fontsmenu li' ).length , fonts.length + 2 , 'Number of menu items is number of availables fonts, a help link and reset item' ); |
| 149 | | - equals ( $( 'li.webfont-help-item').length , 1, 'Help link exists' ); |
| | 184 | + equals( $( 'ul#webfonts-fontsmenu li' ).length, fonts.length + 2, 'Number of menu items is number of availables fonts, a help link and reset item' ); |
| | 185 | + equals ( $( 'li.webfont-help-item').length, 1, 'Help link exists' ); |
| 150 | 186 | if (oldFonts.length) |
| 151 | | - assertTrue( mw.webfonts.buildMenu( oldFonts ) , 'Restore the menu' ); |
| | 187 | + assertTrue( mw.webfonts.buildMenu( oldFonts ), 'Restore the menu' ); |
| 152 | 188 | else { |
| 153 | | - assertFalse( mw.webfonts.buildMenu( oldFonts ) , 'Restore the menu' ); |
| | 189 | + assertFalse( mw.webfonts.buildMenu( oldFonts ), 'Restore the menu' ); |
| 154 | 190 | } |
| 155 | 191 | } ); |
| 156 | 192 | |
| | 193 | +// Tests end here |
| | 194 | + |
| 157 | 195 | isFontFaceLoaded = function( fontFamilyName ) { |
| 158 | 196 | var lastStyleIndex = document.styleSheets.length - 1; |
| 159 | 197 | |
| — | — | @@ -169,3 +207,14 @@ |
| 170 | 208 | |
| 171 | 209 | return false; |
| 172 | 210 | } |
| | 211 | + |
| | 212 | +browserIsBlacklisted = function() { |
| | 213 | + var ua = navigator.userAgent; |
| | 214 | + if ( ( /MSIE 6/i.test( ua ) ) |
| | 215 | + || ( /MSIE 8/i.test( ua ) && /Windows NT 5.1/i.test( ua ) ) ) |
| | 216 | + { |
| | 217 | + return true; |
| | 218 | + } |
| | 219 | + |
| | 220 | + return false; |
| | 221 | +} |