In this Front-End Test Fest Keynote by Developer Advocate Andrew Knight, learn more about the seven major trends in front end testing along with the best approaches.

1. 7 Major Trends
in Front End Testing
Front End Test Fest 2
Andrew Knight | Applitools

2. Testing
2

3. 3
Tools and technologies may change,
but fundamentals remain the same.

4. 4
Trend #1:
End-to-end testing
is a three-way battle.

5. 5
Selenium
Popular among testers
C#, Java, JavaScript, Ruby, Python
All major browsers
WebDriver protocol
Low-level browser interactions only
Middle-speed execution

6. 6
Selenium Cypress
Popular among testers Popular among developers
C#, Java, JavaScript, Ruby, Python JavaScript only
All major browsers Chrome, Edge, Firefox, Electron
WebDriver protocol In-browser JavaScript
Low-level browser interactions only Full framework with advanced features
Middle-speed execution Slowest execution

7. 7
Selenium Cypress Playwright
Popular among testers Popular among developers The dark horse
C#, Java, JavaScript, Ruby, Python JavaScript only C#, Java, JavaScript, Python
All major browsers Chrome, Edge, Firefox, Electron Chromium+, Firefox, WebKit
WebDriver protocol In-browser JavaScript Debug protocols
Low-level browser interactions only Full framework with advanced features Full framework with advanced features
Middle-speed execution Slowest execution Fastest execution

8. 8
Selenium Cypress Playwright
Popular among testers Popular among developers The dark horse
C#, Java, JavaScript, Ruby, Python JavaScript only C#, Java, JavaScript, Python
All major browsers Chrome, Edge, Firefox, Electron Chromium+, Firefox, WebKit
WebDriver protocol In-browser JavaScript Debug protocols
Low-level browser interactions only Full framework with advanced features Full framework with advanced features
Middle-speed execution Slowest execution Fastest execution

9. 9
Trend #2:
Component testing
is the new integration testing.

10. 10
Storybook

11. 11

12. 12
When testing anything for the web, we believe that
tests should view and interact with the application in
the same way that an actual user does.
Anything less, and it's hard to have confidence that
your application is doing what it is supposed to.
Source: https://www.cypress.io/blog/2022/06/01/cypress-10-release/

13. 13
We want the best of both worlds:
The simplicity and sensibility of manual testing.
The speed and scalability of automated testing.

14. 14
Trend #3:
Visual testing
has become indispensable.

15. 15

16. 16

17. 17

18. 18

19. 19
DOM & CSS sent to
Applitools
Ultrafast Test Cloud
Applitools Eyes
Visual AI analysis
Login to Eyes to
view test results
.
Firewall
Applitools
Ultrafast Test Cloud
Cross-Browser and
Cross-Device
Testing

20. 20
Web apps must be
functional and performant.

21. 21
Trend #4:
Performance testing
is easier and more vital than ever.

22. 22
Chrome DevTools Performance Tab
TAU Course:

23. Google Lighthouse
23

24. Playwright Performance Test Automation
24
const client = await page.context().newCDPSession(page);
await client.send('Performance.enable');
await page.goto('https://www.google.com/');
await page.click('[aria-label="Search"]');
await page.fill('[aria-label="Search"]', 'playwright');
await Promise.all([
page.waitForNavigation(),
page.press('[aria-label="Search"]', 'Enter')
]);
let perfMetrics = await client.send('Performance.getMetrics');
console.log( perfMetrics.metrics );
John Hill’s Code:
https://bit.ly/3zCuaSq
Source: https://github.com/unlikelyzero/js-perf-toolkit
John Hill’s Talk:
https://bit.ly/3xKQqqT

25. What about testing machine learning models?
25
Amazon’s
Recommendation
System

26. 26
Trend #5:
Machine learning algorithms
need separate approaches.

27. 27
TAU Course for Testing Machine Learning Models
https://testautomationu.applitools.com/testing-machine-learning-models/

28. 28
Trend #6:
JavaScript isn’t everything.

29. 29
Alternatives to Front End JavaScript
1. Non-JavaScript frameworks
a. Django (Python), Rails (Ruby), Laravel (PHP)
b. HTMX

30. 30
Alternatives to Front End JavaScript
1. Non-JavaScript frameworks
a. Django (Python), Rails (Ruby), Laravel (PHP)
b. HTMX
2. WebAssembly
a. PyScript (Python), Blazor (C#), Emscripten (C/C++)

31. 31
Alternatives to Front End JavaScript
1. Non-JavaScript frameworks
a. Django (Python), Rails (Ruby), Laravel (PHP)
b. HTMX
2. WebAssembly
a. PyScript (Python), Blazor (C#), Emscripten (C/C++)
3. Multi-language test tools
a. ✅ Playwright and Selenium
b. ❌ Cypress and WebdriverIO

32. 32
Trend #7:
Autonomous testing is coming.

33. 33

34. 7 Major Trends in Front End Testing
34
1. End-to-end testing is a three-way battle
2. Component testing is the new integration testing
3. Visual testing has become indispensable
4. Performance testing is easier and more vital than ever
5. Machine learning algorithms need separate approaches
6. JavaScript isn’t everything
7. Autonomous testing is coming