This is my archive

Software testing tools – Cypress.io vs Selenium comparison

Software testing is a part of the quality assurance process. The mentioned process consists of verifying by software testers all the functionalities implemented by developers work correctly. Based on that, testers provide information on the software quality and detected errors. Such an approach allows to identify errors, detect gaps and deficiencies in the requirements that must be met by the software. Software testing consists of verifying that all the functionalities implemented by developers work correctly. How to automate this process? The right software testing automated tool is the answer. But which one is right for you? Read this article to decide.

Why should you use software testing? 

What are the types of software testing? 

What are the benefits of software testing? 

Although software testing is an activity that requires additional effort and knowledge of specific tools, it brings excellent effects. They should be performed because you need to make sure that the user will be able to use the functionality offered by the mobile application or web software without any problems. Besides, they check whether the system will react correctly after performing specific actions. And what will happen if the user enters incorrect data or does not enter them at all. There are a lot of scenarios that need to be checked. Software tests are also a kind of documentation because each should be described appropriately and informs what it should do and how the application should react to it. 

What is automatic software testing?

Automatic software tests of an application are based on programming and using specific scripts. Such type of software testing is much faster and more reliable than manual testing because in less time more errors can be detected. A significant advantage is also the repeatability of tests. 

The disadvantage of such testing is the risk that the UX/UI design evaluation won’t be accurate because it isn’t checked by a human but by a computer. The scripts work only as programmed, which can miss apparent errors to an experienced manual tester.   

What is Selenium and how it works?

Selenium is an open-source software test automation tool. It is used to automate web browsers. The tool has been in the market for over a decade. It helps development teams provide quality test case automation for any browser using the Selenium WebDriver library. 

To use Selenium for software test automation, you need to download the driver for the browser of your choice: GeckoDriver for Firefox, ChromeDriver for Chrome, and so on. Selenium offers QA teams and developers a programming language choice because it is compatible with the most popular languages such as Java, JavaScript, C, C#, Ruby, and Python. 

The Selenium WebDriver relies on the JSON wire protocol for test case execution, which can be completed in three simple steps:

This leading test automation solution has served as the backbone of common test frameworks such as WebDriver and Protractor, in addition to testing frameworks like Appium, which is designed for mobile apps testing. It is this element of flexibility that, over the years, has positioned Selenium as a prominent enabler for automation in-browser testing.

Advantages of using Selenium:

Disadvantages of Selenium:

What is Cypress and how does it work?

Cypress is a JavaScript framework primarily for an end to end software testing.  

The Cypress’ idea is gathering all necessary tools like framework, assertion library, wrapper, or additional libraries into one tool.

Cypress offers a test runner (opensource) and dashboard function. The test runner allows you to view your tests’ status, preview your logs, preview your application – what is currently happening with the application, and how it behaves.

Advantages of using Cypress:

Disadvantages of using Cypress:

Selenium vs Cypress: better or different software testing?

Selenium WebDriver was created to perform regression testing for web applications. This tool is widely used for front-end testing by quality control teams. The concept of self-testing code by front-end developers is relatively new. This trend was started by the emergence of agile software development methodologies, which cannot be used optimally until frontend developers have the opportunity to test their code. 

Today, front-end developers can write their test code along with integration testing and end-to-end functional testing to evaluate the functionality of their front-end projects in real browsers. 

The parameters tested by front-end developers are similar to quality control parameters if their needs and goals are different. Front-end developers don’t need a transitional environment in which the entire application is deployed. 

Cypress was created for such needs. It was built specifically to meet the software testing needs of front-end developers. It allows them to test the frontend by running it locally. This is the main difference in testing approaches that distinguishes Cypress and Selenium WebDriver. Therefore, they are different tools for different user groups. 

Supported language

Another key difference when comparing Cypress to Selenium is that automated tests in Cypress can only be written using JavaScript while Selenium is an open-source tool and is compatible with many programming languages such as Java, JavaScript, C#, Python, Ruby. 

However, we shouldn’t count this argument as a limitation to using Cypress because it is primarily intended for front-end developers. JavaScript is a widely used front-end development language worldwide so the tool can be accessible to a broad user base in the target audience. 

On the other hand, Selenium is a comprehensive regression testing tool. It has an API configured with various related languages. Its versatility makes Selenium a more suitable choice for QA teams whose work scope is broader and more diverse. 

