#e2e testing

Component testing is a gray area between integration and unit testing. The demo app focuses on the cart component and writing test cases for Playwright component test and VTest. The first cart test encounters a bug with the invisible method in View Test.

Playwright is a reliable end-to-end testing tool for modern web apps that provides one API, full isolation, fast execution, and supports multiple languages. It offers features like auto-weighting, retrying assertions, seamless testing of iframes and shadow DOM, test isolation, parallelism, and scalability. Playwright provides tools like VS Code extension, UiMode, and Trace Viewer for writing, debugging, and running tests. Effective tests prioritize user-facing attributes, use playwright locators and assertions, and avoid testing third-party dependencies. Playwright simplifies testing by generating tests, providing code generation and UI mode, and allows for easy running and debugging of tests. It helps in fixing failed tests and analyzing DOM changes, fixing locator mismatches, and scaling tests. Playwright is open source, free, and continuously growing.

Testing web applications with Playwright, a reliable end-to-end testing tool. Playwright offers fast execution, powerful tooling, and support for multiple languages. It provides precise selectors, web-first assertions, and code generation for easy testing. Playwright also offers features like live debugging, tracing, and running tests on CI. The future of Playwright aims to make testing easy and fun, with a focus on creating frustration-free web experiences.

Automated atomic tests are a great way to improve UI tests by making them less brittle and faster. The tests focus on testing a single feature or component and have minimal UI interactions. The Talk explores examples of automated atomic tests and their implementation on web applications. It also discusses the analysis of atomic tests, login tests, and working with JSON Web Tokens for authentication and authorization. The Talk concludes by highlighting the use of UI and web requests in automated atomic testing.

Cypress is a powerful tool for end-to-end testing and API testing. It provides instant feedback on test errors and allows tests to be run inside the browser. Cypress enables testing at both the application and network layers, making it easier to reach different edge cases. With features like AppActions and component testing, Cypress allows for comprehensive testing of individual components and the entire application. Join the workshops to learn more about full circle testing with Cypress.

A single-page application utilized a server-side BFF layer to simplify authentication and data customization. Testing a BFF-based architecture involves contract testing and tool usage. Challenges arise when mocking server-to-server requests in a client-side and server-side architecture. Separate tests should be written for client-side and server-side components, with contract testing to ensure compatibility. Integration testing for the front-end and server-side can be done by replacing microservices with a sub-server.

Carly Richmond discusses the importance of shifting left in testing and monitoring. She emphasizes the need for empathy and a common toolset in the software development process. The talk explores the use of end-to-end testing and synthetic monitoring, showcasing an example with Playwrights, GitHub Actions, and Elastic Synthetics. It also covers the configuration, setup, and integration of tests in the CI workflow. The talk concludes with the benefits of monitoring application and test state, and the importance of collaboration in issue recreation.

Carly Richards discusses the challenges of using different tools for synthetic monitoring and end-to-end testing, emphasizing the need for a unified approach with playwright and Elastic Synthetics. The Playwright API and Elastic Synthetics can be used together to create tests and monitoring tools, ensuring consistent user experience and documenting application features. By bringing development and SRE teams together and using a common tool, collaboration and defect identification can be improved.

In this Talk, Rafaela discusses Web3, its decentralized and token-based model, and the architecture based on smart contracts. Testing Web3 poses challenges due to the need for third-party providers like MetaMask. Approaches such as mocking the Web3 flow and using end-to-end testing tools like Taskafar are suggested. The trade-offs in Web3 testing include test speed and dependency on third-party apps. Balancing unit, integration, and end-to-end tasks is crucial for a robust testing strategy.

Playwright is a powerful tool for end-to-end testing, offering support for all major browsers and platforms. It provides features like parallelization, built-in waiting, and assertions. Playwright allows for running tests on multiple browsers with a single command and has functionality for generating tests and performing visual regression testing. It also enables the manipulation of the network layer and loading internals of web pages. Best practices include using short and idempotent scripts, splitting user account flows into separate tests, and cleaning up after each test case.

This talk explores unit testing in Angular applications, covering topics such as testing front-end applications, specifics of testing Angular, best practices, and educational resources. It discusses the anatomy of a unit test in both Jasmine and Jest, the setup and initial tests in Angular, testing user interaction and event handlers, testing rendered output and change detection, and unit testing parent components with child components. It also highlights best practices like using test doubles, testing components with dependency injection, and considerations for unit testing. Code coverage is emphasized as a metric that doesn't guarantee bug-free code.

This Talk discusses how to test mail service with Playwright, covering e-mail verification, reset password user journey, and more. It explores the use of third-party providers for reliable e-mail delivery and demonstrates how Playwright can help perform checks on e-mail content. The Talk also introduces the concept of a fake SMTP server and showcases how fixtures can be used to access the SMTP server and perform assertions on the HTML body of emails. Playwright's HTML rendering feature allows for interaction with email content as if it were a regular web page. It highlights the ability to render HTML from API calls, perform assertions on the rendered page, and exclude dynamically generated data from visual regression tests.

