Set correct license link location in E2E test

* Remove login since it's not longer needed
* Point to a new smaller test page instead of Lightbox_demo
 which should make the tests run much faster
* Tweak selenium scroll workaround which seems to be speed-dependant

Change-Id: I247ae6a5044ecc93b6f3839f1b9ed955b488b5a7
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/475

tests/browser/features/basic_mmv_navigation.feature

@@ -1,20 +1,8 @@
-@en.wikipedia.beta.wmflabs.org @login
+@en.wikipedia.beta.wmflabs.org @firefox
 Feature: Basic Multimedia Viewer navigation
 
-  NOTE: This test should be run against '/Lightbox_demo' to work correctly
-
-  Original acceptance criteria:
-  1) Open MMV
-  2) Check metadata and picture are there
-  3) Move to next image
-  4) Check corresponding metadata and picture are there
-  5) Move to the previous image
-  6) Check corresponding metadata and picture are there
-  7) Close MV and make sure we go back to article.
-
   Scenario: Multimedia Viewer (MMV)
-    Given I am logged in
-    And I am at a wiki article with at least two embedded pictures
+    Given I am at a wiki article with at least two embedded pictures
     When I click on the first image in the article
     Then the image metadata and the image itself should be there
     When I click the next arrow

tests/browser/features/mmv_performance.feature

@@ -1,9 +1,8 @@
-@login @mediawiki.org
+@mediawiki.org @firefox
 Feature: Multimedia Viewer performance
 
   Background:
-    Given I am logged in
-    And I am at a wiki article with at least two embedded pictures
+    Given I am at a wiki article with at least two embedded pictures
 
   Scenario: Commons with warm cache
     Given I visit an unrelated Commons page to warm up the browser cache

tests/browser/features/step_definitions/basic_mmv_navigation_steps.rb

@@ -1,13 +1,13 @@
 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
+  visit(E2ETestPage)
+  on(E2ETestPage).image1_in_article_element.should be_visible
 end
 
 When(/^I click on the first image in the article$/) do
-  on(LightboxDemoPage) do |page|
-    # We store the offset of the image as the scroll position, because cucumber/selenium
-    # automatically scrolls to it when we ask it to click on it
-    @articleScrollTop = page.execute_script("return Math.round($('a[href=\"/wiki/File:Sunrise_over_fishing_boats_in_Kerala.jpg\"]').first().find('img').offset().top);")
+  on(E2ETestPage) do |page|
+    # We store the offset of the image as the scroll position and scroll to it, because cucumber/selenium
+    # sometimes automatically scrolls to it when we ask it to click on it (seems to depend on timing)
+    @articleScrollTop = page.execute_script("var scrollTop = Math.round($('a[href=\"/wiki/File:Sunrise_over_fishing_boats_in_Kerala.jpg\"]').first().find('img').offset().top); window.scrollTo(0, scrollTop); return scrollTop;")
     # Scrolls to the image and clicks on it
     page.image1_in_article
     # This is a global variable that can be used to measure performance
@@ -16,36 +16,36 @@ When(/^I click on the first image in the article$/) do
 end
 
 When(/^I click on an unrelated image in the article to warm up the browser cache$/) do
-  on(LightboxDemoPage).other_image_in_article
+  on(E2ETestPage).other_image_in_article
 end
 
 When(/^I click the next arrow$/) do
-  on(LightboxDemoPage).mmv_next_button_element.when_present.click
+  on(E2ETestPage).mmv_next_button_element.when_present.click
 end
 
 When(/^I click the previous arrow$/) do
-  on(LightboxDemoPage).mmv_previous_button_element.when_present.click
+  on(E2ETestPage).mmv_previous_button_element.when_present.click
 end
 
 When(/^I close MMV$/) do
-  on(LightboxDemoPage).mmv_close_button_element.when_present.click
+  on(E2ETestPage).mmv_close_button_element.when_present.click
 end
 
 When(/^I press the browser back button$/) do
-  on(LightboxDemoPage) do |page|
+  on(E2ETestPage) do |page|
     page.execute_script("window.history.back();");
   end
 end
 
 Then(/^I should be navigated back to the original wiki article$/) do
-  on(LightboxDemoPage) do |page|
+  on(E2ETestPage) 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|
+  on(E2ETestPage) 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
@@ -53,7 +53,7 @@ Then(/^the image and metadata of the next image should appear$/) do
 end
 
 Then(/^the image metadata and the image itself should be there$/) do
-  on(LightboxDemoPage) do |page|
+  on(E2ETestPage) 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
@@ -61,7 +61,7 @@ Then(/^the image metadata and the image itself should be there$/) do
 end
 
 Then(/^the image and metadata of the previous image should appear$/) do
-  on(LightboxDemoPage) do |page|
+  on(E2ETestPage) 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
@@ -69,7 +69,7 @@ Then(/^the image and metadata of the previous image should appear$/) do
 end
 
 Then(/^the wiki article should be scrolled to the same position as before opening MMV$/) do
-  on(LightboxDemoPage) do |page|
+  on(E2ETestPage) do |page|
     page.execute_script("return $(window).scrollTop();").should eq @articleScrollTop
   end
 end
@@ -78,7 +78,8 @@ end
 # 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_overlay_element.when_present.should be_visible
+  page.mmv_wrapper_element.when_present.should be_visible
   page.mmv_image_div_element.should be_visible
 
   # Check image content
@@ -89,7 +90,7 @@ def check_elements_in_viewer_for_image1(page)
   # 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.attribute('href').should match /^http:\/\/creativecommons\.org\/licenses\/by-sa\/3\.0$/
   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
@@ -121,6 +122,7 @@ def check_elements_in_viewer_for_image2(page)
   page.image1_in_article_element.should_not be_visible
 
   # Check basic MMV elements are present
+  page.mmv_overlay_element.should be_visible
   page.mmv_wrapper_element.should be_visible
   page.mmv_image_div_element.should be_visible
 
@@ -132,7 +134,7 @@ def check_elements_in_viewer_for_image2(page)
   # 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.attribute('href').should match /^http:\/\/creativecommons\.org\/licenses\/by-sa\/3\.0$/
   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

tests/browser/features/step_definitions/mmv_performance_steps.rb

@@ -29,7 +29,7 @@ Then /^the File: page image is loaded$/ do
 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(LightboxDemoPage) do |page|
+  on(E2ETestPage) do |page|
     wait_for_image_load page, ".mw-mmv-image img"
     mmv_time = Time.now.getutc - @image_click_time
     log_performance "mmv", (mmv_time * 1000).to_i.to_s, cache, window_size

tests/browser/features/support/pages/e2e_test_page.rb

@@ -1,8 +1,8 @@
-class LightboxDemoPage
+class E2ETestPage
   include PageObject
   include URL
 
-  page_url URL.url("Lightbox_demo")
+  page_url URL.url("MediaViewerE2ETest")
 
   # Tag page elements that we will need.
 
@@ -11,6 +11,9 @@ class LightboxDemoPage
 
   a(:other_image_in_article, href: /Academy_of_Sciences\.jpg$/)
 
+  # Black overlay
+  div(:mmv_overlay, class: "mw-mmv-overlay")
+
   # Wrapper div for all mmv elements
   div(:mmv_wrapper, class: "mw-mmv-wrapper")