SlideShare uma empresa Scribd logo
1 de 17
tweet #tarabica14
tweet #tarabica14
Testing Your SPA
Wekoslav Stefanovski
swekster@gmail.com
facebook.com/sweko
@swekster
tweet #tarabica14
tweet #tarabica14
>whoami
• Senior Developer in Seavus
• Coding professionally since last century
• Rabid about code qualty
• Cofounder of Macedonian .net community
• I love C#
• I hate JavaScript, but I love web development
tweet #tarabica14
What will this talk be about
• A little bit of history
• A little bit of present
• What is and what isn’t an SPA?
• Why test software?
• Design for quality
• How can I test Single Page Applications?
• Demo
tweet #tarabica14
A little bit of history
• What’s the deal with this web thing?
• What is this thing called Javascript???
• Build in Netscape in 1995, focused on non-professional
developers.
• Standardized as ECMAScript (in 1999) – a.k.a. Internet
Prehistory
• What is this thing called DOM???
tweet #tarabica14
A little bit of present
• The rise of the Single-Page Application
• Heavy client logic, getting heavier
• Stateless web is dead and more alive than ever
• The attack of the APIs and services
• Ongoing M/V separation
tweet #tarabica14
So what is an SPA
• Desktop-like user experience
• Starts, and stays on a single page load
• Client-side development
• The server should be as thin and as stateless as possible
tweet #tarabica14
Dataset
SQL
Database Server Desktop Client
Classic Client-Server (VB6)
tweet #tarabica14
Dataset
SQL
Database Server Desktop Client
Web Server
Web Client
Modern Client-Server (SPA)
HTTP API Request
JSON Data
tweet #tarabica14
Why is testing needed
• Software has bugs
• Users and clients have bugs too
• The problem space is extremely complex – almost-
exponential complexity
• Software is never done done.
• Some aspects are prone to automation
• Unit tests
• Functional tests
• Integration tests
• Regression tests
tweet #tarabica14
Quality by design – Pit of Success
• KISS / DRY / YAGNI / SOLID
• Refactoring
• Separate responsibilities
• Avoid mixing of different levels of abstraction
• Manage dependencies
• Write testable code
• Code that does not exist, cannot have bugs
tweet #tarabica14
Testing libraries
• QUnit
• Jasmine
• Mocha
• Chai
• Selenium
• Phantom.js
• Buster.js
• Blanket.js
• Casper.js
• Chutzpah
• Sinon.js
• JsMockito
• jqMock
• mockjax
• Watir / WatiN
• Sahi
• expect.js
• YUI Test
• JSTestDriver
• ….
tweet #tarabica14
How should I test JavaScript
• Javascript code is just code!
• Dynamic structure actually helps
• Unit test frameworks
• Headless browsers
• Regular browsers
• Integration with CI tools
tweet #tarabica14
How should I test everything else?
• The old, tried way – Eyeballs on the job
• Browser automation
• Taking and comparing screenshots
• Selenium WebDriver
tweet #tarabica14
DEMO
A very simple knockout.js based SPA tested with
QUnit, Chutzpah and PhantomJS
tweet #tarabica14

Mais conteúdo relacionado

Mais procurados

Oleksandr Skachkov "Running С# in your Web Browser with WebAssembly"
Oleksandr Skachkov "Running С# in your Web Browser with WebAssembly"Oleksandr Skachkov "Running С# in your Web Browser with WebAssembly"
Oleksandr Skachkov "Running С# in your Web Browser with WebAssembly"Fwdays
 
SGCE 2012 Lightning Talk-Single Page Interface
SGCE 2012 Lightning Talk-Single Page InterfaceSGCE 2012 Lightning Talk-Single Page Interface
SGCE 2012 Lightning Talk-Single Page InterfaceDomingo Suarez Torres
 
Lessons in Open Source from the MongooseJS ODM
Lessons in Open Source from the MongooseJS ODMLessons in Open Source from the MongooseJS ODM
Lessons in Open Source from the MongooseJS ODMValeri Karpov
 
Isomorphic React Applications: Performance And Scalability
Isomorphic React Applications: Performance And ScalabilityIsomorphic React Applications: Performance And Scalability
Isomorphic React Applications: Performance And ScalabilityDenis Izmaylov
 
MEAN Stack Warm-up
MEAN Stack Warm-upMEAN Stack Warm-up
MEAN Stack Warm-upTroy Miles
 