Software testing Frameworks

Cypress is not only limited by the programming language but also by the framework we can use. It is Mocha, which is used to write tests. Its role can be compared to JUnit in Java. However, it is not the only testing framework for JavaScript programmers as there are also Jest or Tape but Cypress, unfortunately, excludes those options.

On the other hand, Selenium WebDriver does not impose such restrictions for its users. You don’t even need a test framework when automating tests with Selenium. We can run tests by writing a program that controls the browser. 

Server Mocking

Cypress is user-centric and assumes that a real back-end most of the time may be redundant for front-end developers, so Cypress can be a faster alternative compared to Selenium because it has a server mocking feature. Developers work with mock XML HTTP requests to the server to speed up the testing process.

Mocking the server responses with Selenium WebDriver is also possible but the process is more complicated. To accurately mock server responses with Selenium, a test needs to run a mock server that returns the right responses.

The built-in server mocking feature is a more comfortable and more efficient way to perform the same process. 

Browser Support

Currently, Cypress is only compatible with Chrome, Firefox, Electron, Edge, and Brave. It does not work with Internet Explorer or Safari. It also lacks multi-tab support and cannot control more than one browser at a time. 

Selenium WebDriver has no such limitations and can test applications in Chrome, Internet Explorer, Safari, and mobile browsers. 

Summary

Cypress and Selenium are designed to automate web browsers. They differ slightly in their purpose, target user base, and architecture. Also, keep in mind that Cypress is a new tool, still developing and improving while Selenium is already an established tool in the field of automated software testing. 

Which one to choose depends on specific user needs. For JavaScript developers, Cypress is a great solution. For automating code testing on different browsers, sometimes even simultaneously, Selenium is a better choice. 

Product design tools – 15 tools to facilitate collaboration

Nowadays, being Creative could be challenging but working with the right product design tools make it easier. Every day, after you got your favorite cup of coffee, for the rest of the day, you need to be a User Experience Designer, User Interface Designer, Product Designer, Workshoper, Researcher, Facilitator, and be at every meeting. It is a daily routine for you.

As a Designer, you are probably a part of each step of the product design process. If I am right, you and your team are overwhelmed by requests, asap tasks, and problems that need to be solved quickly. There is too much information around you. It would be best if you learned which are essential in product design and only information noise. Being always on the same page is difficult and time-consuming.

You work in changing environments (Agile, Kanban, SCRUM), where all diverse teams have their processes, needs, and internal languages. In most cases, you need to be a unicorn. Catch the beat, move a design from an abstract idea to a finished product. Understand different project factors. One of them is the right workflow. It can keep you on track and facilitate close collaboration with clients, businesses, and, finally, users’ needs.

product design tools 1

Sure, but is it possible? I think – “Houston, we have a problem!”.

So, what can you do? Ask the right questions.

Soft skills and the transparent design process are essential factors for better product design. However, there is something more, which gives you a key for winning, especially in the newborn reality (post-Covid) – the right product design tools.

Below, there are four groups with a list of tools, which can help you in your daily work as a Designer.

product design tools 2

Tools to facilitate communication

During the day, you mainly work in the formula „together but alone”, which means that you have tasks, which are assigned to you only. It is essential to be in touch with team members and clients. When designing a product in CrustLab, the efficient flow of information is helped by product design tools:

Free tools:

Google tools
We all know Google tools such as Meet, Calendar, E-mail, and Drive. I will give you a few tips about them:

World time buddy

Remote work means collaborating with people from all over the world, often from different time zones. With the World Time Buddy tool, you can put all of your colleagues from other time zones and see where you have overlapped, identify „together time” and „alone time”.

Free/Paid tools:

Slack
It is a communicator for daily activities with some extra features. One is quite impressive. When you have a video call on Slack and share the screen, you have the opportunity to draw on that screen. It could help you better communicate product design ideas.

product design tools 3

Tools to facilitate documentation


The possibility of creating, collecting, distributing, and communicating results as much as access to the project documentation at any moment of work is a key value for better product design.

Free/Paid tools:

Google Docs

With these cloud resources, you can get ideas to share with your colleagues easily, get feedback, and work together on it.

