Uphill Battle of Mobile Visual Regression

•Download as PPTX, PDF•

0 likes•210 views

Do you remember those games where you had to find differences between two almost identical images? If you've ever made changes in production, you sure played this game of searching for any visual changes you might have caused. The problem of catching visual regressions is what gave rise to a new way of testing - visual testing. While developers focus on automating their end-to-end flows with tools like Selenium, when it comes to end-to-end visual testing, many are at a loss. It is even more apparent in the world of mobile development, where devices differ in their capabilities, display dimensions and even operating systems. Hence, visual testing is a must-have in the mobile market! In this session, we discuss how to implement visual testing on mobile devices covering both native mobile (Android, iOS) and hybrid web development (React, React Native). We cover major visual concepts like layouts, responsive design, and graphics which should give the audience a clear picture of how to get started and be successful with visual testing.

Software

Uphill Battle Of Mobile
Visual Regression
Dmitry Vinnik
@DmitryVinnik dvinnik.com

What are our goals?
@DmitryVinnik dvinnik.com

Goals
Visual Testing (VT):
What, Why, How and When
New Perspective on Test Pyramid
Find VT Tool For Your Team

Target Platforms?
@DmitryVinnik dvinnik.com

Target Platforms
iOS
Android
Responsive
Apps
Hybrid
Apps
@DmitryVinnik dvinnik.com

Let’s see some dataBut “Mobile” is so broad
Android
iOS

How do we organize
QA Effort?
@DmitryVinnik dvinnik.com

From the Top Level
@DmitryVinnik dvinnik.com

Testing Quadrants
@DmitryVinnik dvinnik.com

Agile Testing Quadrants
by Lisa Crispin and Janet Gregory
@DmitryVinnik dvinnik.com

Let’s go in more details
@DmitryVinnik dvinnik.com

How do we usually test?
@DmitryVinnik dvinnik.com

@DmitryVinnik
Test Pyramid
↑ Fidelity
↓ Speed
↑ Cost
↓ Fidelity
↑ Speed
↓ Cost
dvinnik.com

Let’s try get more practical
@DmitryVinnik dvinnik.com

Is anyone thirsty?
@DmitryVinnik dvinnik.com

Pour Drink
Drinking Glass
@DmitryVinnik dvinnik.com

Test Pyramid & Drinking Glass
Pour Drink
Unit Integration E2E
@DmitryVinnik dvinnik.com

Pour Drink
@DmitryVinnik dvinnik.com
Unit Integration E2E
Test Pyramid & Drinking Glass

What are we missing?
@DmitryVinnik dvinnik.com

What are we missing?
Same
Functionally
Different
Visually
UX
UX
@DmitryVinnik dvinnik.com

Visual Testing
Visual
Content
Page
Layout
Visual
Animation
Responsive
Design
@DmitryVinnik dvinnik.com

Functional
Manual Testing
is Difficult
@DmitryVinnik dvinnik.com

Visual
Manual Testing
is Nearly
Impossible
@DmitryVinnik dvinnik.com

A Little Bit of Science
@DmitryVinnik dvinnik.com

Visual Testing
requires Automation
@DmitryVinnik dvinnik.com

On Every Level!
@DmitryVinnik dvinnik.com

Remember the Title?
@DmitryVinnik dvinnik.com

Uphill Battle Of Mobile
Visual Regression
@DmitryVinnik dvinnik.com

Test
Pyramid
Test Hill
Test
Mountain
@DmitryVinnik dvinnik.com

@DmitryVinnik
Visual Test Mountain
dvinnik.com

@DmitryVinnik
Visual Test Mountain
↓ Fidelity
↑ Speed
↓ Cost
↑ Fidelity
↓ Speed
↑ Cost
dvinnik.com

Let’s Start Our Climb!
@DmitryVinnik dvinnik.com

Testing Demos
Responsive
App
Hybrid App
Android iOSAndroid iOS
@DmitryVinnik dvinnik.com

Demo Time:
Snapshot Testing
@DmitryVinnik dvinnik.com

Let me show you why
@DmitryVinnik dvinnik.com

Quick Glance:
Responsive Design
in Action
@DmitryVinnik dvinnik.com

Visual Component Testing
@DmitryVinnik dvinnik.com

Let’s Step Back First
@DmitryVinnik dvinnik.com

Component Driven
Development
Reusable
Composable
Encapsulated
Semantic
@DmitryVinnik dvinnik.com

CDD in Practice
@DmitryVinnik dvinnik.com

Storybook
Library
Testing
Ground
Styleguide IDE
@DmitryVinnik dvinnik.com

Quick Glance:
Storybook
@DmitryVinnik dvinnik.com

Testing Demos
Responsive
App
Hybrid App
Android iOS
@DmitryVinnik dvinnik.com

Screenshot Testing
Action
Driver
View
Loader
Comparison
Driver
@DmitryVinnik dvinnik.com

Demo Time:
PhantomCSS
@DmitryVinnik dvinnik.com

Screenshot Testing:
Native
Action
Driver
View
Loader
Comparison
Driver@DmitryVinnik dvinnik.com

Screenshot Testing:
Native
Android screenshot-tests-for-android
iOS ios-snapshot-test-caseiOS ios-snapshot-test-case
@DmitryVinnik dvinnik.com

Demo Time:
Screenshot Testing
Android
@DmitryVinnik dvinnik.com

Enterprise
Screener.io
Flawlessapp.io
Chromatic
Percy.io
@DmitryVinnik dvinnik.com

Best Practices
Screenshot
Names
Component
Testing First
Git Media
Standard
Test Pyramid
@DmitryVinnik dvinnik.com

Summary
DOM/CSS
Not Enough
Dev = Test
Choose
Solution
Build
Solution
@DmitryVinnik dvinnik.com

Page Visual Tests
@DmitryVinnik dvinnik.com

Responsive Testing
Window Size
Transition
States
DOM/CSS
Screenshots
@DmitryVinnik dvinnik.com

Demo Time:
Responsive Testing
with Selenium
@DmitryVinnik dvinnik.com

Demo Time:
Native Visual Testing
with
Appium & Applitools
@DmitryVinnik dvinnik.com

Enterprise
Applitools BrowserStack
SauceLabs TestObjectSauceLabs
@DmitryVinnik dvinnik.com

Call For Action
Start the Climb Visual Unit
Tests
Visual
Component
Tests
Visual Page
Tests
@DmitryVinnik dvinnik.com

