Slide deck for my SeleniumConf 2015 presentation "Automating for the Second Screen with WebdriverJS". Presented on September 9, 2015 in Portland.
Video: https://www.youtube.com/watch?v=bKsWizTTDOA
Breaking the Server-Client Divide with Node.js and ReactDejan Glozic
Rendering Web applications server or client side has been a war for years, with server side proponents citing 'speed to glass' and SEO, and client side boasting speed of transitions after the upfront cost, and desktop-like application feel. For a while it was necessary to pick sides, that is until React. In this talk, I will show a stack we are using in IBM Cloud Data Services that uses Node.js and React to bring the best of both worlds in isomorphic apps. Server or client? Yes!
IBM and Node.js - Old Doge, New TricksDejan Glozic
The document discusses IBM's transition from older enterprise stacks like Java and SQL to newer technologies like Node.js, NoSQL, and microservices. It describes motivations for the change like yearly release cycles, large teams, and running products on-premise. It then covers specifics of the transition, including moving from Dojo/Dijit to jQuery/Bootstrap on the client side, using Node.js and WebSockets for real-time updates, adopting a microservices architecture, switching from SQL to NoSQL databases, and addressing challenges that arise from the new approaches.
Telling Tales and Solving Crimes with New RelicJames Ford
New Relic provides application performance monitoring that enables a company to quickly detect and resolve issues with their website. This is demonstrated through two case studies:
In the first case, New Relic detected JavaScript errors on the live site caused by some corporate networks blocking content from CDNs. This allowed the issue to be identified and resolved without any user reports.
In the second case, New Relic provided advance warning of high server load before a crash occurred. This allowed the DevOps team to begin resolving the issue before any downtime. When the server did crash, New Relic instantly alerted support. The server was rebooted within 29 minutes, resolving the issue faster than arranging meetings about the downtime.
This document introduces ReactJS, a JavaScript library for building user interfaces. It discusses key React concepts like the virtual DOM, which is a JavaScript representation of real DOM elements that allows React to efficiently update the real DOM by comparing it to a new virtual DOM. It also covers one-way data binding in React, where data flows from parent to child components through props, while events flow in the opposite direction. Finally, it emphasizes that in React, everything is a component, and components manage their own state and receive immutable props from parent components.
ReactJS.NET - Fast and Scalable Single Page ApplicationsRick Beerendonk
Introducing Facebook's React and ReactJS.NET @ Microsoft's TechDays 2015 in The Netherlands.
Is the HTML of your SPA also filled with unmaintainable semi code? Is data binding performance causing you headaches? Don’t you remember how data finds its way to the UI? Let's React! There is a new functional approach to tackle traditional complexities in JavaScript: ReactJS (open source). Maligned in 2013, embraced in 2015 by the largest websites in the world. Let's build fast components in a lasting and meaningful way. This session is a full introduction to the React JavaScript library, its virtual DOM and synthetic events. ReactJS.NET for ASP.NET MVC (and OWIN) will be covered as well. With ReactJS.NET your app starts with a server side rendered page, ideal for search engine optimization (SEO). Does your page need to work under IE8? No problem! The best part: You do not have to build your entire site with ReactJS, but you can start with any parts you like. Afterwards this talk you can immediately apply React in your daily work. See http://reactjs.net and http://reactjs.com
This document discusses building robust apps with React.js by avoiding tightly coupled components and focusing on proper data flow. It introduces React.js basics like components, JSX, virtual DOM and one-way data flow. It also covers Flux architecture with unidirectional data flow through stores, dispatcher and actions. The conclusion emphasizes that React.js is about understanding data flow in the app to reduce mistakes and increase immutability.
React Fundamentals - Jakarta JS, Apr 2016Simon Sturmer
This document discusses React fundamentals and why React is a good choice for building user interfaces. It explains that React uses a component-based approach where each component is a pure function of state. This makes the UI easy to reason about and improves testability, performance, and code reuse. It also notes that React uses immutable data structures and re-renders the entire UI when state changes, similar to how server-side rendering works. This avoids issues with directly manipulating the DOM and helps developers build more reliable software faster.
With the release of React 18 we finally get the long awaited concurrent rendering. But how is that going to affect your application? What are the benefits of concurrent rendering in React? What do you need to do to switch to concurrent rendering when you upgrade to React 18? And what if you don’t want or can’t use concurrent rendering yet?
There are some behavior changes you need to be aware of! In this workshop we will cover all of those subjects and more.
Join me with your laptop in this interactive workshop. You will see how easy it is to switch to concurrent rendering in your React application. You will learn all about concurrent rendering, SuspenseList, the startTransition API and more.
https://reactadvanced.com/workshops-3h
Breaking the Server-Client Divide with Node.js and ReactDejan Glozic
Rendering Web applications server or client side has been a war for years, with server side proponents citing 'speed to glass' and SEO, and client side boasting speed of transitions after the upfront cost, and desktop-like application feel. For a while it was necessary to pick sides, that is until React. In this talk, I will show a stack we are using in IBM Cloud Data Services that uses Node.js and React to bring the best of both worlds in isomorphic apps. Server or client? Yes!
IBM and Node.js - Old Doge, New TricksDejan Glozic
The document discusses IBM's transition from older enterprise stacks like Java and SQL to newer technologies like Node.js, NoSQL, and microservices. It describes motivations for the change like yearly release cycles, large teams, and running products on-premise. It then covers specifics of the transition, including moving from Dojo/Dijit to jQuery/Bootstrap on the client side, using Node.js and WebSockets for real-time updates, adopting a microservices architecture, switching from SQL to NoSQL databases, and addressing challenges that arise from the new approaches.
Telling Tales and Solving Crimes with New RelicJames Ford
New Relic provides application performance monitoring that enables a company to quickly detect and resolve issues with their website. This is demonstrated through two case studies:
In the first case, New Relic detected JavaScript errors on the live site caused by some corporate networks blocking content from CDNs. This allowed the issue to be identified and resolved without any user reports.
In the second case, New Relic provided advance warning of high server load before a crash occurred. This allowed the DevOps team to begin resolving the issue before any downtime. When the server did crash, New Relic instantly alerted support. The server was rebooted within 29 minutes, resolving the issue faster than arranging meetings about the downtime.
This document introduces ReactJS, a JavaScript library for building user interfaces. It discusses key React concepts like the virtual DOM, which is a JavaScript representation of real DOM elements that allows React to efficiently update the real DOM by comparing it to a new virtual DOM. It also covers one-way data binding in React, where data flows from parent to child components through props, while events flow in the opposite direction. Finally, it emphasizes that in React, everything is a component, and components manage their own state and receive immutable props from parent components.
ReactJS.NET - Fast and Scalable Single Page ApplicationsRick Beerendonk
Introducing Facebook's React and ReactJS.NET @ Microsoft's TechDays 2015 in The Netherlands.
Is the HTML of your SPA also filled with unmaintainable semi code? Is data binding performance causing you headaches? Don’t you remember how data finds its way to the UI? Let's React! There is a new functional approach to tackle traditional complexities in JavaScript: ReactJS (open source). Maligned in 2013, embraced in 2015 by the largest websites in the world. Let's build fast components in a lasting and meaningful way. This session is a full introduction to the React JavaScript library, its virtual DOM and synthetic events. ReactJS.NET for ASP.NET MVC (and OWIN) will be covered as well. With ReactJS.NET your app starts with a server side rendered page, ideal for search engine optimization (SEO). Does your page need to work under IE8? No problem! The best part: You do not have to build your entire site with ReactJS, but you can start with any parts you like. Afterwards this talk you can immediately apply React in your daily work. See http://reactjs.net and http://reactjs.com
This document discusses building robust apps with React.js by avoiding tightly coupled components and focusing on proper data flow. It introduces React.js basics like components, JSX, virtual DOM and one-way data flow. It also covers Flux architecture with unidirectional data flow through stores, dispatcher and actions. The conclusion emphasizes that React.js is about understanding data flow in the app to reduce mistakes and increase immutability.
React Fundamentals - Jakarta JS, Apr 2016Simon Sturmer
This document discusses React fundamentals and why React is a good choice for building user interfaces. It explains that React uses a component-based approach where each component is a pure function of state. This makes the UI easy to reason about and improves testability, performance, and code reuse. It also notes that React uses immutable data structures and re-renders the entire UI when state changes, similar to how server-side rendering works. This avoids issues with directly manipulating the DOM and helps developers build more reliable software faster.
With the release of React 18 we finally get the long awaited concurrent rendering. But how is that going to affect your application? What are the benefits of concurrent rendering in React? What do you need to do to switch to concurrent rendering when you upgrade to React 18? And what if you don’t want or can’t use concurrent rendering yet?
There are some behavior changes you need to be aware of! In this workshop we will cover all of those subjects and more.
Join me with your laptop in this interactive workshop. You will see how easy it is to switch to concurrent rendering in your React application. You will learn all about concurrent rendering, SuspenseList, the startTransition API and more.
https://reactadvanced.com/workshops-3h
This document outlines a Reactjs workshop covering an introduction to Reactjs, its core concepts, and coding with Reactjs. The workshop introduces Reactjs as a library for building user interfaces, discusses its core concepts including components, virtual DOM, JSX, state and props, and demonstrates how to install and start coding with Reactjs. The document provides resources for further learning Reactjs.
The document outlines a React workshop covering what React is, its core concepts, and coding with React. It begins with an introduction and overview of React. It then covers key React concepts like components, the virtual DOM, JSX, state and props. Finally, it demonstrates how to start coding with React by rendering a component, using state, and working with forms. Resources for further learning are also provided at the end.
The document discusses building high performance web applications with Preact. It introduces Preact as a fast and lightweight alternative to React, highlighting its small file size and ability to run React components with minimal changes. It also covers the PRPL pattern for progressive web apps, which pushes critical resources, renders the initial route, pre-caches remaining routes, and lazily loads remaining routes for optimal performance.
React is a JavaScript library for building user interfaces. It was created by Facebook and is best for building dynamic websites like chat applications. React uses a virtual DOM for efficiently updating the view after data changes. Components are the building blocks of React and can contain state and props. The document provides an example of a simple component class and demonstrates how to add state and props. It also includes links to example code and MicroPyramid's social media profiles.
This document provides an introduction and overview of ReactJS. It discusses that React is a JavaScript library developed by Facebook and Instagram for building user interfaces. It introduces key React concepts like components, props, state, lifecycles, and differences between imperative and declarative programming. It also covers setting up a basic React project using tools like Webpack and Babel and references additional React resources.
This document provides an introduction to React, a JavaScript library for building user interfaces. It discusses React's fundamentals like components and unidirectional data flow. It also covers topics like JSX, props, state, lifecycles, and demos creating a component. The document aims to explain what React is, its core concepts, and how to get started using it to build user interfaces.
This document introduces React, describing it as a JavaScript library for building user interfaces by rendering components rather than mutating the DOM directly. It discusses how React uses a virtual DOM for fast re-rendering, building components instead of templates, and the use of JSX syntax to write HTML-like code. Components have state and props, and the whole app re-renders when state changes to guarantee updates.
The document introduces Meteor JS, a framework for building cutting-edge web applications using JavaScript across all tiers. It discusses key Meteor principles like data on the wire and latency compensation. It also covers getting started with Meteor, including installing it and creating a demo application, as well as hosting Meteor apps in production.
Angry Developer: Creating a Game in QML and JavaScript for MeeGo N9 @iRajLalRaj Lal
The document discusses creating a game called "Angry Developer" using Qt Quick. It describes using QML files and images for the cutting edge UI, JavaScript bindings to add logic and interactivity, and putting the pieces together into a playable game. Key aspects covered include using QML elements and state changes to control gameplay, JavaScript timers to handle random movement and hit/miss detection, and binding JavaScript logic to the QML UI. The document promotes Qt Quick as an easy way to build rich mobile apps by combining declarative QML and JavaScript.
The Perks and Perils of the Singleton Design PatternBADR
Singleton design pattern is on the most famous and used design patterns. It's also a source of endless debates between software engineers! In this session, we discuss the perks and perils of the singleton design patters.
WordCamp Milwaukee - Stop eating resources and optimize your WordPress siteJeff Matson
This document discusses how to optimize a WordPress site to reduce resource usage and improve performance. It recommends removing unnecessary content, compressing images, minifying CSS and JavaScript, caching content aggressively using both server-side and client-side caching, and using content delivery networks. Real-world examples show how these techniques can improve page load times and reduce server load, allowing the site to handle more active visitors before performance degrades. Varnish caching in particular is highlighted as very effective at improving performance.
A short talk about javascript frameworks of the future. React has been with us for a long time now, and while it's an amazing technology, there are already some first clues as to where we might go from here.
This document discusses React.js best practices. It covers keynote speakers at React.js Conf 2016 who discussed React.js being more than a library and an emerging ecosystem. It also summarizes React features like being declarative, using virtual DOM and JSX, and being component-based. Additionally, it discusses related technologies like Redux, GraphQL and Relay and how they integrate with React.
This document discusses issues with the npm package manager and introduces Yarn as an alternative that aims to address npm's shortcomings. It notes that Yarn is faster, more reliable, and secure than npm due to features like yarn.lock that lock dependency versions. It also provides concise command comparisons and recommends using Yarn for new projects.
MCE^3 - Konstantin Raev - React Native: Open Source Continuous Build and Deli...PROIDEA
Konstantin is a Web Developer at Facebook who is lucky to work at React Native Open Source team. For the last few years his passions were infrastructure, Continuous Delivery, JavaScript and stable builds. Before joining Facebook he worked at a New Zealand startup www.booktrack.com.
The Web We Weave :: How Web Developers Think About PerformanceOliver Tse
The document discusses how web developers think about performance optimization. It explains that client render time, not page load time, is a more important metric. Page load does not indicate when the full page is visible, as rendering continues after load. The document recommends using tools like Webpagetest and Chrome Timeline to identify opportunities like unused JavaScript that could significantly improve render speed and user experience. Overall performance optimization requires understanding how the browser loads assets and renders pages to target changes that make the largest impact.
Site performance is really about rendering. When, where and how fast your web page or application renders is critical. These provide insights into the member experience. After all, that's the goal - provide a great member experience. Using Webpagetest with help from Chrome's DevTools Timeline, we'll use visualization progression charts and explore this aspect of site performance.
The document provides an introduction and overview of ES6, React, and Redux. It begins with an in-depth section about new features and syntax in ES6, including variable types, arrow functions, modules, classes, and more. It then discusses React, explaining concepts like the virtual DOM, one-way data flow, JSX syntax, props, nested components, conditionals, and state/setState. Finally, it briefly introduces Redux and mentions using React components on the server and in mobile apps with React Native.
Rate Limiting at Scale, from SANS AppSec Las Vegas 2012Nick Galbreath
Rate Limits at Scale SANS AppSec Las Vegas.
Rate Limit Everything All the time using a quantized time system with Memcache or Redis. Use this protect resources or discover anomalies.
Node.JS: Do you know the dependency of your dependencies dependencyWim Selles
A lot of (QA) people are using JavaScript frameworks nowadays, but not everybody knows and understands how the Node.JS ecosystem works. During this talk I'll explain:
- How NodeJS works
- Why you should use NVM instead of a pure NodeJS installation
- The package versioning
- The remark about "there's a package for that"
- How the package-lock.json works
- And many more
MS Cloud Day - Deploying and monitoring windows azure applicationsSpiffy
This document discusses how to deploy and monitor applications on Windows Azure. It covers deploying applications through the Azure portal, Visual Studio, and PowerShell cmdlets. It also discusses upgrading applications using in-place upgrades, VIP swaps, and deleting and recreating deployments. The document reviews monitoring applications using the diagnostic API and visualizing collected data. It also demonstrates installing programs and using startup tasks on Azure roles.
This document outlines a Reactjs workshop covering an introduction to Reactjs, its core concepts, and coding with Reactjs. The workshop introduces Reactjs as a library for building user interfaces, discusses its core concepts including components, virtual DOM, JSX, state and props, and demonstrates how to install and start coding with Reactjs. The document provides resources for further learning Reactjs.
The document outlines a React workshop covering what React is, its core concepts, and coding with React. It begins with an introduction and overview of React. It then covers key React concepts like components, the virtual DOM, JSX, state and props. Finally, it demonstrates how to start coding with React by rendering a component, using state, and working with forms. Resources for further learning are also provided at the end.
The document discusses building high performance web applications with Preact. It introduces Preact as a fast and lightweight alternative to React, highlighting its small file size and ability to run React components with minimal changes. It also covers the PRPL pattern for progressive web apps, which pushes critical resources, renders the initial route, pre-caches remaining routes, and lazily loads remaining routes for optimal performance.
React is a JavaScript library for building user interfaces. It was created by Facebook and is best for building dynamic websites like chat applications. React uses a virtual DOM for efficiently updating the view after data changes. Components are the building blocks of React and can contain state and props. The document provides an example of a simple component class and demonstrates how to add state and props. It also includes links to example code and MicroPyramid's social media profiles.
This document provides an introduction and overview of ReactJS. It discusses that React is a JavaScript library developed by Facebook and Instagram for building user interfaces. It introduces key React concepts like components, props, state, lifecycles, and differences between imperative and declarative programming. It also covers setting up a basic React project using tools like Webpack and Babel and references additional React resources.
This document provides an introduction to React, a JavaScript library for building user interfaces. It discusses React's fundamentals like components and unidirectional data flow. It also covers topics like JSX, props, state, lifecycles, and demos creating a component. The document aims to explain what React is, its core concepts, and how to get started using it to build user interfaces.
This document introduces React, describing it as a JavaScript library for building user interfaces by rendering components rather than mutating the DOM directly. It discusses how React uses a virtual DOM for fast re-rendering, building components instead of templates, and the use of JSX syntax to write HTML-like code. Components have state and props, and the whole app re-renders when state changes to guarantee updates.
The document introduces Meteor JS, a framework for building cutting-edge web applications using JavaScript across all tiers. It discusses key Meteor principles like data on the wire and latency compensation. It also covers getting started with Meteor, including installing it and creating a demo application, as well as hosting Meteor apps in production.
Angry Developer: Creating a Game in QML and JavaScript for MeeGo N9 @iRajLalRaj Lal
The document discusses creating a game called "Angry Developer" using Qt Quick. It describes using QML files and images for the cutting edge UI, JavaScript bindings to add logic and interactivity, and putting the pieces together into a playable game. Key aspects covered include using QML elements and state changes to control gameplay, JavaScript timers to handle random movement and hit/miss detection, and binding JavaScript logic to the QML UI. The document promotes Qt Quick as an easy way to build rich mobile apps by combining declarative QML and JavaScript.
The Perks and Perils of the Singleton Design PatternBADR
Singleton design pattern is on the most famous and used design patterns. It's also a source of endless debates between software engineers! In this session, we discuss the perks and perils of the singleton design patters.
WordCamp Milwaukee - Stop eating resources and optimize your WordPress siteJeff Matson
This document discusses how to optimize a WordPress site to reduce resource usage and improve performance. It recommends removing unnecessary content, compressing images, minifying CSS and JavaScript, caching content aggressively using both server-side and client-side caching, and using content delivery networks. Real-world examples show how these techniques can improve page load times and reduce server load, allowing the site to handle more active visitors before performance degrades. Varnish caching in particular is highlighted as very effective at improving performance.
A short talk about javascript frameworks of the future. React has been with us for a long time now, and while it's an amazing technology, there are already some first clues as to where we might go from here.
This document discusses React.js best practices. It covers keynote speakers at React.js Conf 2016 who discussed React.js being more than a library and an emerging ecosystem. It also summarizes React features like being declarative, using virtual DOM and JSX, and being component-based. Additionally, it discusses related technologies like Redux, GraphQL and Relay and how they integrate with React.
This document discusses issues with the npm package manager and introduces Yarn as an alternative that aims to address npm's shortcomings. It notes that Yarn is faster, more reliable, and secure than npm due to features like yarn.lock that lock dependency versions. It also provides concise command comparisons and recommends using Yarn for new projects.
MCE^3 - Konstantin Raev - React Native: Open Source Continuous Build and Deli...PROIDEA
Konstantin is a Web Developer at Facebook who is lucky to work at React Native Open Source team. For the last few years his passions were infrastructure, Continuous Delivery, JavaScript and stable builds. Before joining Facebook he worked at a New Zealand startup www.booktrack.com.
The Web We Weave :: How Web Developers Think About PerformanceOliver Tse
The document discusses how web developers think about performance optimization. It explains that client render time, not page load time, is a more important metric. Page load does not indicate when the full page is visible, as rendering continues after load. The document recommends using tools like Webpagetest and Chrome Timeline to identify opportunities like unused JavaScript that could significantly improve render speed and user experience. Overall performance optimization requires understanding how the browser loads assets and renders pages to target changes that make the largest impact.
Site performance is really about rendering. When, where and how fast your web page or application renders is critical. These provide insights into the member experience. After all, that's the goal - provide a great member experience. Using Webpagetest with help from Chrome's DevTools Timeline, we'll use visualization progression charts and explore this aspect of site performance.
The document provides an introduction and overview of ES6, React, and Redux. It begins with an in-depth section about new features and syntax in ES6, including variable types, arrow functions, modules, classes, and more. It then discusses React, explaining concepts like the virtual DOM, one-way data flow, JSX syntax, props, nested components, conditionals, and state/setState. Finally, it briefly introduces Redux and mentions using React components on the server and in mobile apps with React Native.
Rate Limiting at Scale, from SANS AppSec Las Vegas 2012Nick Galbreath
Rate Limits at Scale SANS AppSec Las Vegas.
Rate Limit Everything All the time using a quantized time system with Memcache or Redis. Use this protect resources or discover anomalies.
Node.JS: Do you know the dependency of your dependencies dependencyWim Selles
A lot of (QA) people are using JavaScript frameworks nowadays, but not everybody knows and understands how the Node.JS ecosystem works. During this talk I'll explain:
- How NodeJS works
- Why you should use NVM instead of a pure NodeJS installation
- The package versioning
- The remark about "there's a package for that"
- How the package-lock.json works
- And many more
MS Cloud Day - Deploying and monitoring windows azure applicationsSpiffy
This document discusses how to deploy and monitor applications on Windows Azure. It covers deploying applications through the Azure portal, Visual Studio, and PowerShell cmdlets. It also discusses upgrading applications using in-place upgrades, VIP swaps, and deleting and recreating deployments. The document reviews monitoring applications using the diagnostic API and visualizing collected data. It also demonstrates installing programs and using startup tasks on Azure roles.
Usersnap and the javascript magic behind the scenes - ViennaJSUsersnap
The Usersnap guys (@fdorfbauer and @josef_trauner) present at ViennaJS what they are doing behind the scenes with their widget and which problems can occur when you develop a widget which will be included in 3rd party sites!
The example code is located in our github repo: https://github.com/usersnap/public/tree/master/misc/viennajs
This document summarizes the evolution of Blazor and Xamarin Forms (now known as Maui) for building mobile, web, and desktop applications with C#. It discusses the differences between Blazor Server and Blazor WebAssembly models, how to create reusable components, access native features via JavaScript interop, and experimental support for building mobile apps using Blazor through Mobile Blazor Bindings. It also provides an overview of upcoming features in .NET 6 to improve the Blazor experience.
Javascript is the language used the most for developing a web app or a hybrid mobile app, mainly because it can be executed directly by browsers. Java instead, can’t be run directly in a browser. On the other hand we have the language TypeScript, which is an open-source language that adds compile time type checking to Javascript, similar to Java, with the goal to prevent bugs mainly in the large code base. It is not uncommon for developers to write code using more than one programming language over time.
In this talk you will find out, how I survived adding Typescript/Javascript to the programming languages I work with, after a long experience of development with Java. Let’s go!
Vert.x – The problem of real-time data bindingAlex Derkach
As the popularity of any event-driven application increases, the number of concurrent connections may increase. Applications that employ thread-per-client architecture, frustrate scalability by exhausting a server’s memory with excessive allocations and by exhausting a server’s CPU with excessive context-switching. One of obvious solutions, is exorcising blocking operations from such applications. Vert.x is event driven and non blocking toolkit, which may help you to achive this goal. In this talk, we are going to cover it’s core features and develop a primitive application using WebSockets, RxJava and Vert.x.
How To Add Any Feature To Your Selenium GridSauce Labs
This document describes ZocGrid, an in-house grid testing solution developed by Zocdoc to enable continuous integration testing. ZocGrid uses a "client knows all" architecture where test clients run locally on VMs but coordinate through a central server. This allows tests to run in parallel across different environments and browsers while keeping the server load light. The document outlines how ZocGrid supports features like video recording, transcript logging and running customized test subsets. It proposes expanding ZocGrid to allow developers to leverage the VM pool to test their own code changes.
Builda responsivetypescriptwebdriverio frameworkWim Selles
Participate in this workshop to learn how to put together the concepts of a WebdriverIO and TypeScript in a Mocha framework that is scalable, robust, easy to read. We will be sharing our real-time experience of how we migrated our testing approach, design and framework when our application was migrating from javascript to a typescript architecture.
You will leave with your very own example automation framework that demonstrates advanced principles of WebdriverIO using TypeScript automation design. We will integrate with allure reporting.
Build a responsive typescript webdriverio frameworkVaruna Srivastava
This document discusses building a responsive TypeScript framework with WebdriverIO. It covers Node.js, NPM, WebdriverIO, TypeScript, and includes a demo. Node.js is introduced as a JavaScript runtime environment based on Chrome's V8 engine. NPM is described as the package manager for Node.js projects. WebdriverIO is explained as a framework for browser and mobile automation using the WebDriver protocol. TypeScript enhances JavaScript with types and compiles to plain JavaScript. The document demonstrates selecting elements and writing tests in WebdriverIO and TypeScript.
Performance Metrics for your Build Pipeline - presented at Vienna WebPerf Oct...Andreas Grabner
Software Performance Metrics that you should look at throughout your Build Pipeline and not just when your app crashes in productiong.
Find performance and scalability problems as soon as executing your first Unit Test. Simply focus on metrics such as #SQLs, #LogMessages, #Objects on Heap, ...
This presentation explains the basics of WebSockets and how a Developer can leverage its features to enhance a Mobile User Experience and offer real timing applications
Михаил Боднарчук "Acceptance Testing in NodeJS: Tools & Approaches"Fwdays
1) Michael Bodnarchuk presented on acceptance testing in NodeJS and introduced CodeceptJS as a testing framework.
2) Acceptance testing verifies the functionality of an application from an end-user perspective and tests the full user workflow.
3) CodeceptJS allows writing acceptance tests in a synchronous manner using page objects and scenarios while leveraging Selenium and other browser automation libraries. It aims to make acceptance testing easy.
My talk in Bessemer VP R&D / CTO yearly event (Jan 2020).
The presentation discusses major concept in resilience testing and MyHeritage's path to Chaos Engineering.
Configuration Testing with Docker & TestContainersVincent Massol
Testing different configuration of your software on the developer machine, directly from your IDE.
Presented at Devoxx FR 2019
Video at https://youtu.be/0TvWv4L_IJM
JavaScript Test-Driven Development with Jasmine 2.0 and Karma Christopher Bartling
This document discusses JavaScript test-driven development using Jasmine 2.0 and Karma. It introduces test-driven development principles and benefits, then covers the Karma test runner, PhantomJS browser, and features of the Jasmine testing framework including describe blocks, expectations, matchers, spies, and custom matchers. It also provides an example of mapping earthquakes and testing color-coded circles using magnitude and discusses code coverage and sustaining test-driven practices.
This document discusses a framework for automated web testing using Ruby, Watir, Cucumber, and Selenium Grid. It provides an agenda, overview of the tools and technologies used, why Watir was chosen, details of the framework architecture and features, and the framework workflow. It also includes a comparison analysis and discusses next steps for Phase II. The goal is to build a maintainable, parallelized, and reportable automated testing solution using behavior-driven development.
Explains implementation steps for running Genymotion device as Android emulator with Jenkins headless server. The logic is tried and tested for concurrent Jenkins builds on Ubuntu server
"Тестирование в Agile в среде виртуализации Vagrant+Docker", Владимир Сидорен...DataArt
This document discusses testing in Agile environments using Scrum and Kanban methodologies. It describes a project using Scrum with a 10 person team developing a web application using Java, JavaScript, Jira, GitHub, and virtual environments like Vagrant and Docker. It outlines roles, artifacts, and ceremonies in Scrum like user stories, backlogs, sprints, and stand-ups. It also discusses issues with virtual environments and benefits of limiting work in progress using Kanban. The conclusion emphasizes the importance of communication, visibility and flexibility in Agile approaches to software development and testing.
This document discusses Server-Sent Events (SSE) and how it can be used to build an auction engine application. SSE allows a server to push automatic updates to clients via an HTTP connection. It provides a more memory-efficient alternative to polling via XMLHttpRequest. The document compares SSE to WebSockets, noting SSE uses HTTP while WebSockets use a custom protocol. SSE is best for cases like stock updates or notifications where communication is unidirectional from server to client. The document demonstrates implementing SSE from scratch using Symfony/Mercure and discusses considerations like handling connection errors and sending events to specific users/topics.
Reliability Patterns for Large-Scale Automated TestsWaseem Hamshawi
This document discusses patterns for improving the reliability of large-scale Selenium tests. It recommends using techniques such as multi-tier deployments with rollout criteria to minimize risk when modifying test code, implementing fallbacks and load balancing for single points of failure, using circuit breakers to prevent unnecessary requests, and distributing tests across a cluster of virtual machines with a cluster manager. It also demonstrates using a library called Ephemerals to programmatically launch short-lived testing environments across a container cluster.
Similar to Seleconf2015 - Automating for the Second Screen with WebdriverJS (20)
Transform Your Communication with Cloud-Based IVR SolutionsTheSMSPoint
Discover the power of Cloud-Based IVR Solutions to streamline communication processes. Embrace scalability and cost-efficiency while enhancing customer experiences with features like automated call routing and voice recognition. Accessible from anywhere, these solutions integrate seamlessly with existing systems, providing real-time analytics for continuous improvement. Revolutionize your communication strategy today with Cloud-Based IVR Solutions. Learn more at: https://thesmspoint.com/channel/cloud-telephony
UI5con 2024 - Keynote: Latest News about UI5 and it’s EcosystemPeter Muessig
Learn about the latest innovations in and around OpenUI5/SAPUI5: UI5 Tooling, UI5 linter, UI5 Web Components, Web Components Integration, UI5 2.x, UI5 GenAI.
Recording:
https://www.youtube.com/live/MSdGLG2zLy8?si=INxBHTqkwHhxV5Ta&t=0
Software Engineering, Software Consulting, Tech Lead, Spring Boot, Spring Cloud, Spring Core, Spring JDBC, Spring Transaction, Spring MVC, OpenShift Cloud Platform, Kafka, REST, SOAP, LLD & HLD.
Unveiling the Advantages of Agile Software Development.pdfbrainerhub1
Learn about Agile Software Development's advantages. Simplify your workflow to spur quicker innovation. Jump right in! We have also discussed the advantages.
A Study of Variable-Role-based Feature Enrichment in Neural Models of CodeAftab 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
DDS Security Version 1.2 was adopted in 2024. This revision strengthens support for long runnings systems adding new cryptographic algorithms, certificate revocation, and hardness against DoS attacks.
Artificia Intellicence and XPath Extension FunctionsOctavian Nadolu
The purpose of this presentation is to provide an overview of how you can use AI from XSLT, XQuery, Schematron, or XML Refactoring operations, the potential benefits of using AI, and some of the challenges we face.
Atelier - Innover avec l’IA Générative et les graphes de connaissancesNeo4j
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.
Hand Rolled Applicative User ValidationCode KataPhilip Schwarz
Could you use a simple piece of Scala validation code (granted, a very simplistic one too!) that you can rewrite, now and again, to refresh your basic understanding of Applicative operators <*>, <*, *>?
The goal is not to write perfect code showcasing validation, but rather, to provide a small, rough-and ready exercise to reinforce your muscle-memory.
Despite its grandiose-sounding title, this deck consists of just three slides showing the Scala 3 code to be rewritten whenever the details of the operators begin to fade away.
The code is my rough and ready translation of a Haskell user-validation program found in a book called Finding Success (and Failure) in Haskell - Fall in love with applicative functors.
What is Augmented Reality Image Trackingpavan998932
Augmented Reality (AR) Image Tracking is a technology that enables AR applications to recognize and track images in the real world, overlaying digital content onto them. This enhances the user's interaction with their environment by providing additional information and interactive elements directly tied to physical images.
Takashi Kobayashi and Hironori Washizaki, "SWEBOK Guide and Future of SE Education," First International Symposium on the Future of Software Engineering (FUSE), June 3-6, 2024, Okinawa, Japan
AI Fusion Buddy Review: Brand New, Groundbreaking Gemini-Powered AI AppGoogle
AI Fusion Buddy Review: Brand New, Groundbreaking Gemini-Powered AI App
👉👉 Click Here To Get More Info 👇👇
https://sumonreview.com/ai-fusion-buddy-review
AI Fusion Buddy Review: Key Features
✅Create Stunning AI App Suite Fully Powered By Google's Latest AI technology, Gemini
✅Use Gemini to Build high-converting Converting Sales Video Scripts, ad copies, Trending Articles, blogs, etc.100% unique!
✅Create Ultra-HD graphics with a single keyword or phrase that commands 10x eyeballs!
✅Fully automated AI articles bulk generation!
✅Auto-post or schedule stunning AI content across all your accounts at once—WordPress, Facebook, LinkedIn, Blogger, and more.
✅With one keyword or URL, generate complete websites, landing pages, and more…
✅Automatically create & sell AI content, graphics, websites, landing pages, & all that gets you paid non-stop 24*7.
✅Pre-built High-Converting 100+ website Templates and 2000+ graphic templates logos, banners, and thumbnail images in Trending Niches.
✅Say goodbye to wasting time logging into multiple Chat GPT & AI Apps once & for all!
✅Save over $5000 per year and kick out dependency on third parties completely!
✅Brand New App: Not available anywhere else!
✅ Beginner-friendly!
✅ZERO upfront cost or any extra expenses
✅Risk-Free: 30-Day Money-Back Guarantee!
✅Commercial License included!
See My Other Reviews Article:
(1) AI Genie Review: https://sumonreview.com/ai-genie-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
#AIFusionBuddyReview,
#AIFusionBuddyFeatures,
#AIFusionBuddyPricing,
#AIFusionBuddyProsandCons,
#AIFusionBuddyTutorial,
#AIFusionBuddyUserExperience
#AIFusionBuddyforBeginners,
#AIFusionBuddyBenefits,
#AIFusionBuddyComparison,
#AIFusionBuddyInstallation,
#AIFusionBuddyRefundPolicy,
#AIFusionBuddyDemo,
#AIFusionBuddyMaintenanceFees,
#AIFusionBuddyNewbieFriendly,
#WhatIsAIFusionBuddy?,
#HowDoesAIFusionBuddyWorks
Microservice Teams - How the cloud changes the way we workSven Peters
A lot of technical challenges and complexity come with building a cloud-native and distributed architecture. The way we develop backend software has fundamentally changed in the last ten years. Managing a microservices architecture demands a lot of us to ensure observability and operational resiliency. But did you also change the way you run your development teams?
Sven will talk about Atlassian’s journey from a monolith to a multi-tenanted architecture and how it affected the way the engineering teams work. You will learn how we shifted to service ownership, moved to more autonomous teams (and its challenges), and established platform and enablement teams.
WhatsApp offers simple, reliable, and private messaging and calling services for free worldwide. With end-to-end encryption, your personal messages and calls are secure, ensuring only you and the recipient can access them. Enjoy voice and video calls to stay connected with loved ones or colleagues. Express yourself using stickers, GIFs, or by sharing moments on Status. WhatsApp Business enables global customer outreach, facilitating sales growth and relationship building through showcasing products and services. Stay connected effortlessly with group chats for planning outings with friends or staying updated on family conversations.
25. Event Modeling with RxJS
Observable
• Generates a sequence of events
Subscriber
• Registers with a subscriber to listen for its events
LINQ-like operator syntax
• Supports chaining of operations
35. 1. Start playback in browser
2. Fling to chromecast
3. Netflix app launches on Chromecast
4. App establishes connection to the WS server
5. Send command over WS to get the player
state
Example
But wait…
36. Promises?
Not quite…
Need to repeat commands until player
returns the expected state
Resolve when state is returned, or
time out
RxJS to the Rescue!
37. Target-Side Validation with
WebSockets
1. Run WebSocket server as a child of the test
process
2. Connect to Chromecast debug channel via
WebSocket
3. Wrap sequence of WS commands in an RxJS
sequence.
38. Solution for the Second Screen
1. How to validate on the target ✓
2. Two devices, one code path
3. Managing the device
The Challenges
39. Another problem
• Validate what’s happening on the browser at
the same time
• Second-screen controls loaded while playback
starts on chromecast
• Could happen in any order
• Not a problem when testing manually!
42. Solution for the Second Screen
1. How to validate on the target ✓
2. Two devices, one code path ✓
3. Managing the device
The Challenges
43. Device Management
with ADB and Ethernet
power switch
• Run Android Device Bridge as child process
– Get chromecast state, reboot before new run
• Ethernet-enabled powerswitch
– If device gets in a bad state, can hard reset by
cycling power switch
– Used telnet client to interface with switch
44. 1. How to validate on the target ✓
2. Two devices, one code path ✓
3. Managing the device ✓
Challenges Solved!
When my team asked me to test the chromecast version of our video player, I was totally on board.
I had already been testing the browser player, and I was eager learn the chromecast.
There was a steep learning curve, with a lot of moving parts.
But I learned the ropes, and after lots of rounds of manual testing, we finished the project
and shipped it, to great success.
I was pretty pleased with myself.
Then my team came to me, and said “Great work! Now we have a ton of improvements to make. So write us some automated tests!”
and I said… #
“Uh ... okay.”
So I found myself tasked with coming up with an automation solution
And I had no idea where to start.
So my task was to write test automation for a second-screen experience.
But what’s a second-screen experience?
Starts with a display – typically a TV, and an application
# playing a movie, or
# game
Connect a secondary device w/ a display – used to control primary display
(enables richer input, better controls)
(also can show supplemental info)
(or simply mirror the display)
This is typically a #
Phone, #
Tablet, (also can be a) #
Game Controller (now even perhaps a) #]
Watch
Increasingly prevalent as more devices hit the market, cheaper, more have screens
Can be
Connect two existing devices (example?)
System with Dedicated controller (like the WiiU)
Connect existing device to a dedicated media player
FireTV, Roku, or Chromecast (all connnect to TV)
This talk focuses on automating this kind of dedicated media player.
Something I noticed when putting together this presentation.
my car has a second-screen display!
I’m going to use some terminology for this talk
Let me get this out of the way
#
Target - device being controlled, e.g. chromecast
(for example: Chromecast)
#
Controller - input device and second display. a.k.a. second screen (for example: phone, tablet, or browser)
Typically controller is paired with target
Cast - “sending” media from the controller to the target. (More precisely, selecting media starting playback.)
My focus: netflix HTML5 player on the chromecast
(streaming video player [in case you’re not familiar])
Supported netflix controllers chrome browser, android (phone and tablets), iOS (iPhone and iPad)
my focus: browser, specifically Chrome
(since I had exp. testing our HTML5 browser player.)
chromecast is the target
Actually runs a version of the chrome browser under the hood(promising for automation?)
application runs as a web page
This is the setup I did manual testing for.
How it works:
Connect a chromecast to your network
Open netflix.com in chrome and start a movie
Using the google’s cast browser extension, “fling” movie to the chromecast.
Movie starts on chromecast
Second-screen controls appear in browser.
I’ll show you an example of this, an example test case I might run…
(walkthrough script notes)
So the first obvious question was: #
We use WebdriverJS to test our HTML5 browser player.
# For the chromecast, # no such toolset exists.
# For testing a second-screen setup, # there is no similar framework.
I searched for any existing solutions that the community may have come up with.
I found a handful of examples, some pretty clever.
But they weren’t going to meet our needs (e.g. test controller only)
It was clear we’d need to devise our own solution.
So we were missing a webdriver. What does that mean? what were we lacking?
Simplifying a bit, webdriver provides you with capability to do two things:
control your application UI,
and validate changes on it.
For a second screen application, control takes place on the controller,
so we had a pretty good solution for that—our controller is a browser.
That’s easy! Use chromedriver.
There’s also validation to do on the controller, so, no problem. Same solution.
But validating what was happening on the chromecast—that was going to be a problem.
So I had my first challenge.
Which was to find a way to do validation on the chromecast.
So in a second screen app, controls (in, e.g. browser) is separated from the display (e.g. chromecast).
Actions on the controller result changes on target.
The timing between these isn’t always predictable.
Things may happening simultaneously on bot.
Testing manually, this can be challenging.
But as humans, we’re pretty good at observing multiple things happening.
At least if the number is small enough.
When writing test automation though, this can be a stumper.
Things are happening in separate processes, on separate devices even.
On top of this, things happening simultaneously on both devices.
Unpredictable timing, may not always even happen in the same sequence.
How to coordinate all of this isn’t straightforward,
esp. if you want tests to be performant
How do you implement this, make it performant, and design your test code to be coherent and robust?
This was my second challenge.
The last problem I encountered was getting a handle on the chromecast itself.
With Selenium, you can start with a fresh browser profile with each test run.
You get a new browser process.
Don’t need to worry about being in a bad state
The question was, how to do this for the chromecast?
Needed a way to:
Query the state – is the chromecast connected to the network? Is it in a stable state?
Control the state
reset to home screen for each test run
hard reboot chromecast if it gets into bad state (as can happen with canary/beta firmware builds)
This was my third challenge—managing the chromecast to make tests reliable and results comprehensible.
[QUESTIONS?]
So this was a healthy bunch of challenges to meet.
Before I describe the solution, though, briefly explain what I already had to work with.
It will help to draw a picture of our automation framework, which we call#
ALCHEMIST
When we were charged last year with creating a test framework for our HTML5 player
we looked to javascript.
The player and an increasing number of other projects at Netflix are in JS.
So it seemed like a natural fit.
Fortunately, there were a number of well-supported javascript bindings for selenium. We chose to build alchemist with:
#
WebdriverJS (a.k.a. selenium-webdriver)#
Employed a PageObject model#
node.js for our runtime environment
Provides tandalone javascript engine (no browser required)
Includes libraries for HTTP, file system and process management
built-in integration with npm library (huge ecosystem with thousands of third-party modules)#
Currently run with Jenkins
The choice to go with webdriver was a boon, because I had a background in java-based selenium.
HOWEVER, I didn’t have a background in javascript.
This was going to be a learning experience.
java and javascript have similar syntax and share a lot of paradigms, so I had a head start.
There are a few critical differences, though, e.g. javascript is a functional language rather than object-oriented
Perhaps most relevant to this project, is that JS is asynchronous. #
In Java, at least when writing selenium code, function calls are executed in order—execute statement 1, block until complete, execute statement 2. This is synchronous execution.
In Javascript, functions are added to an event queue as they’re read.
These messages are read off of the queue by the process thread and executed in order.
Well, so what?
When running a simple script, you may not notice anything different about this.
The tricky part is that any function can add more events to the queue.
It’s a queue not a stack, so the order of execution isn’t guaranteed. #
Order depends on the time it takes to process statements off of the queue.
This it led to another important design decision for Alchemist.
There’s a way to work around this. If you’ve worked with JS any you’re probably familiar with callbacks.
So in java, you might have a function that reads some input, does some kind of processing, and returns a result. #
In javascript, if you want to guarantee this happens in order, you can call your first function, and pass the next function you want to execute as an argument.
So the first does its thing, then as its last statement, it calls the function that was passed to it, often passing it the result of its work. The second function is the callback.
A big problem with this is, as you increase the number of functions you want to sequence
the callback chain can grow very cumbersome.
This code isn’t just carrying a lot of extra syntax weight, it can be a bear to refactor.
Promises are an open standard for treating results of asynchronous calls as objects.
Instead of passing a callback to your function, your function can return a promise.
Promise isn’t the result itself, but will eventually return the result.
When your function has done its work, it adds a message to the queue indicating that it’s finished. This is called resolving.
The promise has a function called then() which will be invoked when the promise resolves. #
You can dictate the order of execution by pasings a callback to this function to invoke once it resolves.
This allows you to structure your code in a cleaner, more manageable way.
We chose to use a popular promise library, Q, for alchemist. Recently switched to bluebird, more features, but works much the same.
[If your function encounters an exception it can also reject the promise, this can be handled with a second callback.]
Sometimes promises aren’t flexible enough to support a good design.
In an example like navigating a web application, when you have lot of potential events, which may happen in many possible sequences.
The paradigm doesn’t hold up very well.
There’s an open source library called ReactiveExtensions, or Rx (out of microsoft).
Which allows for more complicated modeling of events.
The javascript implentation is RxJs.
At its core, has a basic event model. #
An observable generates a sequence of events. You might wrap a process or a sequence of user actions in an observable.
A subscriber registers with an observable so that it can be notified of its events as they happen.
The power of Rx is that it allows you to treat a sequence of events as a collection (like, an array).
You can then iterate over the sequence, select a particular event, filter or transform…
Has a rich syntax for this, modeled after the C# feature LINQ
allows you to chain these operations in an expressive manner.
For example, you might have a series of events, but are only interested in those that take longer than 5000ms.
And of those, you might only care about the first few.
You wrap your event sequence in an observable, use a couple of operators to get at only the ones you want.
A subscriber to the sequence will then only see those events.
We use RxJS for this flexibility in alchemist. For example, for modeling transitions between different page objects. This allows for the test code to be very responsive, and it’s performant, since it’s event-driven.
We used these tools in developing alchemist using these tools.
Runs functional test automation for netflix on our supported browsers:
Chrome, IE, Safari
Since it’s a node.js application, we’re able to use it for other things.
Deploy our HTML5 player with it for example.
So this is what I had to work with when developing chromecast automation.
I wanted to leverage Alchemist as much as possible, it had a lot of the pieces I needed. I just needed to find solutions to my second-screen challenges.
My first challenge, remember, was how to validate what’s happening on the chromecast.
When thinking about trying to solve the problem of how to validate on the target
I gravitated toward the idea that chromecast is running a browser.
Google provides a debug console (if your device is whitelisted), gives you access to the dev tools for your app.
Full-featured, can look at the DOM, & run commands in the console.
I noticed pretty quickly that you could validate against the DOM using document.querySelector(),
which gives you functionality resembling findElement.
Our UI layer on the chromecast also has an interface for interacting with the player. I could this API to get information about the player state.
This seemed promising. But how to automate against this?
The naïve solution was to consider opening the console in selenium window.
And try to use selenium to run client-side scripts against this.
But — that turned out not to be a good idea.
Debug console on chromecast can be flaky
Often need to refresh the page
Worse, leaving it open for too long can cause the chromecast to crash
(because it’s already so resource constrained)
Plus, adding another layer of dependency
Altogether, not a dependable solution.
So, how could I automate against this?
I went to the developer who wrote the messaging layer that Netflix uses on the Chromecast
And asked if he had any ideas.
And he said, “Yeah.”
He told me that he had instrumented the debug build with a websocket client connection.
When debugging his code on the chromecast, he’d set up a WebSocket server on his machine.
When the Netflix app started, it would attempt to connect to the server using the address of his machine.
Then he could pass commands to the chromecast over this channel and they’d be evaluated in the javascript context of the page on the chromecast.
Functionally just like running commands on the debug console.
He offered to create a second websocket client connection that I could use for test automation.
This sounded perfect. I just needed to find out how to run a websocket server from within alchemist and send commands to it.
Fortunately, as a node.js app,
I could import somebody’s websocket server implementation (via NPM)
and run the server as a process within alchemist.
I used imported popular ws module and repurposed the wrapper the developer had used for manual debugging to interface with alchemist.
In selenium,
Start playback in browser
Fling to chromecast
Netflix app launches on Chromecast
App establishes connection to the WS server
Send command over WS to get the player state #
But then
This is an asynchronous call
the command doesn’t necessarily come back right away.
How do I implement the call such that the test can react when it gets the message?
I can wrap the websocket message in a promise
The resolves when it receives a response. #
But there’s still a problem,
Need to repeat commands until player returns the expected state
Resolve when state is returned, or time out.
I had a tool for this job: #
RXJS!
I could wrap the sequence of WS commands in an RxJS sequence.
Using a function called generateWithRelativeTime(), I could have alchemist issue commands to the chromecast, and react the response.
My command function returns a promise.
If a command returns the expected response, it resolves the promise.
Otherwise it reissues the command.
If the timeout is reached, immediately reject the promise. Fail the test.
This allows the test to be reactive, very performant. No need for waits.
Test cases also need to validate what’s happening on the browser at the same time
Second-screen controls are loaded while playback starts on the chromecast
Could happen in any order
This is not a problem when testing manually!
Fortunately, asynchronous javascript enables us to solve this problem pretty well.
Promise libraries (including Q and Bluebird) provide methods for aggregating promises.
The all() function allows you to specify an array of promises, and returns a promise that resolves only when
This example uses Promise.all to wait on two promise chains:
One waits for the browser to show the second-screen loading screen, then then second-screen controls
The other uses the WS connection to validate that the player state foes from LOADING to PLAYING.