speed up release cycles with cross browser continuous … up...android, 73.5% ios, 19.9% unknown,...
TRANSCRIPT
Speed up release cycles with Cross Browser Continuous Testing
▪February 2018
Speakers
2
Sheli AshkenaziProduct Management
Experitest
Tom Ben Simhon
Head of Product Experitest
Agenda
3
Speed or quality? An impossible tradeoff
Cross browser testing – the case of Responsive Web Design
How to set up a hassle free selenium testing environment
01
02
03
What is accessibility?04
7 min
5 min
20 min
5 min
Summary + Q&A05 10 min
4
I run a technology company that happens to have a bank…CEO of a leading North American bank
Source: Forrester
5
The stakes are high
Over 80% of people have stopped doing business with a company due to bad experience
Ovum
Shorter cycles = More cycles
*Same or more features in app = More regression testsMore cycles
Short release cycle side effects
6
Digital platform segmentation growing Global data, Dec 2017
7
Mobile,
52.4%
Tablet, 4.3%
Desktop,
43.2%
Platform
Windows,
82.7%OS X, 13.1%
Unknown, 1.8%Linux, 1.5% Chrome OS, 0.9%
Desktop OS
Chrome, 60.6%
Firefox,
11.0%
IE 11, 9.5%
Edge, 4.6%
Safari, 4.0%
Desktop browsers
Source: Statcounter
Samsung, 31%
Apple, 23%Others, 30%
Unknown, 7%
Huawei, 5%
Xiaomi, 4%
Mobile device vendor
Android, 73.5%
iOS, 19.9%
Unknown, 3.5%
Other, 3.0%
Mobile OS
8
Why cross browser testing
CSS behave differently in different browsers
Why cross browser testing on real devices
9
Continuous testing critical for rapid release cycles
Rapid delivery cycles rapid test cycles
Image source: Forrester
Large scale execution
Part of CI/CD pipeline and toolchain
High level of automation
Rapid result analysis and feedback
Throughout development cycle –development & test
10
Poll
Agenda
11
Speed or quality? An impossible tradeoff
Cross browser testing – the case of Responsive Web Design
How to set up a hassle free selenium testing environment
01
02
03
What is accessibility?04
7 min
5 min
20 min
5 min
Summary + Q&A05 10 min
12
Responsive Web Design (RWD) – why should you care?
27%
23%
9%
3% 3% 3% 2%2%
2%2%
24%
Browsers by version
Chrome for Android
Chrome 63.0
Safari iPhone
Firefox 57.0
UC Browser 11.5
IE 11.0
Safari iPad
Android 0
Samsung Internet 6.2
Safari 11.0
Other
13
14
Fluid grid + flexible images + media queries
Flexible Layouts: Building a website with a flexible grid that can be easily resized to any width dynamically.
Media Queries: Provide various styles for the browsers and devices based on the context, such as the orientation of the device, viewport, etc.
Flexible Media: As the size of the viewports changes, the media (images, videos etc.) also need to change their size or resolution according to the requirement.
Media query breakpoints are used to determined what is displayed on different screen sizes
How does RWD work?
15
Make decisions, manage your automation projects or solve specific issues – based on real time data and reports
Leveraging test analytics to make quality decisions
16
Agenda
17
Speed or quality? An impossible tradeoff
Cross browser testing – the case of Responsive Web Design
How to set up a hassle free selenium testing environment
01
02
03
What is accessibility?04
7 min
5 min
20 min
5 min
Summary + Q&A05 10 min
18
Agenda
19
Speed or quality? An impossible tradeoff
Cross browser testing – the case of Responsive Web Design
How to set up a hassle free selenium testing environment
01
02
03
What is accessibility?04
7 min
5 min
20 min
5 min
Summary + Q&A05 10 min
20
General principles:
• Content labels and alt labels to enable use of readers
• Proper use of color contrast
• Good use of RWD, button sizes, spacing between buttons
• Clear language and generally usability
Accessibility guidelines: a matter of regulation
Removing barriers that prevent interaction with, or access to websites, by people with disabilities.
US: Rehabilitation Act section 508
EU: WCAG 2.0
Design and development increasing take accessibility into account.
Ensuring accessibility on all elements with Object Spy
Display elements that were designed for accessibility(contain the contentDescription property in Android or accessibilityLabel under iOS).
21
Agenda
22
Speed or quality? An impossible tradeoff
Cross browser testing – the case of Responsive Web Design
How to set up a hassle free selenium testing environment
01
02
03
What is accessibility?04
7 min
5 min
20 min
5 min
Summary + Q&A05 10 min
23
• Why a high scale cross browser testing program is critical in the digital age, and how to achieve one
• The importance of responsive web design and how to test it
• Leveraging test analytics to make quality decisions and speed up fault resolution
• The importance of accessibility
• How to easily set up and run a selenium testing environment supporting a large matrix of browser versions, platforms and OS
Re-cap
24
SeeTest Continuous Testing Platform for Web & Mobile Apps
< / >
Developer
Test engineer
DevOps engineer
Any platform Any OS Any app type Any browser Any user
Test Analytics - Web & Mobile
Consolidate all of your test results for mobile and web to
gain end-to-end quality insights and drive improvements.
Grid Execution – Web & Mobile
Accelerate testing cycles and increase coverage by running
your tests in parallel on multiple browsers and
mobile devices.
Test Development
Easily and quickly develop robust automated tests for mobile applications with an enhanced version of open-
source Appium.
25
Develop and run robust and continuous automated testing for web and mobile applications
Test Automation
Questions?
27