The Talk discusses the need for more robust tools for visual testing in UI development. It explores the challenges in building UIs, including multiple views, variants, and breakpoints. The importance of component extraction and interactions is emphasized. The Talk also covers story derivation from components and interactions, UI testing with the test runner, and visual regression testing with Chromatic. Automating tests using GitHub Actions and common mistakes in using Storybook are discussed. The Talk concludes with a Q&A session.

This Talk provides ways to catch accessibility defects during testing, including adding accessibility testing to a website for Studio Ghibli using React, NX, Jazz, JazzX, Cypress, and CypressX. The importance of unitizing components and conducting end-to-end testing with Cypress and CypressX is emphasized to ensure accessibility. The process of setting up CypressX testing is explained, highlighting the use of typings and the CypressX support file. These tools make it easier for developers to avoid accessibility bugs during development.

This Talk discusses the use of end-to-end tests for API development, specifically using the Nest.js framework. The process of initializing the Nest API for testing is explained, along with customization options such as overriding authentication guards. The benefits of end-to-end tests are highlighted, including ease of modification and serving as additional documentation for the API. The challenges of writing the initial version of the test and a trick for mocking the date in tests are also mentioned.

This Talk explores the pain points and best practices in software testing, emphasizing the importance of simplicity and comprehensibility in test design. It discusses techniques such as the three-part rule for test titles, the triple-A pattern for test structure, and the use of clear and descriptive names in tests. The Talk also highlights the traps of testing implementation details and using fixed waiting times. The speaker encourages teamwork and learning from experience to improve testing practices.

Tandra is a company that builds modern tools for developers and QA engineers. Their flagship product, Foresight, helps monitor and debug CI-CD workflows and tests. The Talk discusses the reasons for end-to-end test failures, how to debug them, and the benefits of tracing. End-to-end tests can fail due to time-waiting issues, dependencies between tests, and inter-service communications. Debugging through logs and artifacts is possible, but tracing is more effective in uncovering root causes, especially in microservices.

Lambda Test is a cloud-based continuous quality platform that addresses common challenges faced by modern QA and development teams. These challenges include the need to shorten release cycles, the increase in test execution time due to test infrastructure, and the impact of flaky tests on developer feedback and productivity. Lambda Test offers a wide range of features, including live testing for virtual machines and native app testing, automation cloud for running test suites, and integration with various tools. The platform is known for its reliability, scalability, and performance, and can be quickly onboarded and integrated with existing test suites and CI-CD tools.

This Talk introduces the adaptation of end-to-end testing for a project, highlighting its benefits in improving resilience and calmness during deployment. The speaker mentions the team's size, daily pull requests, and the size of their codebase. They also discuss the use of cookies to test different versions of a feature on a page and their plan to improve by adding E2E tests to a CICD pipeline and consolidating tests in their monorepo.

Arjun introduces Playwright, a library for cross-browser end-to-end testing of web applications. The challenges in modern web testing include the evolving web platform and reactive frameworks. Playwright provides capable, reliable, and fast automation, with the ability to capture events and enhance test reliability. It uses browser contexts for faster execution and supports multiple languages and frameworks. Playwright is used by companies like VS Code, Bing, Adobe, and material UI, and offers cross-browser support and an improving roadmap.

The Talk discusses common mistakes in Cypress tests, such as accessing the file system directly instead of using the Cypress command, and the importance of writing effective Cypress tests for different scenarios. It also emphasizes the need for adding assertions during navigation and alternating commands and assertions. The Talk highlights the significance of documentation and examples in providing support and addresses the advantages of using the Cypress Node test runner. It concludes with tips on debugging, data tests, and testing user journeys and edge cases.

Concept.js is a BDD style testing framework focused on browser testing, offering easy switching between engines and Cucumber BDD support. The Pulse feature in Concept.js allows for interactive test execution and editing. Concept.js provides a user-friendly interface, reporting options, and supports parallel execution. CodeSap.js offers strategies for dealing with slow-loading elements and provides flexibility in browser control. Contributing to Concept.js is encouraged, and CodeSap.js is a good choice for advanced features and full browser control.

Browser automation has evolved over the years, starting with Selenium and WebDriver. Tools like Cypress, Taskerfee, Puppeteer, and Playwise use different approaches for automation. The new WebDriver protocol will enable sending and receiving thousands of commands and messages simultaneously. New testing types, such as performance and accessibility testing, will continue to emerge. The new WebDriver protocol combines the best of all three approaches and provides opportunities for testing and automating web applications.