Creative Automation with Galen Framework

CREATIVE AUTOMATION
All you need to know

2
© Copyright Publicis.Sapient | Confidential
Agenda
1. What Are We Validating?
2. Evolution in process
3. Steps to Execute
4. Reports (Test Results)
5. Overview (Approaches)
6. Proposed Process Plan
7. Future Scope
8. Q&A

4
Scenarios:
• Overlapping of Elements.
• Relative alignment of elements inside component.
• Relative width of elements.
• CSS properties like fonts, colors, size, margins and paddings etc…..
• Image Validation pixel by pixel.
• Broken Assets and empty (invalid components).
• Functionality to identify regression impact.

5
Validations: http://galenframework.com/docs/reference-galen-spec-language-guide
• Near
• Below and Above
• Left of and Right of
• Inside , Centered
• Width and Height
• Aligned (aligned horizontally all ,aligned horizontally top ,aligned horizontally bottom ,aligned horizontally
centered , aligned vertically all , aligned vertically left , aligned vertically right , aligned vertically centered)
• CSS Properties
• Visible , Absent
• Count
• Color scheme , Image etc.

7
One Click Local
(Component
Wise Execution)
MVC Structure
(Code
Structuring)
Galen
Framework
(Creative and
Reporting)
Selenium
Webdriver
(Base)
Architectural Layers

8
Controller
(Runner.test.js)
View
(Gspec)
Model
(init.js)
Our Code Structure
Browser.js,getUrl.js,loginPage.js,
LoginBrand.js

10
Running a Script: (After Prerequisites)
1. Go to your Automation folder, and there you will see two folders, named Desktop and Mobile.
2. Choose 1 folder , according to your breakpoint preference and go to Batch folder.
3. Double Click on any component batch file and wait for the reports.
4. After execution, Go to Reports folder and check the reports.
Making Changes:
• To change URL:
i. Go to Desktop/Mobile ->tests->init.js
ii. Now find array of component in which you want to make changes and replace the URL there.
• To Change Browser:
i. Go to Desktop/Mobile ->tests->browser.js
ii. Now uncomment the browser line according to your browser preference.
• To Change Environment:
i. Go to Desktop/Mobile ->tests->environment.js
ii. Now assign a variable value test or UAT.
• To Change Environment Password: Again user have to make a change in the code.

04 HTML Reports (Test Results)

12
Summery Of Each Run:
• Total number of validations.
• Number of validation failures.
• Number of passed validations
• Start time and End time.
• Total time took for each test.
Test Details:
• Heat Map functionality show Component’s/Element’s coverage.
• Each validation (object wise)
• Screenshot of each validation with highlighted object.

13
Test Summery

14
Test Details

15
Heat Map: Test Coverage

05 Problem Statements and Solution

17
1. Every validation we are doing here(on responsive websites), is screen size
dependent. Users will get different results, as they have different screen sizes.
2. To run this automation on individual level , every user have to install lot of
softwares and do the settings for the same.
3. In future if there’s any small change or further component development, again
user have to take the package from SVN or any other mode, which is a painful
process.
Problems with Local Approach

18
One Click Local
(Component Wise
Execution)
MVC Structure
(Code Structuring)
Galen Framework
(Creative and
Reporting)
Selenium Webdriver
(Base)
Server Approach
(Automation
Web App)
Approach Transformation

20
• One Click / Local Approach: We have a defined package of batch files and controllers, which user have to take it
from SVN to local and then user can run it after installing all the required softwares. Scripts will run on user’s
machine.
How to run: User has to trigger the batch file.(Double Click on batch file)
Whole Package and Reports will be stored in User’s machine.
• Automation Web App/ Server Approach: It is an intuitive web app, which you can run on your desktop, tablet or
mobile to run the scripts. Scripts will run on server machine. It will trigger the code based on your inputs.
How to run: User has to give input to a form.
Nothing will be stored in User’s machine.

06
Summarizing advantages of Server
approach

22
Sr. No. One Click/Local Approach Web App/Server Approach
1
User has to take the whole package from SVN
to Local
No Local Setup Needed.
2
User need to click on batch file from the
package
User is given a login screen and a UI form
for execution
3
Prerequisites: Installations and settings needed.
Softwares like Java, galen, node.js, adb, appium
are to be installed and setting should be done
for the same
No Prerquisites.
4 Component wise Yes, Component wise
5 Remotely Execution is not possible.
User can also run scripts from user’s mobile
phone.
6
URL is to be added in init fileif new URL is to be
added or modified
Form driven.
7
Changes should be done in browser.js in test
folder, if user want to change the browser.
Form driven.

23
Sr. No. One Click/Local Approach Web App/Server Approach
8
Changes should be done in environment.js in
test folder, if user want to change the
environment.
Form driven.
9
Changes should be done in password.js in test
folder, if user want to change the
environment password.
Form driven.
10
User has to check to know if reports are
generated.
User will be notified by push notification on the
browser
11 Appium has to be triggered manually Form driven. With a AJAX call.
12
Real device should be connected to users
machine.
Real device should be connected to sever machine.
13 Package Size is of 2.43 GB.
Package Size is of 48 MB. Because we are reusing
the most of code and we are generating it on
runtime.
14 New project compatibility is not that easy. It is comparatively easy.

24
Pros:
1. No Prerequisites, No need to install anything in users machine.
2. No KT’s required because of it’s User Experience, It very easy to change breakpoint, environment or its
password, browser or URLs (different domains) .
3. Reusable code. Package size is 70% decreased.
4. Easy maintenance.
5. Easy access to your own reports.
Cons:
1. User can’t see the execution on the browser. But from server it can be seen.
Server Approach: Pros and Cons

26
• Report Generation
•Review from component
owners
•Taking care of CR’s
•Taking care of new variations
•Creation of Dump on test
pages
•Creation of modal, gspec ,
and controller
•Add the whole
component to WEB APP
•From Site Dev & QA
(Owners)
•Decide the validations
using Pareto principle.
•Making of Test pages,
with all the variations of
that particular
component
Component
KT
Development
Report
Analyses &
Review
Maintenance
Process:

28
• Switching to Amazon Device farm for small breakpoints.
• Adding an admin panel so we can add scripts form the App (Independent of coding knowledge).
Future Plans

29
Q&A

Creative Automation with Galen Framework

More Related Content

What's hot (18)

Similar to Creative Automation with Galen Framework (20)

Recently uploaded (20)

Creative Automation with Galen Framework