About Speaker
Twitter: @DmitryVinnik
Blog: dvinnik.com
LinkedIn: in/dmitry-vinnik/
Email: dmitry@dvinnik.com

Quantity or Quality – this is a common dilemma we all face when buying groceries, going to the restaurant, or shopping online. Unsurprisingly, when it comes to testing software, the same question of quality over quantity comes up. “How many tests?”, “How well to write them?”, “How much testing expertise do you need?” - all these questions aimed towards the same dilemma of quantity vs. quality. In this talk, we will discuss situations when quantity of our tests takes over their quality. We will answer a question on how this tendency of writing many unnecessary tests creates even larger issues like wasted cycles on fixing test-only failures, on maintaining existing test suite and on creating every new test from scratch. Whether you are currently facing these concerns, or when (not if) you are going to face this issue, this talk will give you necessary skills on how to address and more importantly how to prevent poor quality of the test code. The speaker will share his experience in working with legacy test suites, creating overly complicated tests himself, and how he tackled these challenges. Along with his experience, the speaker will rely on Software Engineering principles which are popularized among developers but not as commonly used by the tester community. The main takeaways of this talk will be for testers to look at their code the same way developers look at production code. In essence, we will blur the line between testing and development and learn how to take the best from development and apply it to our tests; best of both worlds.

Use Scrum and Continuous Delivery to innovate like crazy!

Peter Gfader

How often do you release your product to your end users? How often do your end users see and use your product? Why is Continuous Delivery helping us to focus on business value? How can Scrum help us to be innovative? These and more questions are going to be answered in this talk about Scrum with Continuous Delivery. Companies and organizations struggle with bureaucracy, dependencies, silo thinking, human behavior and technical problems and loose the real goal. Continuous Delivery being more than a technical practice can work with Scrum and changes the way we write software completely. Let’s see how we can combine those and delight our customers with a constant flow of features and happiness. Target audience: Experienced Scrum Practitioners that would like to take the next step to delight their customers

Fiverr reviews - Fiverr GIG- i'll fix any sort of drupal related issues

The Instant Solutions

We are a websites development company named 'The Instant Solutions'. We are also providing our best services on Fiverr.com too. Our best GIG on Fiverr.com is : ( I will fix any sort of drupal related issues ) https://www.fiverr.com/theinstantsolut/fix-any-sort-of-drupal-related-issues By this GIG we are providing brilliant services in Drupal (cms). Our programming skills in websites development are awesome. Here we have uploaded our few reviews from fiverr.com GIG. Please contact us, if you need any type of websites development services including developing complete website, extending features in it, or fixing any issues in your website. Thank you for visiting us :)

Testing at Scale at Meta and Salesforce

Dmitry Vinnik

Do you ever worry that your testing skills are too limited for your company? Are you concerned that other organizations, especially the ones with a massive scale, require a completely different set of skills? Worry no more! This talk will look at how testing is done at companies with the scale of the likes of Salesforce and Meta. We will discuss how the most basic testing skills and tools we use daily are transferable to any company.

From Robotium to Appium: Choose your Journey

Dmitry Vinnik

Mobile Testing is hard! You have to test not only Native Mobile but also Web-based applications. This multi-platform focus makes the testing effort to be at least twice as complicated as when a simple web application is targeted. With the growing market around smartphones, developers needed more ways to ensure software quality of their product. This need is why many mobile UI test frameworks have been introduced. With the most significant share of the mobile market being taken by Android OS, development and testing efforts have been especially crucial in this ecosystem. Among the variety of Mobile UI automation tools, two frameworks have been especially notable: Robotium and Appium. However, with more organizations moving towards multi-platform solutions, those of us, who used Robotium, are slowly moving towards Appium. This journey from Robotium to Appium is where the main focus of this presentation lies. In this session, we deep dive into both Robotium and Appium. We discuss why and how to transition from Robotium to Appium in the Android ecosystem. Lastly, we look at common mistakes made during this transition, and how to avoid them.

Modern Web Testing: Going Beyond Selenium

Dmitry Vinnik

It is safe to say that Selenium WebDriver is the number one testing tool for many software engineers across the globe. However, as the tech world has been growing rapidly, so has the testing industry. More and more UI testing frameworks besides Selenium are gaining popularity. These new test frameworks are especially appealing to its users because of the promise to solve speed, maintenance, development and other concerns of WebDriver implementations. These new, non-Selenium frameworks emphasize Rapid Test Development practices, and it has been resonating with the development community. In this talk, we dive into test solutions evolved from Selenium like Protractor, and talk about non-Selenium frameworks like TestCafe and Cypress.io. We discuss why these new tools are gaining popularity and continue to disrupt the traditional testing standards of Selenium WebDriver. More importantly, we address how to get started and what mistakes to avoid when first implementing TestCafe or Cypress.io in your team.

Do you even Function? Guiding Through Functional Interfaces

Dmitry Vinnik

Object-Oriented Programming - it is often synonymous with Java Development. But what if I were to tell you that there is more to Java than OOP principles? Starting JDK8, Java language introduced a new and exciting world of Functional Programming. This inherently powerful paradigm drives services like AWS Lambda, Azure Functions, or any other Function as a Service product out there. Functional programming offers better security, simpler maintenance, and more flexible design, so it is vital for Java developers to embrace this paradigm and learn how to use it well. In this talk, we discuss how to apply Functional programming in Java with the primary focus on Functional Interfaces. We explore out-of-the-box Functional structures, how to build custom Functions and look at common mistakes of impure abstractions and overly-DRY design.

Hands-on React Native: From Zero to Hero

All Things Open

Presented by: Dmitry Vinnik Presented at the All Things Open 2021 Raleigh, NC, USA Raleigh Convention Center Abstract: So many platforms, so little time. How do we write an app for the web, Android, iOS, and other OS without spending all our time and money? Cross-platform can be your answer! You probably heard about React Native before, a framework that allows the creation of native Android and iOS apps using React. But how do you actually get started with the framework? Whether you are an advanced iOS developer or a beginner React dev, this talk will help you get started with React Native. In this session, we will start by exploring React Native and its main concepts. Then, we will build a demo app from scratch for Android and iOS to show the power of cross-platform that the framework brings to the table!

