Change image load check strategy

Using the "complete" property worked for the file page, but not
for media viewer because change the src of an img doesn't reset
the prop.

This introduces a custom event that cucumber can listen to in order
to know when the full resolution image had been loaded in media
viewer.

Change-Id: I40875166e70badbb35106c4a3536c706a7c815b4
This commit is contained in:
Gilles Dubuc 2014-08-28 07:33:58 +02:00
parent a0a7c2f995
commit d6c142fd2b
3 changed files with 31 additions and 21 deletions

View file

@ -409,6 +409,8 @@
this.ui.canvas.unblur();
}
$( document ).trigger( $.Event( 'mmv-fullres-loaded') );
mw.mmv.actionLogger.log( 'image-view' );
};

View file

@ -14,11 +14,13 @@ Feature: Multimedia Viewer performance
Given I have a small browser window
When I click on an unrelated image in the article to warm up the browser cache
When I close MMV
When I listen to the mediaviewer image load
When I click on the first image in the article
Then the MMV image is loaded in 125 percent of the time with a warm cache and an average browser window
Scenario: MMV with cold cache and average browser window
Given I have an average browser window
When I listen to the mediaviewer image load
When I click on the first image in the article
Then the MMV image is loaded in 210 percent of the time with a cold cache and an average browser window
@ -26,11 +28,13 @@ Feature: Multimedia Viewer performance
Given I have an average browser window
When I click on an unrelated image in the article to warm up the browser cache
When I close MMV
When I listen to the mediaviewer image load
When I click on the first image in the article
Then the MMV image is loaded in 125 percent of the time with a warm cache and an average browser window
Scenario: MMV with cold cache and large browser window
Given I have a large browser window
When I listen to the mediaviewer image load
When I click on the first image in the article
Then the MMV image is loaded in 240 percent of the time with a cold cache and a large browser window
@ -38,5 +42,6 @@ Feature: Multimedia Viewer performance
Given I have a large browser window
When I click on an unrelated image in the article to warm up the browser cache
When I close MMV
When I listen to the mediaviewer image load
When I click on the first image in the article
Then the MMV image is loaded in 125 percent of the time with a warm cache and a large browser window

View file

@ -23,9 +23,31 @@ Given /^I am using a custom user agent$/ do
@browser = browser(test_name(@scenario), {user_agent: ENV["BROWSER_USERAGENT"]})
end
When /^I listen to the mediaviewer image load$/ do
@browser.execute_script("
$( document ).on( 'mmv-fullres-loaded', function() {
$( 'body' ).append( '<div class=\"mw-mmv-image-loaded-cucumber\"/>' );
} );
")
end
Then /^the File: page image is loaded$/ do
on(CommonsPage) do |page|
wait_for_image_load page, ".fullImageLink img"
@browser.execute_script("
function wait_for_image() {
var $img = $( '.fullImageLink img' );
if ( $img.length
&& $img.attr( 'src' ).match(/Kerala/)
&& $img.prop( 'complete' ) ) {
$( 'body' ).append( '<div class=\"mw-mmv-image-loaded-cucumber\"/>' );
} else {
setTimeout( wait_for_image, 10 );
}
}
wait_for_image();
")
Watir::Wait.until { page.mmv_image_loaded_cucumber_element.exists? }
#Has to be a global variable, otherwise it doesn't survive between scenarios
$commons_time = Time.now.getutc - @commons_open_time
log_performance "file-page", ( $commons_time * 1000 ).to_i.to_s, "", ""
@ -34,7 +56,7 @@ end
Then /^the MMV image is loaded in (\d+) percent of the time with a (.*) cache and an? (.*) browser window$/ do |percentage, cache, window_size|
on(E2ETestPage) do |page|
wait_for_image_load page, ".mw-mmv-image img"
Watir::Wait.until { page.mmv_image_loaded_cucumber_element.exists? }
mmv_time = Time.now.getutc - @image_click_time
log_performance "mmv", (mmv_time * 1000).to_i.to_s, cache, window_size
@ -43,25 +65,6 @@ Then /^the MMV image is loaded in (\d+) percent of the time with a (.*) cache an
end
end
def wait_for_image_load ( page, css_class )
@browser.execute_script("
function wait_for_image() {
var $img = $( '" + css_class + "' );
if ( $img.length
&& $img.attr( 'src' ).match(/Kerala/)
&& !$img.attr( 'src' ).match(/\\/220px-/) // Blurry placeholder
&& $img.prop( 'complete' ) ) {
$( 'body' ).append( '<div class=\"mw-mmv-image-loaded-cucumber\"/>' );
} else {
setTimeout( wait_for_image, 10 );
}
}
wait_for_image();
")
Watir::Wait.until { page.mmv_image_loaded_cucumber_element.exists? }
end
def log_performance ( type, duration, cache, window_size )
@browser.execute_script("
var stats = { type : '" + type + "', duration : " + duration + "};