Update onboarding based on new design spec (#163)

* Update onboarding based on new design spec

* Update order and styling

* update cypress and update onboarding spec

* add test for dpad keys on onboarding

Co-authored-by: jose pita <[email protected]>

cypress/integration/onboarding-spec.js

@@ -37,15 +37,6 @@ describe('Onboarding', () => {
     onboardingPage.getTitle().should('have.text', enJson['onboarding-2-title'])
     onboardingPage.getDescription().should('have.text', enJson['onboarding-2-description'])
     cy.getLeftSoftkeyButton().should('have.text', enJson['softkey-back'])
-    cy.getRightSoftkeyButton().should('have.text', enJson['softkey-next'])
-    cy.getRightSoftkeyButton().click()
-
-    // Page 3
-    onboardingPage.getMainImage().should('be.visible').should('have.attr', 'src').and('contains', 'onboarding-3.png')
-    onboardingPage.getBackgroundImage().should('be.visible').should('have.attr', 'style').and('contains', 'onboarding-3-background.png')
-    onboardingPage.getTitle().should('have.text', enJson['onboarding-3-title'])
-    onboardingPage.getDescription().should('have.text', enJson['onboarding-3-description'])
-    cy.getLeftSoftkeyButton().should('have.text', enJson['softkey-back'])
     cy.getRightSoftkeyButton().should('have.text', '')
     cy.getCenterSoftkeyButton().should('have.text', enJson['softkey-get-started']).click()
     searchPage.getSearchTextBox().should('be.visible')
@@ -60,7 +51,7 @@ describe('Onboarding', () => {
     searchPage.getSearchTextBox().should('be.visible')
   })
 
-  it('check forward and back movements', () => {
+  it('check forward and back movements with soft keys', () => {
     onboardingPage.getMainImage().should('be.visible').should('have.attr', 'src').and('contains', 'onboarding-0.png')
     cy.getRightSoftkeyButton().should('have.text', 'Next').click()
     onboardingPage.getMainImage().should('be.visible').should('have.attr', 'src').and('contains', 'onboarding-1.png')
@@ -71,6 +62,17 @@ describe('Onboarding', () => {
     cy.getLeftSoftkeyButton().should('have.text', 'Skip')
   })
 
+  it('check forward and back movements with DPad keys', () => {
+    onboardingPage.getMainImage().should('be.visible').should('have.attr', 'src').and('contains', 'onboarding-0.png')
+    cy.rightArrow()
+    onboardingPage.getMainImage().should('be.visible').should('have.attr', 'src').and('contains', 'onboarding-1.png')
+    cy.getRightSoftkeyButton().should('have.text', 'Next')
+    cy.leftArrow()
+    onboardingPage.getMainImage().should('be.visible').should('have.attr', 'src').and('contains', 'onboarding-0.png')
+    cy.getRightSoftkeyButton().should('have.text', 'Next')
+    cy.getLeftSoftkeyButton().should('have.text', 'Skip')
+  })
+
   it('change language and check onboarding', () => {
     cy.changeBrowserLanguageAndGoToHomePage('pt-PT')
     onboardingPage.getTitle().should('have.text', ptJson['onboarding-0-title'])

i18n/en.json

@@ -54,13 +54,11 @@
     "reference-title": "Reference [$1]",
     "offline-message": "No internet connection ",
     "onboarding-0-title": "The free encyclopedia",
-    "onboarding-0-description": "Wikipedia is a free resource written collaboratively by volunteers from around the world.",
-    "onboarding-1-title": "Access free knowledge",
-    "onboarding-1-description": "Read more than 40 million articles, completely ad-free! Updates and new articles added regularly.",
-    "onboarding-2-title": "Search in over 300 languages",
-    "onboarding-2-description": "Choose your preferred language or languages to search and read in.",
-    "onboarding-3-title": "Learn new facts and trivia",
-    "onboarding-3-description": "Explore the ‘Word of the day,’ view beautiful images and learn new information everyday with Wikipedia!",
+    "onboarding-0-description": "Wikipedia is a free knowledge resource filled with articles about people, places, and things from all around the globe.",
+    "onboarding-1-title": "Search in hundreds of languages",
+    "onboarding-1-description": "Choose your preferred language or languages to search and read in.",
+    "onboarding-2-title": "Get free knowledge",
+    "onboarding-2-description": "Read more than 50 million articles, completely ad-free! Updates and new articles added regularly. ",
     "settings-language": "Language",
     "settings-textsize": "Text size",
     "settings-about-wikipedia": "About Wikipedia",

i18n/qqq.json

@@ -59,8 +59,6 @@
 	"onboarding-1-description": "Second onboarding description message when the user first time start the application.",
 	"onboarding-2-title": "Third onboarding title message when the user first time start the application.",
 	"onboarding-2-description": "Third onboarding description message when the user first time start the application.",
-	"onboarding-3-title": "Forth onboarding title message when the user first time start the application.",
-	"onboarding-3-description": "Forth onboarding description message when the user first time start the application.",
 	"settings-language": "Label of the language item list. Shown in the Settings menu, used in language setting.",
 	"settings-textsize": "Label of the Text size item list. Shown in the Settings menu, used in text size setting.",
 	"settings-about-wikipedia": "Label of the About Wikipedia item list. Shown in the Settings menu, used in showing the information of Wikipedia.",