Abstract: So many platforms, so little time. How do we write an app for the web, Android, iOS, and other OS without spending all our time and money? Cross-platform can be your answer! You probably heard about React Native before, a framework that allows you to create native Android and iOS apps using React. But how do you get started with the framework? Whether you are an advanced iOS developer or a beginner React dev, this talk will help you get started with React Native. In this session, we explore React Native and its main concepts. Then, we will build a demo app from scratch for Android and iOS to show the power of cross-platform that the framework brings to the table! Link: https://dvinnik.dev/talks/mobile/hands-on-react-native/

Modern Web Testing: Going Beyond Selenium

Dmitry Vinnik

Selenium WebDriver has been the traditional testing standard for many years. However, many developers have concerns over test speed, maintenance, and implementation. Fortunately, new, non-Selenium frameworks like TestCafe and Cypress.io rely on Rapid Test Development practices which address common issues teams have with their old test infrastructure. In this talk, we dive into platform-specific Selenium solutions like Protractor, and discuss non-Selenium frameworks like TestCafe and Cypress.io.

Testing Svelte with Jest: Validate Your Components Quickly!

Dmitry Vinnik

How confident are you in your Svelte app? Does your UI render after you add a new item to the nav menu? What about style changes - do you know how a font change affects the rest of your app? If you want to have confidence in your Svelte app, you need to have tests. Unfortunately, most testing frameworks are hard to set up, and it takes too long to run them. But this is not the case with Jest! Jest allows Svelte developers to get a quick test result for any change on the app. And setting up Jest on Svelte has never been easier than today! In this talk, we will look at how Svelte apps are tested E2E and why Jest stands out compared to other test frameworks. We will do a live demo while implementing several main test scenarios using Jest - get ready to code along!

Back to the CompletableFuture: Concurrency in Action

Dmitry Vinnik

Callback hell is a known way to give any JavaScript developer nightmares. However, Java developers are not much better off since anything concurrency and multithreading related gives us cold sweats. With Threads and Runnables being the very first (and often last) things we used in Java, these classes gave many of us impression of and appreciation for complexities of concurrency. As a result, many developers abandoned the idea of ever touching thread management in Java and focused on a single-threaded development. Fear no more! The world of concurrency in Java has changed since JDK8 and continues getting better. In this talk, we discuss improvements around Concurrency API of JDK5 and the power of asynchronous programming of CompletableFutures post-JDK8. Our goal is to break out of the fear of concurrency in Java and to learn about a new, declarative way of thread programming.

Testing React with Jest: Validate Your Components Quickly!

Dmitry Vinnik

How confident are you in your React app? Does your UI render after you add a new item to the nav menu? What about style changes - do you know how a font change affects the rest of your app? If you want to have confidence in your React app, you need to have tests. Unfortunately, most testing frameworks are hard to set up, and it takes too long to run them. But this is not the case with Jest! Jest allows React developers to get a quick test result for any change on the app. And setting up Jest on React has never been easier than today! In this talk, we look at how React apps are tested E2E and why Jest stands out compared to other test frameworks. We do a live demo while implementing several main test scenarios using Jest - get ready to code along!

Domain Driven Testing: Know What You’re Doing

Dmitry Vinnik

“I tested it how you told me to,” “Requirements say it's expected,” “I assumed it's fine” – these are the common phrases you hear when customer cases come up. Unfortunately, it is nothing unusual in our industry to be detached from customers' actual needs. As a result, teams regularly fail when they prioritize requirements over actual behaviour that the customers expect. This problem of misaligned teams' focus is where Domain Driven Testing (DDT) comes into play. DDT helps developers to put themselves into the customers' shoes and see the product for what it is. This prioritization of the actual behaviour over the mere following of the requirements is what defines Domain Driven Testing. In this talk, we discuss how knowledge of your company's domain (aka, the focus of your business) can improve your testing practices. We talk about Domain Driven Design techniques, Exploratory Testing, and other methods which emphasize software quality through customers' success. We touch bases on tools you can integrate into your system using Domain Driven Test Pyramid, and what common mistakes you should avoid when implementing Domain Driven Testing.

Gauge + Taiko, BDD for Web Revived

Dmitry Vinnik

Does Behaviour Driven Development work? Unfortunately, it usually does not. While many people try to pitch as a way to bridge the gap between stakeholders on the project, many teams fail to communicate their test scenarios with everyone involved. Although this fundamental problem of lack of communication can be solved on the organization level, BDD is often used with Cucumber or Robot frameworks. Due to the complexities of these tools, developers and testers stop seeing the benefit in the entire approach of BDD and abundant the practice. However, recently, Behavior Driven Development has seen a resurgence in adoption, thanks to Gauge framework. With the latest release of Taiko, they create a great combination of communication and testing tool with the use of Gauge+Taiko. In this talk, we will discuss BDD principles and how Gauge can be used to take Behavior Driven Development to the next level. With Taiko, the audience will learn how BDD can be taken to the web in a few easy steps and to see what needs to be avoided when these tools are implemented in any organization.

Mobile Visual Testing: Uphill Battle Of Mobile Visual Regression

All Things Open

Android instant app

Benjamin Cheng

Rendering strategies: Measuring the devil's details in core web vitals - Jam...

Jamie Indigo

Google Glass - An Intro presentation to conduct code lab events.

getdinesh

Productive & easy mobile app dev

Martin de Keijzer

Create Hybrid Mobile Application with Icenium and Kendo UI Mobile

Dhananjay Kumar

I want my process back! #microservices #serverless

camunda services GmbH

We’re slicing and dicing systems into ever-shrinking pieces like microservices or serverless functions. End-to-end processes now often require multiple components to be properly integrated - but of course, without coupling them too tightly. We see many companies slicing up their core business processes in the pursuit of modern architectures and running into unanticipated challenges along the way. Spoiler alert: there’s no magic fix. This keynote will foster your understanding of how workflows can be implemented and monitored in typical microservices architectures. You will gain a better sense of the positives and negatives of different approaches, and I will take you on a journey into how to migrate existing legacy systems to this exciting new (and decoupled) world.

Camunda Con 2019 Keynote - I want my process back #microservices #serverless

Bernd Ruecker

Empowering businesses with serverless

Yan Cui

Serverless technologies allow developers to go faster and do so much more with less. They allow businesses to innovate faster than ever possible before and the pay-per-use pricing model opens up a world of opportunities to improve cost efficiency. Cost optimization is no longer a guessing game, but a surgical operation that can target business areas with the most saving potential based on data. New business models based on pay-per-use will soon disrupt incumbents in established markets and create better value for customers. In this talk, we'll see how businesses around the world are using serverless technologies to drive their success and growth, and the lessons we can learn from them.

