2 types of testing you are not doing enough of

Kristoffer Helgesen Kristoffer Helgesen has been working as a frontend consultant in Oslo for 5+ years and helped many projects and customers to modernize or replace their web solutions. He has development experience with all three major frontend frameworks: Angular, Vue, React as well as experience in universal design, speed optimization, design systems and reusability.

12/21/2023 |

You might have encountered a developer asking if he could write some tests for the application, and you thought to yourself: why is that important, or why should I set aside a budget for that? Or you might be a developer who has been asked to write tests for something you've already completed and asked yourself: why it is working most of the time?

In this article, I will explain two types of testing, end-to-end (e2e) and unit testing, that most projects and developers are not doing enough of and why you should invest (more) time and money into them.

I will write from a senior front-end developer's perspective, having worked with both small and big customers.

What do tests help you with?

Tests help you with all different types of issues within an application. But the one big aim is to increase the app's availability/stability. This requires tests for both the front end and back end.

When should you invest in testing?

Depending on the size of the app, I would start writing tests after the first version of your application has been released. This will mitigate the need to refactor both tests and the application in the most insecure development phase, where you have not yet been able to get any feedback from a stakeholder.

If the first release is larger, I suggest writing tests from the start, as this will also give the programmer a new perspective on their code, prevent bugs, and give a more solid base to build from.

There are many types of tests, but in this blog post, I will focus on two types of tests that I believe both projects and most developers are not spending enough time creating and maintaining: End-to-End (e2e) and Unit tests.

What is end-to-end testing?

Testing your code from the user's point of view is called end-to-end, or e2e, testing. The only thing that counts is whether the user's actions correctly match the intended output, by automating the user's actions. The whole interaction is conducted with the black box mentality (the automation does not know what is happening under the hood). A typical e2e test could be to check if you can fill out a form and that a confirmation message is displayed after submitting the form.

You can check the complete application with end-to-end testing, including databases, backend services, and user interface. Additionally, it can assist you in identifying potential problems relating to integrating multiple components, like compatibility issues, network latency, and configuration errors.

Benefits of end-to-end testing:

It mimics real-world situations.
It can help you find problems that other testing methods might miss.
It puts the user's experience first and ensures the application satisfies their needs and expectations.
It decreases the possibility of releasing defective or lacking products, which could decrease user satisfaction.

Drawbacks of end-to-end testing:

It can be fragile and require frequent updates, as any changes in the application or the environment can affect the test results.
It is often time-consuming and resource-intensive due to the complexity of the test scenarios and the need to maintain a realistic test environment.
It can be difficult to isolate and debug issues, as multiple factors or components may cause them.

What is unit testing?

Testing software systems' various components separately is the main goal of unit testing. A software system's smallest testable “part,” such as a function, class, or module, is called a unit. When writing unit tests, you may find problems and bugs in your code, and this assists you in enhancing the maintainability and reusability of your components.

Advantages of unit testing:

Detect bugs early in the development cycle when they are easier and less costly to fix.
It increases the confidence and quality of your code, as you can ensure that each unit works as expected.
It facilitates the refactoring and modifications of your code, as you can quickly verify that your changes do not break the existing functionality.

Disadvantages of unit testing:

It does not test the integration and interaction of different components, which may lead to unexpected issues or failures in the system.
It may require a lot of mocking and stubbing of dependencies, making the tests less realistic and more complex. It may not cover all the scenarios and edge cases, as it is impossible to test every input and output of a unit.

How do you choose between unit testing and end-to-end testing?

Although they serve different objectives and have different scopes, unit testing and end-to-end testing are valuable and necessary web development methods. Finding the ideal balance and combination of both is, therefore, more important than picking one over the other.

The testing pyramid is a popular methodology that recommends having more unit tests than end-to-end tests because the former are more dependable, quicker, and take less time to write. But to make sure that your system functions as a whole and that it satisfies the needs and expectations of the user, you also need to have some end-to-end testing.

A good rule of thumb is to use unit testing for testing the functionality and logic of your code and end-to-end testing for testing the behavior and performance of your system. You should also consider the following factors when deciding what and how to test:

The complexity and size of your system: The more complex and larger your system is, the more end-to-end tests you may need to cover all the possible scenarios and interactions.
The frequency and impact of changes: The more often and significantly you change your code, the more unit tests you may need to ensure that your changes do not introduce new bugs or regressions.
The availability and reliability of your system: The more critical and sensitive your system is, the more end-to-end tests you may need to ensure that your system is always available and reliable.

What is performance testing?

Performance testing often completes an end-to-end testing period, measuring how well a webpage performs under different conditions, such as:

Network speed
Device type
Browser version
User behavior

Performance testing can help web developers identify and fix issues that affect the user experience, such as slow loading, layout shifts, unresponsive elements, and more. Performance testing can also help web developers optimize their web pages for better efficiency, usability, and accessibility.

Google Lighthouse is a tool that helps web developers improve the quality and performance of their web pages. It can analyze any web page, whether it is public or requires authentication, and provide a report with scores and suggestions for various aspects of the page, such as accessibility, SEO, progressive web apps, and more. Google Lighthouse can be run in different ways, such as in Chrome DevTools, from the command line, as a Node module, or as a Chrome extension. It can also be integrated into continuous integration (CI/CD) systems to prevent regressions and ensure best practices. Google Lighthouse is an open-source project that anyone can contribute to or use for their own purposes and is by far one of the quickest and easiest performance tests to run! To make sure you have adequate code coverage in regards to unit testing, I would integrate a tool like SonarQube into your CI/CD pipe. This will make sure the code is up to standard and that the code has hit a specific test coverage level. 80% code coverage is enough in most cases, 100% is a bit too hairy of a goal. To make the coverage report available to others, SonarQube offers a cloud solution that makes it easy to keep track of the progress for less technical people.

Conclusion

Testing is essential to web development, as it helps you deliver high-quality, reliable, and performant web products. There are several types of testing techniques, such as unit testing and end-to-end testing, that can help you verify various aspects of your system. You should use a combination of both, depending on the nature and scope of your system, and follow the best practices and principles of testing. By doing so, you can improve your development process, your code quality, and your user satisfaction.

I hope this was insightful and helped answer some questions about testing! 💚