React brief introduction
React brief introductionReact brief introduction
React brief introductionPrograils.com
 
MongoDB MEAN Stack Webinar October 7, 2015
MongoDB MEAN Stack Webinar October 7, 2015MongoDB MEAN Stack Webinar October 7, 2015
MongoDB MEAN Stack Webinar October 7, 2015Valeri Karpov
 
Blazor - The New Silverlight?
Blazor - The New Silverlight?Blazor - The New Silverlight?
Blazor - The New Silverlight?Christian Nagel
 
Content as a Service: What to Know About Decoupled CMS
Content as a Service: What to Know About Decoupled CMSContent as a Service: What to Know About Decoupled CMS
Content as a Service: What to Know About Decoupled CMSPantheon
 
Testing Mobile JavaScript (Fall 2010
Testing Mobile JavaScript (Fall 2010Testing Mobile JavaScript (Fall 2010
Testing Mobile JavaScript (Fall 2010jeresig
 
Building modern web sites with ASP .Net Web API, WebSockets and RSignal
Building modern web sites with ASP .Net Web API, WebSockets and RSignalBuilding modern web sites with ASP .Net Web API, WebSockets and RSignal
Building modern web sites with ASP .Net Web API, WebSockets and RSignalAlessandro Pilotti
 
Engage 2019 - De04. Java with Domino After XPages
Engage 2019 - De04. Java with Domino After XPagesEngage 2019 - De04. Java with Domino After XPages
Engage 2019 - De04. Java with Domino After XPagesJesse Gallagher
 
Decoupled Architecture and WordPress
Decoupled Architecture and WordPressDecoupled Architecture and WordPress
Decoupled Architecture and WordPressPantheon
 
Tomasz Janczuk - Webtaskalifragilistexpialidocious
Tomasz Janczuk - WebtaskalifragilistexpialidociousTomasz Janczuk - Webtaskalifragilistexpialidocious
Tomasz Janczuk - WebtaskalifragilistexpialidociousServerlessConf
 

Mais procurados (20)

ITT Flisol 2013
ITT Flisol 2013ITT Flisol 2013
ITT Flisol 2013
 
Oleksandr Skachkov "Running С# in your Web Browser with WebAssembly"
Oleksandr Skachkov "Running С# in your Web Browser with WebAssembly"Oleksandr Skachkov "Running С# in your Web Browser with WebAssembly"
Oleksandr Skachkov "Running С# in your Web Browser with WebAssembly"
 
SGCE 2012 Lightning Talk-Single Page Interface
SGCE 2012 Lightning Talk-Single Page InterfaceSGCE 2012 Lightning Talk-Single Page Interface
SGCE 2012 Lightning Talk-Single Page Interface
 
Lessons in Open Source from the MongooseJS ODM
Lessons in Open Source from the MongooseJS ODMLessons in Open Source from the MongooseJS ODM
Lessons in Open Source from the MongooseJS ODM
 
Isomorphic React Applications: Performance And Scalability
Isomorphic React Applications: Performance And ScalabilityIsomorphic React Applications: Performance And Scalability
Isomorphic React Applications: Performance And Scalability
 
IBM Domino Modernizing apps with Angularjs
IBM Domino Modernizing apps with AngularjsIBM Domino Modernizing apps with Angularjs
IBM Domino Modernizing apps with Angularjs
 
MEAN Stack Warm-up
MEAN Stack Warm-upMEAN Stack Warm-up
MEAN Stack Warm-up
 
Codegen2021 blazor mobile
Codegen2021 blazor mobileCodegen2021 blazor mobile
Codegen2021 blazor mobile
 
React brief introduction
React brief introductionReact brief introduction
React brief introduction
 
MongoDB MEAN Stack Webinar October 7, 2015
MongoDB MEAN Stack Webinar October 7, 2015MongoDB MEAN Stack Webinar October 7, 2015
MongoDB MEAN Stack Webinar October 7, 2015
 
Blazor - The New Silverlight?
Blazor - The New Silverlight?Blazor - The New Silverlight?
Blazor - The New Silverlight?
 
Content as a Service: What to Know About Decoupled CMS
Content as a Service: What to Know About Decoupled CMSContent as a Service: What to Know About Decoupled CMS
Content as a Service: What to Know About Decoupled CMS
 
Testing Mobile JavaScript (Fall 2010
Testing Mobile JavaScript (Fall 2010Testing Mobile JavaScript (Fall 2010
Testing Mobile JavaScript (Fall 2010
 
Building modern web sites with ASP .Net Web API, WebSockets and RSignal
Building modern web sites with ASP .Net Web API, WebSockets and RSignalBuilding modern web sites with ASP .Net Web API, WebSockets and RSignal
Building modern web sites with ASP .Net Web API, WebSockets and RSignal
 
Engage 2019 - De04. Java with Domino After XPages
Engage 2019 - De04. Java with Domino After XPagesEngage 2019 - De04. Java with Domino After XPages
Engage 2019 - De04. Java with Domino After XPages
 
Decoupled Architecture and WordPress
Decoupled Architecture and WordPressDecoupled Architecture and WordPress
Decoupled Architecture and WordPress
 
Tomasz Janczuk - Webtaskalifragilistexpialidocious
Tomasz Janczuk - WebtaskalifragilistexpialidociousTomasz Janczuk - Webtaskalifragilistexpialidocious
Tomasz Janczuk - Webtaskalifragilistexpialidocious
 
Blazor v1.1
Blazor v1.1Blazor v1.1
Blazor v1.1
 
Gatsby intro
Gatsby introGatsby intro
Gatsby intro
 
DevDay 2018 - Blazor
DevDay 2018 - BlazorDevDay 2018 - Blazor
DevDay 2018 - Blazor
 

Destaque

The Dark Side of Single Page Applications
The Dark Side of Single Page ApplicationsThe Dark Side of Single Page Applications
The Dark Side of Single Page ApplicationsDor Kalev
 
Measuring the Performance of Single Page Applications
Measuring the Performance of Single Page ApplicationsMeasuring the Performance of Single Page Applications
Measuring the Performance of Single Page ApplicationsNicholas Jansma
 
Through Meteor to the stars - Developing full-stack SPA's with meteor.js
Through Meteor to the stars - Developing full-stack SPA's with meteor.jsThrough Meteor to the stars - Developing full-stack SPA's with meteor.js
Through Meteor to the stars - Developing full-stack SPA's with meteor.jsWekoslav Stefanovski
 
How to slice your monolithic webapp using MicroApps architecture
How to slice your monolithic webapp using MicroApps architectureHow to slice your monolithic webapp using MicroApps architecture
How to slice your monolithic webapp using MicroApps architectureYonatan Maman
 
Content Architecture
Content ArchitectureContent Architecture
Content Architecturecleveg
 
Acceptance & Functional Testing with Codeception - Devspace 2015
Acceptance & Functional Testing with Codeception - Devspace 2015 Acceptance & Functional Testing with Codeception - Devspace 2015
Acceptance & Functional Testing with Codeception - Devspace 2015 Joe Ferguson
 
Smoke and Mirrors - Reflection in C#
Smoke and Mirrors - Reflection in C#Smoke and Mirrors - Reflection in C#
Smoke and Mirrors - Reflection in C#Wekoslav Stefanovski
 
TypeScript 1.6 - How I learned to Stop Worrying and Love JavaScript
TypeScript 1.6 - How I learned to Stop Worrying and Love JavaScriptTypeScript 1.6 - How I learned to Stop Worrying and Love JavaScript
TypeScript 1.6 - How I learned to Stop Worrying and Love JavaScriptWekoslav Stefanovski
 
Behavior Driven Development with AngularJS & Jasmine
Behavior Driven Development with AngularJS & JasmineBehavior Driven Development with AngularJS & Jasmine
Behavior Driven Development with AngularJS & JasmineRemus Langu
 
Single Page WebApp Architecture
Single Page WebApp ArchitectureSingle Page WebApp Architecture
Single Page WebApp ArchitectureMorgan Cheng
 
Performance Testing using Real Browsers with JMeter & Webdriver
Performance Testing using Real Browsers with JMeter & WebdriverPerformance Testing using Real Browsers with JMeter & Webdriver
Performance Testing using Real Browsers with JMeter & WebdriverBlazeMeter
 
How Slow Load Times Hurt Your Bottom Line (And 17 Things You Can Do to Fix It)
How Slow Load Times Hurt Your Bottom Line (And 17 Things You Can Do to Fix It)How Slow Load Times Hurt Your Bottom Line (And 17 Things You Can Do to Fix It)
How Slow Load Times Hurt Your Bottom Line (And 17 Things You Can Do to Fix It)Tammy Everts
 
Coding for the cloud - development of modern web applications
Coding for the cloud - development of modern web applicationsCoding for the cloud - development of modern web applications
Coding for the cloud - development of modern web applicationsWekoslav Stefanovski
 
Speed matters, So why is your site so slow?
Speed matters, So why is your site so slow?Speed matters, So why is your site so slow?
Speed matters, So why is your site so slow?Andy Davies
 
Integration Test Hell
Integration Test HellIntegration Test Hell
Integration Test HellDavid Völkel
 

Destaque (19)

The Dark Side of Single Page Applications
The Dark Side of Single Page ApplicationsThe Dark Side of Single Page Applications
The Dark Side of Single Page Applications
 
Measuring the Performance of Single Page Applications
Measuring the Performance of Single Page ApplicationsMeasuring the Performance of Single Page Applications
Measuring the Performance of Single Page Applications
 
Through Meteor to the stars - Developing full-stack SPA's with meteor.js
Through Meteor to the stars - Developing full-stack SPA's with meteor.jsThrough Meteor to the stars - Developing full-stack SPA's with meteor.js
Through Meteor to the stars - Developing full-stack SPA's with meteor.js
 
How to slice your monolithic webapp using MicroApps architecture
How to slice your monolithic webapp using MicroApps architectureHow to slice your monolithic webapp using MicroApps architecture
How to slice your monolithic webapp using MicroApps architecture
 
Webapp-Architecture
Webapp-ArchitectureWebapp-Architecture
Webapp-Architecture
 
Content Architecture
Content ArchitectureContent Architecture
Content Architecture
 
Acceptance & Functional Testing with Codeception - Devspace 2015
Acceptance & Functional Testing with Codeception - Devspace 2015 Acceptance & Functional Testing with Codeception - Devspace 2015
Acceptance & Functional Testing with Codeception - Devspace 2015
 
Smoke and Mirrors - Reflection in C#
Smoke and Mirrors - Reflection in C#Smoke and Mirrors - Reflection in C#
Smoke and Mirrors - Reflection in C#
 
TypeScript 1.6 - How I learned to Stop Worrying and Love JavaScript
TypeScript 1.6 - How I learned to Stop Worrying and Love JavaScriptTypeScript 1.6 - How I learned to Stop Worrying and Love JavaScript
TypeScript 1.6 - How I learned to Stop Worrying and Love JavaScript
 
Behavior Driven Development with AngularJS & Jasmine
Behavior Driven Development with AngularJS & JasmineBehavior Driven Development with AngularJS & Jasmine
Behavior Driven Development with AngularJS & Jasmine
 
Measuring Continuity
Measuring ContinuityMeasuring Continuity
Measuring Continuity
 
Jasmine BDD for Javascript
Jasmine BDD for JavascriptJasmine BDD for Javascript
Jasmine BDD for Javascript
 
Single Page WebApp Architecture
Single Page WebApp ArchitectureSingle Page WebApp Architecture
Single Page WebApp Architecture
 
Performance Testing using Real Browsers with JMeter & Webdriver
Performance Testing using Real Browsers with JMeter & WebdriverPerformance Testing using Real Browsers with JMeter & Webdriver
Performance Testing using Real Browsers with JMeter & Webdriver
 
How Slow Load Times Hurt Your Bottom Line (And 17 Things You Can Do to Fix It)
How Slow Load Times Hurt Your Bottom Line (And 17 Things You Can Do to Fix It)How Slow Load Times Hurt Your Bottom Line (And 17 Things You Can Do to Fix It)
How Slow Load Times Hurt Your Bottom Line (And 17 Things You Can Do to Fix It)
 
JMeter Database Performace Testing - Keytorc Approach
JMeter Database Performace Testing - Keytorc ApproachJMeter Database Performace Testing - Keytorc Approach
JMeter Database Performace Testing - Keytorc Approach
 
Coding for the cloud - development of modern web applications
Coding for the cloud - development of modern web applicationsCoding for the cloud - development of modern web applications
Coding for the cloud - development of modern web applications
 
Speed matters, So why is your site so slow?
Speed matters, So why is your site so slow?Speed matters, So why is your site so slow?
Speed matters, So why is your site so slow?
 
Integration Test Hell
Integration Test HellIntegration Test Hell
Integration Test Hell
 

Semelhante a Testing your Single Page Application

JavaScript in Universal Windows Platform apps
JavaScript in Universal Windows Platform appsJavaScript in Universal Windows Platform apps
JavaScript in Universal Windows Platform appsTimmy Kokke
 
Tarabica 2019 - Migration from ASP.NET MVC to ASP.NET Core
Tarabica 2019 - Migration from ASP.NET MVC to ASP.NET CoreTarabica 2019 - Migration from ASP.NET MVC to ASP.NET Core
Tarabica 2019 - Migration from ASP.NET MVC to ASP.NET CoreMiroslav Popovic
 
WTF: Where To Focus when you take over a Drupal project
WTF: Where To Focus when you take over a Drupal projectWTF: Where To Focus when you take over a Drupal project
WTF: Where To Focus when you take over a Drupal projectSymetris
 
Shift Remote: JS - Javascript Build Tools: Past & Beyond - Shedrack Akintayo
Shift Remote: JS - Javascript Build Tools: Past & Beyond - Shedrack Akintayo Shift Remote: JS - Javascript Build Tools: Past & Beyond - Shedrack Akintayo
Shift Remote: JS - Javascript Build Tools: Past & Beyond - Shedrack Akintayo Shift Conference
 
Progressive Enhancement using WSGI
Progressive Enhancement using WSGIProgressive Enhancement using WSGI
Progressive Enhancement using WSGIMatthew Wilkes
 
The Thick Front-End
The Thick Front-EndThe Thick Front-End
The Thick Front-EndJeff Dickey
 
Develop a vanilla.js spa you and your customers will love
Develop a vanilla.js spa you and your customers will loveDevelop a vanilla.js spa you and your customers will love
Develop a vanilla.js spa you and your customers will loveChris Love
 
Next Generation Web Development Techniques with Cloud Foundry
Next Generation Web Development Techniques with Cloud FoundryNext Generation Web Development Techniques with Cloud Foundry
Next Generation Web Development Techniques with Cloud FoundryMalachi Smith
 
Best Practices for WordPress
Best Practices for WordPressBest Practices for WordPress
Best Practices for WordPressTaylor Lovett
 
Letter to a Junior Developer: The Engineering Side of Programming
Letter to a Junior Developer: The Engineering Side of ProgrammingLetter to a Junior Developer: The Engineering Side of Programming
Letter to a Junior Developer: The Engineering Side of ProgrammingLazar Kovacevic
 
Single Page Application Development with backbone.js and Simple.Web
Single Page Application Development with backbone.js and Simple.WebSingle Page Application Development with backbone.js and Simple.Web
Single Page Application Development with backbone.js and Simple.WebChris Canal
 
Angular Owin Katana TypeScript
Angular Owin Katana TypeScriptAngular Owin Katana TypeScript
Angular Owin Katana TypeScriptJustin Wendlandt
 
Untangling spring week1
Untangling spring week1Untangling spring week1
Untangling spring week1Derek Jacoby
 
Test Automation with Twist and Sahi
Test Automation with Twist and SahiTest Automation with Twist and Sahi
Test Automation with Twist and Sahiericjamesblackburn
 
Acing application lifecycle management in SharePoint
Acing application lifecycle management in SharePointAcing application lifecycle management in SharePoint
Acing application lifecycle management in SharePointJeremy Thake
 
Episode 16 - Introduction to LWC
Episode 16 - Introduction to LWCEpisode 16 - Introduction to LWC
Episode 16 - Introduction to LWCJitendra Zaa
 
The Silver Bullet Syndrome by Alexey Vasiliev
The Silver Bullet Syndrome by Alexey VasilievThe Silver Bullet Syndrome by Alexey Vasiliev
The Silver Bullet Syndrome by Alexey VasilievPivorak MeetUp
 
Untying the Knots of Web Dev with Internet Explorer
Untying the Knots of Web Dev with Internet Explorer Untying the Knots of Web Dev with Internet Explorer
Untying the Knots of Web Dev with Internet Explorer Sarah Dutkiewicz
 
Node.js for .NET Developers
Node.js for .NET DevelopersNode.js for .NET Developers
Node.js for .NET DevelopersDavid Neal
 
Web development - Developing Web as A Team
Web development -  Developing Web as A TeamWeb development -  Developing Web as A Team
Web development - Developing Web as A TeamMuhammad Akbar Yasin
 

Semelhante a Testing your Single Page Application (20)

JavaScript in Universal Windows Platform apps
JavaScript in Universal Windows Platform appsJavaScript in Universal Windows Platform apps
JavaScript in Universal Windows Platform apps
 
Tarabica 2019 - Migration from ASP.NET MVC to ASP.NET Core
Tarabica 2019 - Migration from ASP.NET MVC to ASP.NET CoreTarabica 2019 - Migration from ASP.NET MVC to ASP.NET Core
Tarabica 2019 - Migration from ASP.NET MVC to ASP.NET Core
 
WTF: Where To Focus when you take over a Drupal project
WTF: Where To Focus when you take over a Drupal projectWTF: Where To Focus when you take over a Drupal project
WTF: Where To Focus when you take over a Drupal project
 
Shift Remote: JS - Javascript Build Tools: Past & Beyond - Shedrack Akintayo
Shift Remote: JS - Javascript Build Tools: Past & Beyond - Shedrack Akintayo Shift Remote: JS - Javascript Build Tools: Past & Beyond - Shedrack Akintayo
Shift Remote: JS - Javascript Build Tools: Past & Beyond - Shedrack Akintayo
 
Progressive Enhancement using WSGI
Progressive Enhancement using WSGIProgressive Enhancement using WSGI
Progressive Enhancement using WSGI
 
The Thick Front-End
The Thick Front-EndThe Thick Front-End
The Thick Front-End
 
Develop a vanilla.js spa you and your customers will love
Develop a vanilla.js spa you and your customers will loveDevelop a vanilla.js spa you and your customers will love
Develop a vanilla.js spa you and your customers will love
 
Next Generation Web Development Techniques with Cloud Foundry
Next Generation Web Development Techniques with Cloud FoundryNext Generation Web Development Techniques with Cloud Foundry
Next Generation Web Development Techniques with Cloud Foundry
 
Best Practices for WordPress
Best Practices for WordPressBest Practices for WordPress
Best Practices for WordPress
 
Letter to a Junior Developer: The Engineering Side of Programming
Letter to a Junior Developer: The Engineering Side of ProgrammingLetter to a Junior Developer: The Engineering Side of Programming
Letter to a Junior Developer: The Engineering Side of Programming
 
Single Page Application Development with backbone.js and Simple.Web
Single Page Application Development with backbone.js and Simple.WebSingle Page Application Development with backbone.js and Simple.Web
Single Page Application Development with backbone.js and Simple.Web
 
Angular Owin Katana TypeScript
Angular Owin Katana TypeScriptAngular Owin Katana TypeScript
Angular Owin Katana TypeScript
 
Untangling spring week1
Untangling spring week1Untangling spring week1
Untangling spring week1
 
Test Automation with Twist and Sahi
Test Automation with Twist and SahiTest Automation with Twist and Sahi
Test Automation with Twist and Sahi
 
Acing application lifecycle management in SharePoint
Acing application lifecycle management in SharePointAcing application lifecycle management in SharePoint
Acing application lifecycle management in SharePoint
 
Episode 16 - Introduction to LWC
Episode 16 - Introduction to LWCEpisode 16 - Introduction to LWC
Episode 16 - Introduction to LWC
 
The Silver Bullet Syndrome by Alexey Vasiliev
The Silver Bullet Syndrome by Alexey VasilievThe Silver Bullet Syndrome by Alexey Vasiliev
The Silver Bullet Syndrome by Alexey Vasiliev
 
Untying the Knots of Web Dev with Internet Explorer
Untying the Knots of Web Dev with Internet Explorer Untying the Knots of Web Dev with Internet Explorer
Untying the Knots of Web Dev with Internet Explorer
 
Node.js for .NET Developers
Node.js for .NET DevelopersNode.js for .NET Developers
Node.js for .NET Developers
 
Web development - Developing Web as A Team
Web development -  Developing Web as A TeamWeb development -  Developing Web as A Team
Web development - Developing Web as A Team
 

Mais de Wekoslav Stefanovski

Mais de Wekoslav Stefanovski (10)

Make you a Redux for fun and profit!
Make you a Redux for fun and profit!Make you a Redux for fun and profit!
Make you a Redux for fun and profit!
 
Blazor - C# for the web
Blazor - C# for the webBlazor - C# for the web
Blazor - C# for the web
 
Asynchrony on the web
Asynchrony on the webAsynchrony on the web
Asynchrony on the web
 
Servers? We don't need no stinking servers
Servers? We don't need no stinking serversServers? We don't need no stinking servers
Servers? We don't need no stinking servers
 
Typescript Decorators
Typescript DecoratorsTypescript Decorators
Typescript Decorators
 
How to write bad code using C#
How to write bad code using C#How to write bad code using C#
How to write bad code using C#
 
Garbage Collection .Net
Garbage Collection .NetGarbage Collection .Net
Garbage Collection .Net
 
TypeScript - Javascript done right
TypeScript - Javascript done rightTypeScript - Javascript done right
TypeScript - Javascript done right
 
Entity Framework 5 - Code First
Entity Framework 5 - Code FirstEntity Framework 5 - Code First
Entity Framework 5 - Code First
 
SOLID -Clean Code For Mere Mortals
SOLID -Clean Code For Mere MortalsSOLID -Clean Code For Mere Mortals
SOLID -Clean Code For Mere Mortals
 

Último

The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024Rafal Los
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationRadu Cotescu
 
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmaticsKotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmaticscarlostorres15106
 
SIEMENS: RAPUNZEL – A Tale About Knowledge Graph
SIEMENS: RAPUNZEL – A Tale About Knowledge GraphSIEMENS: RAPUNZEL – A Tale About Knowledge Graph
SIEMENS: RAPUNZEL – A Tale About Knowledge GraphNeo4j
 
Benefits Of Flutter Compared To Other Frameworks
Benefits Of Flutter Compared To Other FrameworksBenefits Of Flutter Compared To Other Frameworks
Benefits Of Flutter Compared To Other FrameworksSoftradix Technologies
 
Maximizing Board Effectiveness 2024 Webinar.pptx
Maximizing Board Effectiveness 2024 Webinar.pptxMaximizing Board Effectiveness 2024 Webinar.pptx
Maximizing Board Effectiveness 2024 Webinar.pptxOnBoard
 
How to convert PDF to text with Nanonets
How to convert PDF to text with NanonetsHow to convert PDF to text with Nanonets
How to convert PDF to text with Nanonetsnaman860154
 
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)Gabriella Davis
 
Salesforce Community Group Quito, Salesforce 101
Salesforce Community Group Quito, Salesforce 101Salesforce Community Group Quito, Salesforce 101
Salesforce Community Group Quito, Salesforce 101Paola De la Torre
 
WhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure service
WhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure serviceWhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure service
WhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure servicePooja Nehwal
 
Human Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsHuman Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsMark Billinghurst
 
How to Remove Document Management Hurdles with X-Docs?
How to Remove Document Management Hurdles with X-Docs?How to Remove Document Management Hurdles with X-Docs?
How to Remove Document Management Hurdles with X-Docs?XfilesPro
 
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking MenDelhi Call girls
 
Understanding the Laravel MVC Architecture
Understanding the Laravel MVC ArchitectureUnderstanding the Laravel MVC Architecture
Understanding the Laravel MVC ArchitecturePixlogix Infotech
 
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsEnterprise Knowledge
 
Install Stable Diffusion in windows machine
Install Stable Diffusion in windows machineInstall Stable Diffusion in windows machine
Install Stable Diffusion in windows machinePadma Pradeep
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptxHampshireHUG
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerThousandEyes
 
Enhancing Worker Digital Experience: A Hands-on Workshop for Partners
Enhancing Worker Digital Experience: A Hands-on Workshop for PartnersEnhancing Worker Digital Experience: A Hands-on Workshop for Partners
Enhancing Worker Digital Experience: A Hands-on Workshop for PartnersThousandEyes
 
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreterPresentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreternaman860154
 

Último (20)

The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
 
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmaticsKotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
 
SIEMENS: RAPUNZEL – A Tale About Knowledge Graph
SIEMENS: RAPUNZEL – A Tale About Knowledge GraphSIEMENS: RAPUNZEL – A Tale About Knowledge Graph
SIEMENS: RAPUNZEL – A Tale About Knowledge Graph
 
Benefits Of Flutter Compared To Other Frameworks
Benefits Of Flutter Compared To Other FrameworksBenefits Of Flutter Compared To Other Frameworks
Benefits Of Flutter Compared To Other Frameworks
 
Maximizing Board Effectiveness 2024 Webinar.pptx
Maximizing Board Effectiveness 2024 Webinar.pptxMaximizing Board Effectiveness 2024 Webinar.pptx
Maximizing Board Effectiveness 2024 Webinar.pptx
 
How to convert PDF to text with Nanonets
How to convert PDF to text with NanonetsHow to convert PDF to text with Nanonets
How to convert PDF to text with Nanonets
 
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)
 
Salesforce Community Group Quito, Salesforce 101
Salesforce Community Group Quito, Salesforce 101Salesforce Community Group Quito, Salesforce 101
Salesforce Community Group Quito, Salesforce 101
 
WhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure service
WhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure serviceWhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure service
WhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure service
 
Human Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsHuman Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR Systems
 
How to Remove Document Management Hurdles with X-Docs?
How to Remove Document Management Hurdles with X-Docs?How to Remove Document Management Hurdles with X-Docs?
How to Remove Document Management Hurdles with X-Docs?
 
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men
 
Understanding the Laravel MVC Architecture
Understanding the Laravel MVC ArchitectureUnderstanding the Laravel MVC Architecture
Understanding the Laravel MVC Architecture
 
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI Solutions
 
Install Stable Diffusion in windows machine
Install Stable Diffusion in windows machineInstall Stable Diffusion in windows machine
Install Stable Diffusion in windows machine
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Enhancing Worker Digital Experience: A Hands-on Workshop for Partners
Enhancing Worker Digital Experience: A Hands-on Workshop for PartnersEnhancing Worker Digital Experience: A Hands-on Workshop for Partners
Enhancing Worker Digital Experience: A Hands-on Workshop for Partners
 
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreterPresentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreter
 

Testing your Single Page Application

  • 2. tweet #tarabica14 Testing Your SPA Wekoslav Stefanovski swekster@gmail.com facebook.com/sweko @swekster
  • 4. tweet #tarabica14 >whoami • Senior Developer in Seavus • Coding professionally since last century • Rabid about code qualty • Cofounder of Macedonian .net community • I love C# • I hate JavaScript, but I love web development
  • 5. tweet #tarabica14 What will this talk be about • A little bit of history • A little bit of present • What is and what isn’t an SPA? • Why test software? • Design for quality • How can I test Single Page Applications? • Demo
  • 6. tweet #tarabica14 A little bit of history • What’s the deal with this web thing? • What is this thing called Javascript??? • Build in Netscape in 1995, focused on non-professional developers. • Standardized as ECMAScript (in 1999) – a.k.a. Internet Prehistory • What is this thing called DOM???
  • 7. tweet #tarabica14 A little bit of present • The rise of the Single-Page Application • Heavy client logic, getting heavier • Stateless web is dead and more alive than ever • The attack of the APIs and services • Ongoing M/V separation
  • 8. tweet #tarabica14 So what is an SPA • Desktop-like user experience • Starts, and stays on a single page load • Client-side development • The server should be as thin and as stateless as possible
  • 9. tweet #tarabica14 Dataset SQL Database Server Desktop Client Classic Client-Server (VB6)
  • 10. tweet #tarabica14 Dataset SQL Database Server Desktop Client Web Server Web Client Modern Client-Server (SPA) HTTP API Request JSON Data
  • 11. tweet #tarabica14 Why is testing needed • Software has bugs • Users and clients have bugs too • The problem space is extremely complex – almost- exponential complexity • Software is never done done. • Some aspects are prone to automation • Unit tests • Functional tests • Integration tests • Regression tests
  • 12. tweet #tarabica14 Quality by design – Pit of Success • KISS / DRY / YAGNI / SOLID • Refactoring • Separate responsibilities • Avoid mixing of different levels of abstraction • Manage dependencies • Write testable code • Code that does not exist, cannot have bugs
  • 13. tweet #tarabica14 Testing libraries • QUnit • Jasmine • Mocha • Chai • Selenium • Phantom.js • Buster.js • Blanket.js • Casper.js • Chutzpah • Sinon.js • JsMockito • jqMock • mockjax • Watir / WatiN • Sahi • expect.js • YUI Test • JSTestDriver • ….
  • 14. tweet #tarabica14 How should I test JavaScript • Javascript code is just code! • Dynamic structure actually helps • Unit test frameworks • Headless browsers • Regular browsers • Integration with CI tools
  • 15. tweet #tarabica14 How should I test everything else? • The old, tried way – Eyeballs on the job • Browser automation • Taking and comparing screenshots • Selenium WebDriver
  • 16. tweet #tarabica14 DEMO A very simple knockout.js based SPA tested with QUnit, Chutzpah and PhantomJS