Continuous delivery @CD Summit Stockholm

Michael Medin

Unit testing on Android (Droidcon Dubai 2015)

Danny Preussler

Beyond Responsive [Web Design Day]

Aaron Gustafson

Beyond Responsive [Future of Web Design 2015]

Aaron Gustafson

Responsive web design has taken our industry by storm and with good reason; it helps us improve our reach with less effort. However, incorporating responsive design is not the goal, meeting our user’s needs is! Responsive design is not an end in itself… it’s just the beginning. We need to embrace the heterogenous nature of the web - myriad web-enabled devices with vastly different dimensions, screen sizes, networks, and capabilities used by countless individuals, each with their own special needs - and craft experiences that will work anywhere at any time. We need to build robust systems that adapt in ways far beyond aesthetics. If you or your team are responsible for creating interfaces on the web then this workshop is for you. All you’ll need is an open mind and rudimentary drawing skills but if you think better in code whether it's HTML, CSS, and/or Javascript, feel free to bring your laptop (but it’s not essential).

Leadership in Open Source and Why Companies Care

Dmitry Vinnik

In this talk, we will discuss the importance of open source for companies and how to become a leader in the open source space. By contributing to open source projects, companies can establish themselves as thought leaders, build credibility with customers, and increase productivity. Join us to learn how open source can help drive innovation, improve customer satisfaction, and keep companies ahead of the competition.

Maximizing React Speed: Hands-On Guide to Debugging and Optimizing React Appl...

Dmitry Vinnik

Similar to Uphill Battle of Mobile Visual Regression

Hands on React Native: From Zero to Hero

Dmitry Vinnik

Modern Web Testing: Going Beyond Selenium

Dmitry Vinnik

Testing Svelte with Jest: Validate Your Components Quickly!

Dmitry Vinnik

Back to the CompletableFuture: Concurrency in Action

Dmitry Vinnik

Testing React with Jest: Validate Your Components Quickly!

Dmitry Vinnik

Domain Driven Testing: Know What You’re Doing

Dmitry Vinnik

Gauge + Taiko, BDD for Web Revived

Dmitry Vinnik

Mobile Visual Testing: Uphill Battle Of Mobile Visual Regression

All Things Open

Android instant app

Benjamin Cheng

Rendering strategies: Measuring the devil's details in core web vitals - Jam...

Jamie Indigo

Google Glass - An Intro presentation to conduct code lab events.

getdinesh

Productive & easy mobile app dev

Martin de Keijzer

Create Hybrid Mobile Application with Icenium and Kendo UI Mobile

Dhananjay Kumar

I want my process back! #microservices #serverless

camunda services GmbH

Camunda Con 2019 Keynote - I want my process back #microservices #serverless

Bernd Ruecker

Empowering businesses with serverless

Yan Cui

Continuous delivery @CD Summit Stockholm

Michael Medin

Unit testing on Android (Droidcon Dubai 2015)

Danny Preussler

Beyond Responsive [Web Design Day]

Aaron Gustafson

Beyond Responsive [Future of Web Design 2015]

Aaron Gustafson

Similar to Uphill Battle of Mobile Visual Regression (20)

Hands on React Native: From Zero to Hero

Modern Web Testing: Going Beyond Selenium

Testing Svelte with Jest: Validate Your Components Quickly!

Back to the CompletableFuture: Concurrency in Action

Testing React with Jest: Validate Your Components Quickly!

Domain Driven Testing: Know What You’re Doing

Gauge + Taiko, BDD for Web Revived

Mobile Visual Testing: Uphill Battle Of Mobile Visual Regression

Android instant app

Rendering strategies: Measuring the devil's details in core web vitals - Jam...

Google Glass - An Intro presentation to conduct code lab events.

Productive & easy mobile app dev

Create Hybrid Mobile Application with Icenium and Kendo UI Mobile

I want my process back! #microservices #serverless

Camunda Con 2019 Keynote - I want my process back #microservices #serverless

Empowering businesses with serverless

Continuous delivery @CD Summit Stockholm

Unit testing on Android (Droidcon Dubai 2015)

Beyond Responsive [Web Design Day]

Beyond Responsive [Future of Web Design 2015]

More from Dmitry Vinnik

Leadership in Open Source and Why Companies Care

Dmitry Vinnik

Maximizing React Speed: Hands-On Guide to Debugging and Optimizing React Appl...

Dmitry Vinnik

