Add new scenarios for font changes

There is currently some duplication between the various page objects
and other code. Those should be cleaned up incrementally.

Change-Id: I592829a00ca65bbecd5399b773c885c764c1cc06

tests/browser/features/font_selection.feature

@@ -0,0 +1,38 @@
+@reset-preferences-after @login @en.wikipedia.beta.wmflabs.org @commons.wikimedia.beta.wmflabs.org
+Feature: Font selection
+
+In order to have better using experience,
+As a reader and writer,
+I want to change or disable the fonts for interface and content.
+
+In addition the user is provided live preview feature: changes are applied
+immediately when selection is made. Changes can either be applied or discared
+for easy testing.
+
+Background:
+  Given I am logged in
+    And I set "German" as the interface language
+    And the content language is "English"
+    And I inspect current fonts
+
+Scenario: Discarding live preview of content font
+  When I open "Fonts" panel of language settings
+    And I select "OpenDyslexic" font for the content language for the live preview
+    And I close the panel to discard the changes
+  Then the active content font must be the same as font prior to the preview
+    # System is the default value for English and German
+    And the selected content font must be "system"
+
+Scenario: Discarding live preview of interface font
+  When I open "Fonts" panel of language settings
+    And I select "OpenDyslexic" font for the interface language for the live preview
+    And I close the panel to discard the changes
+  Then the active interface font must be the same as font prior to the preview
+    # System is the default value for English and German
+    And the selected interface font must be "system"
+
+Scenario: Applying the live preview of interface font
+  When I open "Fonts" panel of language settings
+    And I select "OpenDyslexic" font for the interface language for the live preview
+    And I apply the changes
+  Then the interface font must be changed to the "OpenDyslexic" font

tests/browser/features/persistent_settings.feature

@@ -0,0 +1,14 @@
+@login @reset-preferences-after @en.wikipedia.beta.wmflabs.org @commons.wikimedia.beta.wmflabs.org
+Feature: Persistent settings
+
+  Background:
+    Given I am logged in
+      And I set "German" as the interface language
+      And the content language is "English"
+
+  Scenario: Interface font sticks to another page
+    When I open "Fonts" panel of language settings
+      And I select "OpenDyslexic" font for the interface language for the live preview
+      And I apply the changes
+      And I visit a random page
+    Then the selected interface font must be "OpenDyslexic"

tests/browser/features/step_definitions/common_steps.rb

@@ -5,3 +5,31 @@ end
 Given(/^I am logged in$/) do
   visit(LoginPage).login_with(@mediawiki_username, @mediawiki_password)
 end
+
+def language_to_code(language)
+	case language
+	when 'German'
+		'de'
+	when 'English'
+		'en'
+	else
+		pending
+	end
+end
+
+def get_font(selector)
+	@browser.execute_script( "return $( '#{selector}' ).css( 'font-family' );" )
+end
+
+def get_content_font()
+	get_font('#mw-content-text')
+end
+
+def get_interface_font()
+	get_font('body')
+end
+
+After('@reset-preferences-after') do |scenario|
+	visit(ResetPreferencesPage)
+	on(ResetPreferencesPage).submit_element.click
+end

tests/browser/features/step_definitions/panel_steps.rb

@@ -0,0 +1,97 @@
+Given(/^I set "(.*?)" as the interface language$/) do |language|
+	code = language_to_code(language)
+	visit(ULSPage, :using_params => {:setlang => "#{code}"})
+	# And check it took effect
+	actual = @browser.execute_script( "return jQuery( 'html' ).attr( 'lang' )" )
+	actual.should == code
+end
+
+Given(/^the content language is "(.*?)"$/) do |language|
+	code = language_to_code(language)
+	actual = @browser.execute_script( "return mw.config.get( 'wgContentLanguage' )" )
+	actual.should == code
+end
+
+Given(/^I inspect current fonts$/) do
+	@original_content_font = get_content_font()
+	@original_interface_font = get_interface_font()
+end
+
+When(/^I open "(.*?)" panel of language settings$/) do |panel|
+	# These can be of two different type of elements, which PageObjects do not like.
+	@browser.execute_script(
+		"jQuery( '.uls-trigger, .uls-settings-trigger' ).eq( 0 ).click()"
+	)
+	on(ULSPage) do |page|
+		case panel
+		when "Display"
+			page.panel_display_element.click
+		when "Language"
+			page.panel_display_element.click
+			page.panel_language_element.click
+		when "Fonts"
+			page.panel_display_element.click
+			page.panel_fonts_element.click
+		when "Input"
+			page.panel_input_element.click
+		else
+			pending
+		end
+	end
+end
+
+When(/^I select "(.*?)" font for the (.*?) language for the live preview$/) do |font,type|
+	if type == 'interface'
+		type = 'ui'
+	end
+	Selenium::WebDriver::Support::Select.new(
+		@browser.driver.find_element(:id, "#{type}-font-selector")
+	).select_by(:text, font)
+end
+
+When(/^I close the panel to discard the changes$/) do
+	on(ULSPage).panel_button_close_element.click
+end
+
+Then(/^the active (.*?) font must be the same as font prior to the preview$/) do |type|
+	case type
+	when "content"
+		get_content_font().should === @original_content_font
+	when "interface"
+		get_interface_font().should === @original_interface_font
+	else
+		pending
+	end
+end
+
+Then(/^the selected (.*?) font must be "(.*?)"$/) do |type, font|
+	if type == 'interface'
+		type = 'ui'
+	end
+	step 'I open "Fonts" panel of language settings'
+	Selenium::WebDriver::Support::Select.new(
+		@browser.driver.find_element(:id, "#{type}-font-selector")
+	).first_selected_option().attribute('value').should == font
+end
+
+When(/^I apply the changes$/) do
+	on(ULSPage).panel_button_display_apply_element.click
+	wait = Selenium::WebDriver::Wait.new(:timeout => 3)
+	panel = @browser.driver.find_element(:id => 'language-settings-dialog')
+  wait.until { !panel.displayed? }
+end
+
+Then(/^the (.*) font must be changed to the "(.*?)" font$/) do |type, font|
+	case type
+	when "content"
+		get_content_font().should match("^#{font}")
+	when "interface"
+		get_interface_font().should match("^#{font}")
+	else
+		pending
+	end
+end
+
+Then(/^the selected font displayed as the interface font must be the same as before the intermediate selection$/) do
+  pending # express the regexp above with the code you wish you had
+end

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

@@ -0,0 +1,14 @@
+class ULSPage
+  include PageObject
+
+  include URL
+  page_url URL.url('?setlang=<%=params[:setlang]%>')
+
+	div(:panel_display, id: 'display-settings-block')
+	div(:panel_input, id: 'display-settings-block')
+	button(:panel_fonts, id: 'uls-display-settings-fonts-tab')
+	button(:panel_language, id: 'uls-display-settings-language-tab')
+
+	span(:panel_button_close, id: 'languagesettings-close')
+	button(:panel_button_display_apply, id: 'uls-displaysettings-apply')
+end

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

@@ -0,0 +1,7 @@
+class ResetPreferencesPage
+	include PageObject
+	include URL
+	page_url URL.url('Special:Preferences/reset')
+
+	button(:submit, class: 'mw-htmlform-submit')
+end