mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/MultimediaViewer
synced 2024-09-29 21:28:12 +00:00
28b8f5095e
After lots of experimenting with Wireshark and current Chrome + Firefox on Ubuntu 13.10, this is my current understanding of the caching when preloading images with AJAX requests: * on Chrome, the image request always comes from browser cache * Firefox makes two separate requests by default * Firefox with img.crossOrigin = 'anonymous' makes two separate requests, but the second one is a 304 (does not load the image twice) * when the image has already been cached by the browser (but not in this session), Chrome skips both requests; Firefox skips the AJAX request, but sends the normal one, and it returns with 304. "wish I knew this when I started" things: * the Chrome DevTools has an option to disable cache. When this is enabled, requests in the same document context still come from cache (so if I load the page, fire an AJAX request, then without reloading the page, fire an AJAX request to the same URL, then the second request will be cached), but an AJAX request - image request pair is an exception from this. * when using Ctrl-F5 in Firefox, requests on that page will never hit the cache (even AJAX request fired after user activity; even if two identical requests follow each other). When using clear cache + normal reload, this is not the case. * if the image does not have an Allow-Origin header and is loaded with crossOrigin=true, Firefox will refuse to load it. Chrome will log an error in the console saying it refused to load it, but will actually load it. * Wireshark rocks. Pushed some tech debt (browser + domain whitelist) into other tickets: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/232 https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/233 Reverted commits:8a8d74f01d.63021d0b0e. Change-Id: I84ab2f3ac0a9706926adf7fe8726ecd9e9f843e0 Bug: 61542 Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/207
146 lines
5.8 KiB
Ruby
146 lines
5.8 KiB
Ruby
Given(/^I am at a wiki article with at least two embedded pictures$/) do
|
|
visit(LightboxDemoPage)
|
|
on(LightboxDemoPage).image1_in_article_element.should be_visible
|
|
end
|
|
|
|
When(/^I click on the first image in the article$/) do
|
|
on(LightboxDemoPage) do |page|
|
|
page.image1_in_article
|
|
end
|
|
end
|
|
|
|
When(/^I click the next arrow$/) do
|
|
on(LightboxDemoPage) do |page|
|
|
page.mmv_next_button_element.when_present.click
|
|
end
|
|
end
|
|
|
|
When(/^I click the previous arrow$/) do
|
|
on(LightboxDemoPage) do |page|
|
|
page.mmv_previous_button_element.when_present.click
|
|
end
|
|
end
|
|
|
|
When(/^I close MMV$/) do
|
|
on(LightboxDemoPage) do |page|
|
|
page.mmv_close_button_element.when_present.click
|
|
end
|
|
end
|
|
|
|
Then(/^I should be navigated back to the original wiki article$/) do
|
|
on(LightboxDemoPage) do |page|
|
|
page.image1_in_article_element.should be_visible
|
|
page.mmv_wrapper_element.should_not be_visible
|
|
end
|
|
end
|
|
|
|
Then(/^the image and metadata of the next image should appear$/) do
|
|
on(LightboxDemoPage) do |page|
|
|
# MMV was launched, article is not visible yet
|
|
page.image1_in_article_element.should_not be_visible
|
|
|
|
check_elements_in_viewer_for_image2(page)
|
|
end
|
|
end
|
|
|
|
Then(/^the image metadata and the image itself should be there$/) do
|
|
on(LightboxDemoPage) do |page|
|
|
# MMV was launched, article is not visible now
|
|
page.image1_in_article_element.should_not be_visible
|
|
|
|
check_elements_in_viewer_for_image1(page)
|
|
end
|
|
end
|
|
|
|
Then(/^the image and metadata of the previous image should appear$/) do
|
|
on(LightboxDemoPage) do |page|
|
|
# MMV was launched, article is not visible yet
|
|
page.image1_in_article_element.should_not be_visible
|
|
|
|
check_elements_in_viewer_for_image1(page)
|
|
end
|
|
end
|
|
|
|
# Helper function that verifies the presence of various elements in viewer
|
|
# while looking at image1 (Kerala)
|
|
def check_elements_in_viewer_for_image1(page)
|
|
# Check basic MMV elements are present
|
|
page.mmv_wrapper_element.should be_visible
|
|
page.mmv_image_div_element.should be_visible
|
|
|
|
# Check image content
|
|
page.mmv_image_div_element.image_element.attribute('src').should match /Kerala/
|
|
|
|
# Check basic metadata is present
|
|
|
|
# Title
|
|
page.mmv_metadata_title_element.when_present.text.should match /Sunrise over fishing boats in Kerala/
|
|
# License
|
|
page.mmv_metadata_license_element.when_present.attribute('href').should match /boats_in_Kerala.jpg$/
|
|
page.mmv_metadata_license_element.when_present.text.should match /CC BY-SA 3.0/
|
|
# Credit
|
|
page.mmv_metadata_credit_element.when_present.should be_visible
|
|
page.mmv_metadata_source_element.when_present.text.should match /Own work/
|
|
|
|
# Image metadata
|
|
page.mmv_image_metadata_wrapper_element.when_present.should be_visible
|
|
# Caption
|
|
page.mmv_image_metadata_caption_element.when_present.text.should match /Sunrise over fishing boats/
|
|
# Description
|
|
page.mmv_image_metadata_desc_element.when_present.text.should match /Sunrise over fishing boats on the beach south of Kovalam/
|
|
# Image metadata links
|
|
page.mmv_image_metadata_links_wrapper_element.when_present.should be_visible
|
|
# Repo link
|
|
page.mmv_image_metadata_repo_link_element.when_present.text.should match /Learn more on Wikimedia Commons/
|
|
page.mmv_image_metadata_repo_link_element.when_present.attribute('href').should match /boats_in_Kerala.jpg$/
|
|
# Category links
|
|
page.mmv_image_metadata_category_links_wrapper_element.when_present.should be_visible
|
|
# File usage
|
|
page.mmv_image_metadata_fileusage_wrapper_element.when_present.should be_visible
|
|
page.mmv_image_metadata_fileusage_wrapper_element.when_present.h3_element.text.should match /Used in [0-9] page/
|
|
page.mmv_image_metadata_fileusage_local_section_title_element.when_present.text.should match /On this site/
|
|
end
|
|
|
|
# Helper function that verifies the presence of various elements in viewer
|
|
# while looking at image2 (Aquarium)
|
|
def check_elements_in_viewer_for_image2(page)
|
|
# MMV was launched, article is not visible
|
|
page.image1_in_article_element.should_not be_visible
|
|
|
|
# Check basic MMV elements are present
|
|
page.mmv_wrapper_element.should be_visible
|
|
page.mmv_image_div_element.should be_visible
|
|
|
|
# Check image content
|
|
page.mmv_image_div_element.image_element.attribute('src').should match /Offsite/
|
|
|
|
# Check basic metadata is present
|
|
|
|
# Title
|
|
page.mmv_metadata_title_element.when_present.text.should match /All Hands Offsite/
|
|
# License
|
|
page.mmv_metadata_license_element.when_present.attribute('href').should match /All_Hands_Offsite.*\.jpg$/
|
|
page.mmv_metadata_license_element.when_present.text.should match /CC BY-SA 3.0/
|
|
# Credit
|
|
page.mmv_metadata_credit_element.when_present.should be_visible
|
|
page.mmv_metadata_source_element.when_present.text.should match /Wikimedia Foundation/
|
|
|
|
# Image metadata
|
|
page.mmv_image_metadata_wrapper_element.when_present.should be_visible
|
|
# Caption
|
|
page.mmv_image_metadata_caption_element.when_present.text.should match /Tropical Fish Aquarium/
|
|
# Description
|
|
page.mmv_image_metadata_desc_element.when_present.text.should match /Photo from Wikimedia Foundation/
|
|
# Image metadata links
|
|
page.mmv_image_metadata_links_wrapper_element.when_present.should be_visible
|
|
# Repo link
|
|
page.mmv_image_metadata_repo_link_element.when_present.text.should match /Learn more on Wikimedia Commons/
|
|
page.mmv_image_metadata_repo_link_element.when_present.attribute('href').should match /All_Hands_Offsite.*\.jpg$/
|
|
# Category links
|
|
page.mmv_image_metadata_category_links_wrapper_element.when_present.should be_visible
|
|
# File usage
|
|
page.mmv_image_metadata_fileusage_wrapper_element.when_present.should be_visible
|
|
page.mmv_image_metadata_fileusage_wrapper_element.when_present.h3_element.text.should match /Used in [0-9] page/
|
|
page.mmv_image_metadata_fileusage_local_section_title_element.when_present.text.should match /On this site/
|
|
end
|