From 75dbc72e6cc879bf3ad9bef2bb9527d8692e0f30 Mon Sep 17 00:00:00 2001 From: Gilles Dubuc Date: Mon, 24 Feb 2014 15:34:46 +0100 Subject: [PATCH] Better way to detect CORS support The old technique doesn't work in Firefox and doesn't always work in Chrome depending on when you call it. https://hacks.mozilla.org/2009/07/cross-site-xmlhttprequest-with-cors/ Also fixes some tests that weren't overloading the right function and were hitting the real feature detection check Change-Id: I0a9d6b5654efb169860ddf7e5e0551efb825920c --- resources/mmv/provider/mmv.provider.Image.js | 11 +++++++++-- .../qunit/provider/mmv.provider.Image.test.js | 18 ++++++------------ 2 files changed, 15 insertions(+), 14 deletions(-) diff --git a/resources/mmv/provider/mmv.provider.Image.js b/resources/mmv/provider/mmv.provider.Image.js index ee9a2f97d..541ba7b4b 100644 --- a/resources/mmv/provider/mmv.provider.Image.js +++ b/resources/mmv/provider/mmv.provider.Image.js @@ -100,11 +100,18 @@ /** * Checks whether the current browser supports AJAX preloading of images. + * This means that: + * - the browser supports CORS requests (large wiki farms usually host images on a + * separate domain) and + * - either AJAX and normal image loading uses the same cache (when an image is used by a CORS + * request, and then normally by setting img.src, it is only loaded once) + * - or (as is the case with Firefox) they are cached separately, but that can be changed by + * setting the crossOrigin attribute * @return {boolean} */ Image.prototype.imagePreloadingSupported = function () { - // FIXME this is a *very* rough guess, but it'll work as the first estimation. - return 'crossOrigin' in new Image(); + // This checks if the browser supports CORS requests in XHRs + return 'withCredentials' in new XMLHttpRequest(); }; mw.mmv.provider.Image = Image; diff --git a/tests/qunit/provider/mmv.provider.Image.test.js b/tests/qunit/provider/mmv.provider.Image.test.js index eae57549c..3afed08b1 100644 --- a/tests/qunit/provider/mmv.provider.Image.test.js +++ b/tests/qunit/provider/mmv.provider.Image.test.js @@ -30,10 +30,8 @@ + '8yw83NDDeNGe4Ug9C9zwz3gVLMDA/A6P9/AFGGFyjOXZtQAAAAAElFTkSuQmCC', imageProvider = new mw.mmv.provider.Image(); - imageProvider.performance = { - imagePreloadingSupported: function () { return false; }, - recordEntry: $.noop - }; + imageProvider.imagePreloadingSupported = function () { return false; }; + imageProvider.performance.recordEntry = $.noop; QUnit.stop(); imageProvider.get( url ).then( function( image ) { @@ -52,10 +50,8 @@ result, imageProvider = new mw.mmv.provider.Image(); - imageProvider.performance = { - imagePreloadingSupported: function () { return false; }, - recordEntry: $.noop - }; + imageProvider.imagePreloadingSupported = function () { return false; }; + imageProvider.performance.recordEntry = $.noop; QUnit.stop(); imageProvider.get( url ).then( function( image ) { @@ -85,10 +81,8 @@ QUnit.asyncTest( 'Image load fail test', 1, function ( assert ) { var imageProvider = new mw.mmv.provider.Image(); - imageProvider.performance = { - imagePreloadingSupported: function () { return false; }, - recordEntry: $.noop - }; + imageProvider.imagePreloadingSupported = function () { return false; }; + imageProvider.performance.recordEntry = $.noop; imageProvider.get( 'doesntexist.png' ).fail( function() { assert.ok( true, 'fail handler was called' );