Cross-Platform CSS (Yes, it's Possible!) with Yoga

Dmitry Vinnik

It's no secret that people view the same website across many devices, browsers, and screen sizes. To make the same app work on all these platforms, developers have to spend a significant amount of time. If only there were an engine that allows web developers to write their code once and use it everywhere. Presenting Yoga, an open source, cross-platform layout engine that uses CSS layouts to manage user interfaces across platforms. In this talk, we learn about Yoga's main concepts and use-cases. Then, we will build a demo app for React Native and Android to showcase the reusability of Yoga.

Documentation Made Easy with Docusaurus

Dmitry Vinnik

Do you know how to get someone to do something difficult? Make it easy! Documentation is one of those things: everyone understands it's important, but few want to write it. And if the docs platform is difficult to use or extend, doc writing becomes a punishment. Docusaurus is here to help! In this session, we will walk through getting started with Docusaurus, its architecture and MDX support. We will explore built-in themes with plugins, and even create one during the talk. So, let's learn how to make doc writing enjoyable, together!

Fixing Broken Windows: Dealing with Legacy Systems, Poor Quality and Gaps

Dmitry Vinnik

We all encountered a “Broken Window” theory in practice. The original idea was that if someone breaks a window in a neighborhood and this window is not repaired right away, the entire area will start getting messier at an accelerated rate. The same theory is also true for Software Development. How many times have you looked at a legacy system with no code coverage, and decided not to write any tests because "this is how we do things here"? These bad practices behave just like those "Broken Windows." They cause our code to degrade and become unusable. In this talk, we discuss how to break away from bad development practices and how to address significant gaps in your legacy and current systems. We look at ways to lead by example successfully and introduce refactoring culture into your team and organization. We cover tips and tricks that help improve the development culture and emphasize the codebase's general health.

Ent: Making Data Easy in Go

Dmitry Vinnik

What do most applications do these days? They interact with data in one way or another. As your app’s scale increases, it becomes more challenging to manage databases, schemas, queries, and constraints. These challenges are why a technique called Object-Relational Mapping, or ORM, was created. At Meta, we tend to think about data modeling in graph concepts and as we were working with Go, it led us to create a new open source project, Ent. Ent is an entity framework built for Go programming language. This framework provides developers with a Graph-based, Object Relational Mapping. In this talk, we will learn how to use Ent when dealing with data schemas, including types, relations and constraints. It’s a hands-on talk, so get ready to follow along!

The 10,000 Steps of Open Source Project Health

Dmitry Vinnik

Human health is complex - it's not something we can buy; it's something we have to earn! This exact approach goes for open source projects and their communities. A truly dedicated and loyal fanbase cannot be bought; it has to be nurtured. But what do we mean when we call a community and the open source project "healthy"? This question is what we are trying to answer at Facebook! In this talk, we will look at the approach that the Facebook Open Source team takes to measure the current state of Facebook open source projects, and how we use these metrics to prioritize and to direct our DevRel focus. Ultimately, we aim to show how by looking at information about your open source communities, your team can concentrate on the quality of the projects instead of only the quantity of repositories that you make public.

Better Start: Enforcing Best Engineering Practices with Kotlin

Dmitry Vinnik

As Developers, we are getting lazy! With amazing IDEs and plugins we use on a daily basis, we let these tools do the most important job for a Software Project – ensure maintainability of the codebase. These tools with static analysis, formatters and styleguides keep our code clean and readable while we can focus on making the application to work. Despite this abstraction of styling and duplication detection, we, as Software Engineers, are still responsible to keep in mind best practices like DRY, KISS, YAGNI, and many more. While IDEs are great at detecting basic mistakes, we still need to choose the best possible solution among variety of solutions. In this talk, we will look at Kotlin as a way to enforce best Software Engineering practices on the language-level. We will see how Kotlin by limiting verbosity, by using private data classes, extension functions and many other functionalities, allow for more flexible and maintainable codebase. The main goal of this talk is to convince you that Kotlin is a great way to bring years of experience of using best practices to a first-year university student, or to a long-time Java veteran.

Developing Lightning Components for Communities.pptx

Dmitry Vinnik

Remote Work: Gateway to Freedom

Dmitry Vinnik

Kindness Engineering: Focusing on What Matters

Dmitry Vinnik

Stress Driven Development, and How to Avoid It

Dmitry Vinnik

When was the last time you took a day off? How many times this week have you worked overtime? These questions are related to one thing we all experience on a daily basis - stress. Employees who are trapped by their routine to "deliver business value at all cost", often forget to take care of themselves. Unfortunately, this work-related stress affects our loved ones too, because work-life balance that we all hear about, usually means work-life stress. What if I were to say that it does not have to be this way? In this talk, we discuss ways how to relax and avoid "Stress Driven Development." We deep dive into common stressors, and draft a comprehensive guide to removing stress at work and in our personal lives.

Build Tests to Build Websites

Dmitry Vinnik

Technologies like Squarespace, Salesforce, WordPress, or WIX are extremely popular for those who want to create a working website without necessary developer knowledge. In this talk, I would explore how Salesforce uses Page Object Model patterns to test its Communities platform which is used to develop websites for Salesforce users. Throughout the talk, we will explore how multi-frame platform can be directly mapped to POM for Selenium Webdriver, and how client side code is developed to support this pattern. The importance and complexity of these test framework is that it needs to be applicable for both platform and produced websites. Recording: https://youtu.be/6opoooLdonI

More from Dmitry Vinnik (13)

Leadership in Open Source and Why Companies Care

Maximizing React Speed: Hands-On Guide to Debugging and Optimizing React Appl...

Cross-Platform CSS (Yes, it's Possible!) with Yoga

Documentation Made Easy with Docusaurus

Fixing Broken Windows: Dealing with Legacy Systems, Poor Quality and Gaps

Ent: Making Data Easy in Go

The 10,000 Steps of Open Source Project Health

Better Start: Enforcing Best Engineering Practices with Kotlin

Developing Lightning Components for Communities.pptx

Remote Work: Gateway to Freedom

Kindness Engineering: Focusing on What Matters

Stress Driven Development, and How to Avoid It

Build Tests to Build Websites

Recently uploaded

AI Pilot Review: The World’s First Virtual Assistant Marketing Suite

Google

AI Pilot Review: The World’s First Virtual Assistant Marketing Suite 👉👉 Click Here To Get More Info 👇👇 https://sumonreview.com/ai-pilot-review/ AI Pilot Review: Key Features ✅Deploy AI expert bots in Any Niche With Just A Click ✅With one keyword, generate complete funnels, websites, landing pages, and more. ✅More than 85 AI features are included in the AI pilot. ✅No setup or configuration; use your voice (like Siri) to do whatever you want. ✅You Can Use AI Pilot To Create your version of AI Pilot And Charge People For It… ✅ZERO Manual Work With AI Pilot. Never write, Design, Or Code Again. ✅ZERO Limits On Features Or Usages ✅Use Our AI-powered Traffic To Get Hundreds Of Customers ✅No Complicated Setup: Get Up And Running In 2 Minutes ✅99.99% Up-Time Guaranteed ✅30 Days Money-Back Guarantee ✅ZERO Upfront Cost See My Other Reviews Article: (1) TubeTrivia AI Review: https://sumonreview.com/tubetrivia-ai-review (2) SocioWave Review: https://sumonreview.com/sociowave-review (3) AI Partner & Profit Review: https://sumonreview.com/ai-partner-profit-review (4) AI Ebook Suite Review: https://sumonreview.com/ai-ebook-suite-review

Large Language Models and the End of Programming

Matt Welsh

Cracking the code review at SpringIO 2024

Paco van Beckhoven

Code reviews are vital for ensuring good code quality. They serve as one of our last lines of defense against bugs and subpar code reaching production. Yet, they often turn into annoying tasks riddled with frustration, hostility, unclear feedback and lack of standards. How can we improve this crucial process? In this session we will cover: - The Art of Effective Code Reviews - Streamlining the Review Process - Elevating Reviews with Automated Tools By the end of this presentation, you'll have the knowledge on how to organize and improve your code review proces

OpenMetadata Community Meeting - 5th June 2024

OpenMetadata

The OpenMetadata Community Meeting was held on June 5th, 2024. In this meeting, we discussed about the data quality capabilities that are integrated with the Incident Manager, providing a complete solution to handle your data observability needs. Watch the end-to-end demo of the data quality features. * How to run your own data quality framework * What is the performance impact of running data quality frameworks * How to run the test cases in your own ETL pipelines * How the Incident Manager is integrated * Get notified with alerts when test cases fail Watch the meeting recording here - https://www.youtube.com/watch?v=UbNOje0kf6E

AI Genie Review: World’s First Open AI WordPress Website Creator

Google

AI Genie Review: World’s First Open AI WordPress Website Creator 👉👉 Click Here To Get More Info 👇👇 https://sumonreview.com/ai-genie-review AI Genie Review: Key Features ✅Creates Limitless Real-Time Unique Content, auto-publishing Posts, Pages & Images directly from Chat GPT & Open AI on WordPress in any Niche ✅First & Only Google Bard Approved Software That Publishes 100% Original, SEO Friendly Content using Open AI ✅Publish Automated Posts and Pages using AI Genie directly on Your website ✅50 DFY Websites Included Without Adding Any Images, Content Or Doing Anything Yourself ✅Integrated Chat GPT Bot gives Instant Answers on Your Website to Visitors ✅Just Enter the title, and your Content for Pages and Posts will be ready on your website ✅Automatically insert visually appealing images into posts based on keywords and titles. ✅Choose the temperature of the content and control its randomness. ✅Control the length of the content to be generated. ✅Never Worry About Paying Huge Money Monthly To Top Content Creation Platforms ✅100% Easy-to-Use, Newbie-Friendly Technology ✅30-Days Money-Back Guarantee See My Other Reviews Article: (1) TubeTrivia AI Review: https://sumonreview.com/tubetrivia-ai-review (2) SocioWave Review: https://sumonreview.com/sociowave-review (3) AI Partner & Profit Review: https://sumonreview.com/ai-partner-profit-review (4) AI Ebook Suite Review: https://sumonreview.com/ai-ebook-suite-review #AIGenieApp #AIGenieBonus #AIGenieBonuses #AIGenieDemo #AIGenieDownload #AIGenieLegit #AIGenieLiveDemo #AIGenieOTO #AIGeniePreview #AIGenieReview #AIGenieReviewandBonus #AIGenieScamorLegit #AIGenieSoftware #AIGenieUpgrades #AIGenieUpsells #HowDoesAlGenie #HowtoBuyAIGenie #HowtoMakeMoneywithAIGenie #MakeMoneyOnline #MakeMoneywithAIGenie

Atelier - Innover avec l’IA Générative et les graphes de connaissances

Neo4j

Atelier - Innover avec l’IA Générative et les graphes de connaissances Allez au-delà du battage médiatique autour de l’IA et découvrez des techniques pratiques pour utiliser l’IA de manière responsable à travers les données de votre organisation. Explorez comment utiliser les graphes de connaissances pour augmenter la précision, la transparence et la capacité d’explication dans les systèmes d’IA générative. Vous partirez avec une expérience pratique combinant les relations entre les données et les LLM pour apporter du contexte spécifique à votre domaine et améliorer votre raisonnement. Amenez votre ordinateur portable et nous vous guiderons sur la mise en place de votre propre pile d’IA générative, en vous fournissant des exemples pratiques et codés pour démarrer en quelques minutes.

Lecture 1 Introduction to games development

abdulrafaychaudhry

E-commerce Application Development Company.pdf

Hornet Dynamics

Quarkus Hidden and Forbidden Extensions

Max Andersen

openEuler Case Study - The Journey to Supply Chain Security

Shane Coughlan

Text-Summarization-of-Breaking-News-Using-Fine-tuning-BART-Model.pptx

ShamsuddeenMuhammadA

BoxLang: Review our Visionary Licenses of 2024

Ortus Solutions, Corp

Vitthal Shirke Java Microservices Resume.pdf

Vitthal Shirke

Globus Compute wth IRI Workflows - GlobusWorld 2024

Globus

As part of the DOE Integrated Research Infrastructure (IRI) program, NERSC at Lawrence Berkeley National Lab and ALCF at Argonne National Lab are working closely with General Atomics on accelerating the computing requirements of the DIII-D experiment. As part of the work the team is investigating ways to speedup the time to solution for many different parts of the DIII-D workflow including how they run jobs on HPC systems. One of these routes is looking at Globus Compute as a way to replace the current method for managing tasks and we describe a brief proof of concept showing how Globus Compute could help to schedule jobs and be a tool to connect compute at different facilities.

Custom Healthcare Software for Managing Chronic Conditions and Remote Patient...

Mind IT Systems

GOING AOT WITH GRAALVM FOR SPRING BOOT (SPRING IO)

Alina Yurenko

Pro Unity Game Development with C-sharp Book

abdulrafaychaudhry

Innovating Inference - Remote Triggering of Large Language Models on HPC Clus...

Globus

Large Language Models (LLMs) are currently the center of attention in the tech world, particularly for their potential to advance research. In this presentation, we'll explore a straightforward and effective method for quickly initiating inference runs on supercomputers using the vLLM tool with Globus Compute, specifically on the Polaris system at ALCF. We'll begin by briefly discussing the popularity and applications of LLMs in various fields. Following this, we will introduce the vLLM tool, and explain how it integrates with Globus Compute to efficiently manage LLM operations on Polaris. Attendees will learn the practical aspects of setting up and remotely triggering LLMs from local machines, focusing on ease of use and efficiency. This talk is ideal for researchers and practitioners looking to leverage the power of LLMs in their work, offering a clear guide to harnessing supercomputing resources for quick and effective LLM inference.

A Study of Variable-Role-based Feature Enrichment in Neural Models of Code

Aftab Hussain

Understanding variable roles in code has been found to be helpful by students in learning programming -- could variable roles help deep neural models in performing coding tasks? We do an exploratory study. - These are slides of the talk given at InteNSE'23: The 1st International Workshop on Interpretability and Robustness in Neural Software Engineering, co-located with the 45th International Conference on Software Engineering, ICSE 2023, Melbourne Australia

Introducing Crescat - Event Management Software for Venues, Festivals and Eve...

Crescat

Crescat is industry-trusted event management software, built by event professionals for event professionals. Founded in 2017, we have three key products tailored for the live event industry. Crescat Event for concert promoters and event agencies. Crescat Venue for music venues, conference centers, wedding venues, concert halls and more. And Crescat Festival for festivals, conferences and complex events. With a wide range of popular features such as event scheduling, shift management, volunteer and crew coordination, artist booking and much more, Crescat is designed for customisation and ease-of-use. Over 125,000 events have been planned in Crescat and with hundreds of customers of all shapes and sizes, from boutique event agencies through to international concert promoters, Crescat is rigged for success. What's more, we highly value feedback from our users and we are constantly improving our software with updates, new features and improvements. If you plan events, run a venue or produce festivals and you're looking for ways to make your life easier, then we have a solution for you. Try our software for free or schedule a no-obligation demo with one of our product specialists today at crescat.io

Recently uploaded (20)

AI Pilot Review: The World’s First Virtual Assistant Marketing Suite

Large Language Models and the End of Programming

Cracking the code review at SpringIO 2024

OpenMetadata Community Meeting - 5th June 2024

AI Genie Review: World’s First Open AI WordPress Website Creator

Atelier - Innover avec l’IA Générative et les graphes de connaissances

Lecture 1 Introduction to games development

E-commerce Application Development Company.pdf

Quarkus Hidden and Forbidden Extensions

openEuler Case Study - The Journey to Supply Chain Security

Text-Summarization-of-Breaking-News-Using-Fine-tuning-BART-Model.pptx

BoxLang: Review our Visionary Licenses of 2024

Vitthal Shirke Java Microservices Resume.pdf

Globus Compute wth IRI Workflows - GlobusWorld 2024

Custom Healthcare Software for Managing Chronic Conditions and Remote Patient...

GOING AOT WITH GRAALVM FOR SPRING BOOT (SPRING IO)

Pro Unity Game Development with C-sharp Book

Innovating Inference - Remote Triggering of Large Language Models on HPC Clus...

A Study of Variable-Role-based Feature Enrichment in Neural Models of Code

Introducing Crescat - Event Management Software for Venues, Festivals and Eve...

Uphill Battle of Mobile Visual Regression

1. Uphill Battle Of Mobile Visual Regression Dmitry Vinnik @DmitryVinnik dvinnik.com

2. What are our goals? @DmitryVinnik dvinnik.com

3. Goals Visual Testing (VT): What, Why, How and When New Perspective on Test Pyramid Find VT Tool For Your Team

4. Target Platforms? @DmitryVinnik dvinnik.com

5. Target Platforms iOS Android Responsive Apps Hybrid Apps @DmitryVinnik dvinnik.com

6. Let’s see some dataBut “Mobile” is so broad Android iOS

7. How do we organize QA Effort? @DmitryVinnik dvinnik.com

8. From the Top Level @DmitryVinnik dvinnik.com

9. Testing Quadrants @DmitryVinnik dvinnik.com

10. Agile Testing Quadrants by Lisa Crispin and Janet Gregory @DmitryVinnik dvinnik.com

11. Let’s go in more details @DmitryVinnik dvinnik.com

12. How do we usually test? @DmitryVinnik dvinnik.com

13. @DmitryVinnik Test Pyramid ↑ Fidelity ↓ Speed ↑ Cost ↓ Fidelity ↑ Speed ↓ Cost dvinnik.com

14. Let’s try get more practical @DmitryVinnik dvinnik.com

15. Is anyone thirsty? @DmitryVinnik dvinnik.com

16. Pour Drink Drinking Glass @DmitryVinnik dvinnik.com

17. Test Pyramid & Drinking Glass Pour Drink Unit Integration E2E @DmitryVinnik dvinnik.com

18. Are we done? @DmitryVinnik dvinnik.com

19. Not really... @DmitryVinnik dvinnik.com

20. Pour Drink Drinking Glass @DmitryVinnik dvinnik.com

21. Pour Drink @DmitryVinnik dvinnik.com Unit Integration E2E Test Pyramid & Drinking Glass

22. What are we missing? @DmitryVinnik dvinnik.com

23. What are we missing? Same Functionally Different Visually UX UX @DmitryVinnik dvinnik.com

24. Visual Testing Visual Content Page Layout Visual Animation Responsive Design @DmitryVinnik dvinnik.com

25. Functional Manual Testing is Difficult @DmitryVinnik dvinnik.com

26. Visual Manual Testing is Nearly Impossible @DmitryVinnik dvinnik.com

27. A Little Bit of Science @DmitryVinnik dvinnik.com

28. A Little Bit of Science @DmitryVinnik dvinnik.com

29. Conclusion? @DmitryVinnik dvinnik.com

30. Visual Testing requires Automation @DmitryVinnik dvinnik.com

31. But! @DmitryVinnik dvinnik.com

32. On Every Level! @DmitryVinnik dvinnik.com

33. @DmitryVinnik Test Pyramid ↑ Fidelity ↓ Speed ↑ Cost ↓ Fidelity ↑ Speed ↓ Cost dvinnik.com

34. Remember the Title? @DmitryVinnik dvinnik.com

35. Uphill Battle Of Mobile Visual Regression @DmitryVinnik dvinnik.com

36. Uphill Battle @DmitryVinnik dvinnik.com

37. Test Pyramid Test Hill Test Mountain @DmitryVinnik dvinnik.com

38. @DmitryVinnik Visual Test Mountain dvinnik.com

39. @DmitryVinnik Visual Test Mountain ↓ Fidelity ↑ Speed ↓ Cost ↑ Fidelity ↓ Speed ↑ Cost dvinnik.com

40. Let’s Start Our Climb! @DmitryVinnik dvinnik.com

41. CSS/DOM Tests @DmitryVinnik dvinnik.com

42. Testing Demos Responsive App Hybrid App Android iOSAndroid iOS @DmitryVinnik dvinnik.com

43. Demo Time: Snapshot Testing @DmitryVinnik dvinnik.com

44. Is it enough? @DmitryVinnik dvinnik.com

45. No! @DmitryVinnik dvinnik.com

46. Let me show you why @DmitryVinnik dvinnik.com

47. Quick Glance: Responsive Design in Action @DmitryVinnik dvinnik.com

48. Solution? @DmitryVinnik dvinnik.com

49. Visual Component Testing @DmitryVinnik dvinnik.com

50. Let’s Step Back First @DmitryVinnik dvinnik.com

51. Component Driven Development Reusable Composable Encapsulated Semantic @DmitryVinnik dvinnik.com

52. CDD in Practice @DmitryVinnik dvinnik.com

53. Storybook Library Testing Ground Styleguide IDE @DmitryVinnik dvinnik.com

54. Quick Glance: Storybook @DmitryVinnik dvinnik.com

55. Visual Component Testing @DmitryVinnik dvinnik.com

56. Testing Demos Responsive App Hybrid App Android iOS @DmitryVinnik dvinnik.com

57. Screenshot Testing Action Driver View Loader Comparison Driver @DmitryVinnik dvinnik.com

58. PhantomCSS @DmitryVinnik dvinnik.com

59. Demo Time: PhantomCSS @DmitryVinnik dvinnik.com

60. BackstopJS @DmitryVinnik dvinnik.com

61. BackstopJS @DmitryVinnik dvinnik.com

62. BackstopJS @DmitryVinnik dvinnik.com

63. BackstopJS @DmitryVinnik dvinnik.com

64. BackstopJS @DmitryVinnik dvinnik.com

65. BackstopJS @DmitryVinnik dvinnik.com

66. BackstopJS

67. Screenshot Testing: Native Action Driver View Loader Comparison Driver@DmitryVinnik dvinnik.com

68. Screenshot Testing: Native Android screenshot-tests-for-android iOS ios-snapshot-test-caseiOS ios-snapshot-test-case @DmitryVinnik dvinnik.com

69. Demo Time: Screenshot Testing Android @DmitryVinnik dvinnik.com

70. Enterprise Screener.io Flawlessapp.io Chromatic Percy.io @DmitryVinnik dvinnik.com

71. Best Practices Screenshot Names Component Testing First Git Media Standard Test Pyramid @DmitryVinnik dvinnik.com

72. Summary DOM/CSS Not Enough Dev = Test Choose Solution Build Solution @DmitryVinnik dvinnik.com

73. Page Visual Tests @DmitryVinnik dvinnik.com

74. Responsive Testing Window Size Transition States DOM/CSS Screenshots @DmitryVinnik dvinnik.com

75. Demo Time: Responsive Testing with Selenium @DmitryVinnik dvinnik.com

76. Demo Time: Native Visual Testing with Appium & Applitools @DmitryVinnik dvinnik.com

77. Enterprise Applitools BrowserStack SauceLabs TestObjectSauceLabs @DmitryVinnik dvinnik.com

78. Summit @DmitryVinnik dvinnik.com

79. Summit You+ @DmitryVinnik dvinnik.com

80. Call For Action Start the Climb Visual Unit Tests Visual Component Tests Visual Page Tests @DmitryVinnik dvinnik.com

81. Q/A @DmitryVinnik dvinnik.com

82. About Speaker Twitter: @DmitryVinnik Blog: dvinnik.com LinkedIn: in/dmitry-vinnik/ Email: dmitry@dvinnik.com

Editor's Notes

All code is available along with slides
We will talk about: Tools from demonstration and conceptual perspective (all code is available along with links to the tools) Focus on Automation and less on Enterprise tools
We will talk about: Tools from demonstration and conceptual perspective (all code is available along with links to the tools) Focus on Automation and less on Enterprise tools
Few words about responsive apps (react) and hybrid apps (react native) Credit: Designed by Freepik, https://www.freepik.com/free-vector/technological-devices-design_953322.htm
Few words about responsive apps (react) and hybrid apps (react native) Credit: Designed by Freepik, https://www.freepik.com/free-vector/technological-devices-design_953322.htm
Data: Android: 76.53% iOS: 18.97% Windows: 0.49% Reference: http://gs.statcounter.com/os-market-share/mobile/worldwide/#monthly-201305-201805
Start with something we already know *Focus on Left Side
Start with something we already know *Focus on Left Side Reference: “Agile Testing: A Practical Guide for Testers and Agile Teams”, by Lisa Crispin and Janet Gregory
Explain width is #tests
Question to ask: does it function? This is the focus
Question to ask: does it function? This is the focus
Is it actual Test Pyramid?
Is it actual Test Pyramid?
Ultimately will break us
Ultimately will break us
References: Spatiotemporal Sensitivity and Visual Attention for Efficient Rendering of Dynamic Environments, http://pdiff.sourceforge.net/ypg01.pdf Change Blindness: Implications for the Nature of Visual Attention, https://www2.psych.ubc.ca/~rensink/publications/download/Vision&Attention-RR.pdf
References: Spatiotemporal Sensitivity and Visual Attention for Efficient Rendering of Dynamic Environments, http://pdiff.sourceforge.net/ypg01.pdf Change Blindness: Implications for the Nature of Visual Attention, https://www2.psych.ubc.ca/~rensink/publications/download/Vision&Attention-RR.pdf
Explain width is #tests
Show responsive aspect of the application: Three dimensions: Desktop: > 367px In Between: 375px Mobile: <374
Main Focus: on Hybrid and Responsive Apps Maybe add more css testing
Demonstrate react app iin between states
Demonstrate react app iin between states
Demonstrate react app iin between states
Main Focus: on Hybrid and Responsive Apps Maybe add more css testing
From the start, showing best practice of modularization
Aka, Pattern Libraries; Component Based Development Real encapsulation, self documenting
Reiterate 4 principles of CDD
See http://airbnb.io/react-dates
From the start, showing best practice of modularization This is where you spend most of your time -> hence, spending most of the talk on it
Show responsive aspect of the application: Three dimensions: Desktop: > 367px In Between: 375px Mobile: <374
Calculator Demo
Another one, differencify
If interested in ios, please see github gradle screenshotTests
screenshot-tests-for-android
Screener Flawless app iOS specific Very simple and inexpensive solution Chromatic Cloud-based CI Storybook
FakerJS
Go to HybridAppCssTest Show Before/After methods Show Desktop dimensions Show Mobile dimensions Show in between Highlight how it is missing the point without screenshot validation
Will be sharing slides, github and useful links

Uphill Battle of Mobile Visual Regression

Recommended

Recommended

More Related Content

Similar to Uphill Battle of Mobile Visual Regression

Similar to Uphill Battle of Mobile Visual Regression (20)

More from Dmitry Vinnik

More from Dmitry Vinnik (13)

Recently uploaded

Recently uploaded (20)

Uphill Battle of Mobile Visual Regression

Editor's Notes