Here are a few tips that will help you understand that Google Docs is one of the best product design tools:

Notion

It is free for personal use. When the project moves forward, and you need a workspace for the Documentation with a clear structure, the Notion is for you. You can create your company systems for knowledge management, note-taking, data management, project management, among others. The Notion’s mobile app has a great user experience, so you can always be on the page with a team.

„The pandemic has shown us that there is more to documentation than just ‘docs.’ Documentation is what enables us to get what we need.” – Rebecca Abara, Etsy – 10/14/2020 at Distributed2020.

product design tools 4

Product design tools

The heart of product design, however, lies elsewhere. It is time for product design tools that will facilitate the essence of your work. The applications described below allow you to design directly in the browser, which definitely enables group work.

Free/Paid tools:

Miro/Mural (virtual whiteboard)

They are collaborative whiteboards with digital sticky notes, where you can group them, vote for the best ones, and do all this while a timer counts down. You can use both web applications to facilitate workshops like Design Sprint, Strategy Workshop, MVP design workshops, Brainstorming with the client, or do a review with your remote team. Miro has a free plan, and Mural has a one-month free trial.

userinterviews.com

Are you designing the MVP version of the product and already have test scenarios ready but no testers? No worries, you can visit User Interviews and find the specific audience you need to test your ideas.

Figma

Figma has a free account, and it is a cloud application. What does it mean for you?

The cloud solution has a dark side. The application works only when you are online. Rarely but sometimes I don’t have access to my files for one or two hours. If you decide to use Figma, do backups whenever you finish your work.

Sketch

Sketch App started using primary symbols (components). It took product design to another level. You can create one item (ex. button) and use a reference for it. Why is it important? Whenever you change the primary symbol, their references change too. Developers work similarly.

Sketch App has one more value. It has an open code library. When the Designer meets the Developer, magic could happen. I will tell you a short story. In Cracow (Poland), a Front-End Developer from Brainly wanted to know how Designers work and how they use product design tools. He discovered that Sketch App has an open code library, and he can „hack” the App. He created a tool that generates the component (ex. button), which is the same in the Developers and Designers libraries. If it sounds interesting, keep reading.

html-sketchapp/React Sketch.app
One of the next steps of your product design is passing on the project to the Developers Team. Figma has a tool for that. If you use Sketch App, Zeplin is the best tool to collaborate with Developers. They will look at your project from their perspective, numbers, and CSS.

However, it is a pain point for both sides. We all are humans, and we try to understand problems and find solutions using our perspective. It is a common situation where the client accepts a designer’s project, but developers deliver something different. It is a gap, and all we know is the problem.

Software Development and Product Design Companies are trying to reduce that gap. These two tools: html-sketchapp and React Sketch.app, make it much more comfortable. Both work similarly. The developer collaborates with a designer, and he first creates a new item (ex. button). Next step, he runs one of the scripts above and generates our „button” with two of the same version:

Warring: These scripts work only with Sketch App (uses the open code library).

From that moment, two teams have the same elements and use them for their job, and there is no gap. It is not an easy way, but it is possible. Pixel Perfect can be great again. I recommend you checking the Brainly website and Web Application to see how html-sketchapp works in practice. Or check out alternative tools like Kactus and Abstract.

Summary: Both scripts are suitable for a more significant project. In the long-term, they could reduce cost, keep the project consistent even when the team rotates.

Tools to facilitate analysis

Qualitative, Quantitative data can help you understand, learn more about your audience, find answers to your questions, and verify the business hypothesis. Measuring your clients’ behavior enables you to uncover what is hidden behind the metrics, real problems, and needs. It is crucial for product design. There are a lot of methods and tools to do this.

In my opinion, Google Analytics is the best choice for quantitative research. For qualitative, it depends. Right questions help you take the right tools or methods.

For example, Hotjar or Cux.io show you how your audience uses your product (heatmaps, record session, stats).

What is the future like?

Newborn reality (post-Covid) speeds up the change in how we think about remote work and how we use design tools, either. In my opinion, we will work remotely more in the future. What does it mean? There will be more and more product design tools on the market. Right now, it is more than we need. See the list of The 2020 UX Research Tools Map.

Remember, the right tools give you:

Before you pick one of them, make sure that it will add value not only for you but also for your team, organization, or clients. Product design is a team game.