README.md in testcentricity_mobile-4.0.1 vs README.md in testcentricity_mobile-4.0.2
- old
+ new
@@ -308,15 +308,17 @@
## ScreenSections
A `ScreenSection` is a collection of **UI Elements** that may appear in multiple locations on a screen, or on multiple
screens in an app. It is a collection of **UI Elements** that represent a conceptual area of functionality, like a menu,
a navigation bar, or a search capability. **UI Elements** and functional behavior are confined to the scope of a `ScreenSection`
-object.
+object. A `ScreenSection` may contain other `ScreenSection` objects.
-A `ScreenSection` may contain other `ScreenSection` objects.
+Below is an example of a footer navigation bar feature that is common to multiple screen -
+![Navigation Footer](https://raw.githubusercontent.com/TestCentricity/testcentricity_mobile/main/.github/images/NavBar1.png "Navigation Footer") ![Navigation Footer](https://raw.githubusercontent.com/TestCentricity/testcentricity_mobile/main/.github/images/NavBar2.png "Navigation Footer")
+
### Defining a ScreenSection
Your `ScreenSection` class definitions should be contained within individual `.rb` files in the `features/support/<platform>/sections`
folder of your test automation project, where `<platform>` is typically `ios` or `android`. For each screen section in your
app, you will typically have to define two `ScreenSections` - one for your iOS app and the other for your Android app.
@@ -685,42 +687,48 @@
:translate_upcase String
:translate_downcase String
:translate_capitalize String
:translate_titlecase String
-The example below depicts the usage of the `verify_ui_states` method to verify that the captions for menu items are correctly
-translated.
+The example below depicts the usage of the `verify_ui_states` method to verify that the captions for navigation menu items
+are correctly translated.
+
+![Localized UI](https://raw.githubusercontent.com/TestCentricity/testcentricity_mobile/main/.github/images/LocalizedUI.png "Localized UI")
```ruby
def verify_menu
ui = {
- account_settings_item => {
+ menu_title => {
visible: true,
- caption: { translate: 'Settings.account' }
+ caption: { translate: 'NavMenu.title' }
},
- help_item => {
+ recipes_item => {
visible: true,
- caption: { translate: 'Settings.help' }
+ caption: { translate: 'NavMenu.recipes' }
},
- feedback_item => {
+ browser_item => {
visible: true,
- caption: { translate: 'Settings.feedback' }
+ caption: { translate: 'NavMenu.browser' }
},
- legal_item => {
+ groceries_item => {
visible: true,
- caption: { translate: 'Settings.legal' }
+ caption: { translate: 'NavMenu.groceries' }
},
- configurations_item => {
+ pantry_item => {
visible: true,
- caption: { translate: 'Settings.configurations' }
+ caption: { translate: 'NavMenu.pantry' }
},
- contact_us_item => {
+ meals_item => {
visible: true,
- caption: { translate: 'Settings.contact' }
+ caption: { translate: 'NavMenu.meals' }
},
- sign_out_item => {
+ menus_item => {
visible: true,
- caption: { translate: 'Settings.sign_out' }
+ caption: { translate: 'NavMenu.menus' }
+ },
+ settings_item => {
+ visible: true,
+ caption: { translate: 'NavMenu.settings' }
}
}
verify_ui_states(ui)
end
```
@@ -728,41 +736,44 @@
menu example above, the translated strings for English, Spanish, and French are represented below:
**English** - `en.yml`
```yaml
en:
- Settings:
- account: 'Account'
- help: 'Help'
- feedback: 'Feedback'
- legal: 'Legal'
- configurations: 'Configurations'
- contact: 'Contact'
- sign_out: 'Sign out'
+ NavMenu:
+ title: 'Main Menu'
+ recipes: 'Recipes'
+ browser: 'Browser'
+ groceries: 'Groceries'
+ pantry: 'Pantry'
+ meals: 'Meals'
+ menus: 'Menus'
+ settings: 'Settings'
```
**Spanish** - `es.yml`
```yaml
es:
- Settings:
- account: 'Cuenta'
- help: 'Ayuda'
- feedback: 'Comentario'
- legal: 'Legal'
- configurations: 'Configuraciones'
- contact: 'Contacto'
- sign_out: 'Cerrar sesión'
+ NavMenu:
+ title: 'Menú principal'
+ recipes: 'Recetas'
+ browser: 'Navegador'
+ groceries: 'Compra'
+ pantry: 'Despensa'
+ meals: 'Comidas'
+ menus: 'Menús'
+ settings: 'Ajustes'
```
**French** - `fr.yml`
```yaml
fr:
- Settings:
- account: 'Compte'
- help: 'Aide'
- feedback: 'Retour'
- legal: 'Légal'
- configurations: 'Configurations'
- contact: 'Contact'
- sign_out: 'Fermer la session'
+ NavMenu:
+ title: 'Menu principal'
+ recipes: 'Recettes'
+ browser: 'Navigateur'
+ groceries: 'Courses'
+ pantry: 'Provisions'
+ meals: 'Repas'
+ menus: 'Menus'
+ settings: 'Réglades'
```
Each supported language/locale combination has a corresponding `.yml` file. I18n `.yml` file naming convention uses
[ISO-639 language codes and ISO-3166 country codes](https://docs.oracle.com/cd/E13214_01/wli/docs92/xref/xqisocodes.html).
For example: