{"id":13660,"date":"2018-10-16T05:49:56","date_gmt":"2018-10-16T05:49:56","guid":{"rendered":"https:\/\/app14743.cloudwayssites.com\/blog\/?p=3660"},"modified":"2021-03-06T00:27:40","modified_gmt":"2021-03-06T00:27:40","slug":"cypress-vs-selenium-webdriver-better-or-just-different","status":"publish","type":"post","link":"https:\/\/app14743.cloudwayssites.com\/blog\/cypress-vs-selenium-webdriver-better-or-just-different\/","title":{"rendered":"Cypress vs Selenium WebDriver: Better, or just different?"},"content":{"rendered":"

There\u2019s a new claim to the throne of functional test automation tools: <\/span>Cypress.io<\/span><\/a>. Is Cypress fast? Yes. Is Cypress interactive? Yep. Is Cypress reliable? You bet. And best of all\u2026 it\u2019s cool! <\/span><\/p>\n

But is Cypress an alternative to <\/span>Selenium WebDriver<\/span><\/a>? Does Selenium, the current king of web automation and testing frameworks, cringe in fear for its position, or is it smiling benevolently at the supposed usurper, knowing full well that, well, it\u2019s just a kid!<\/span><\/p>\n

Is Cypress better than Selenium WebDriver? I get asked this a lot. And frankly, the easiest path of a \u201cthis vs that\u201d article is to try and find out which is \u201cbest\u201d. But I will not take that path. Instead, I will try and explain how is Cypress <\/span>different<\/span><\/i> from Selenium WebDriver.<\/span><\/p>\n

<\/p>\n

By describing what is the difference between Cypress and Selenium WebDriver, you will be able to understand how Cypress works. This post will also try and explain <\/span>why<\/span><\/i> Cypress took the path it did to web browser automation, a path that is remarkably different than the path WebDriver took.<\/span><\/p>\n

How is Cypress similar to Selenium WebDriver? They both control and automate the web browser, thus enabling you to write functional tests that simulate the actions that a user does, and verifying that the results are correct. But that is where the similarity ends, and the differences begin. Hopefully, knowing the differences between these two testing tools, and knowing the reasons for that difference, will help <\/span>you<\/span><\/i> choose which tool to use, and when. <\/span><\/p>\n

So let\u2019s start exploring these differences. <\/span><\/p>\n

It\u2019s For Frontend Developers!<\/span><\/h2>\n

\"\"Selenium WebDriver was built for end-to-end regression tests of web applications. The Selenium front end testing framework is mostly used by QA developers, and not so much developers. This is because the idea of front-end developers testing their own code is not common. <\/span><\/p>\n

But a small revolution is starting to happen in the world of frontend developers. Frontend developers are starting to write their own tests. Yes, they are rising to the challenge of <\/span>agile software methodologies<\/span><\/a>. They understand that without writing their own tests, agile development cannot happen. They are writing unit tests, but also integration, and, yes, end-to-end functional tests that check their frontend using real browsers, just like the automation tests that QA developers write. The \u201c<\/span>Shift Left<\/span><\/a>\u201d movement has a lot of these trends.<\/span><\/p>\n

Frontend developers\u2019 needs for end to end tests are different than those of QA developers. Frontend developers don\u2019t need a staging environment where the <\/span>whole <\/span><\/i>application\u2014frontend, backend, and database systems\u2014is deployed. They can get by with just the frontend part running locally, and <\/span>mock the backend<\/span><\/a> pretty easily.<\/span><\/p>\n

This fact — the target audience of Cypress is frontend developers — lies at the heart of all the differences between Cypress and WebDriver. They\u2019re different tools for different users.<\/span><\/p>\n

It\u2019s JavaScript Only!<\/span><\/h2>\n

\"\"Frontend web developers <\/span>write in only one language\u2014JavaScript<\/span><\/a>. It is the only language that browsers can execute, and so they have no other choice. This limitation has its downsides and its upsides, but the fact exists\u2014there is only one language for frontend developers (variants like <\/span>TypeScript<\/span><\/a> notwithstanding). <\/span><\/p>\n

And, because Cypress is meant for frontend developers, Cypress tests can only be written in JavaScript. No other languages are supported. Compare that to Selenium WebDriver, which has an API with many <\/span>language bindings<\/span><\/a>, including Java, C#, Python, Ruby, R, Dart, Objective-C, and, yes, JavaScript.<\/span><\/p>\n

So remember\u2014if you want to do Cypress testing, you will have to learn JavaScript. Which is cool, because JavaScript today is not your grandparents\u2019 JavaScript. It\u2019s a modern, powerful, and concise language that is widely used today and has the largest open source package repository in the world (<\/span>npm<\/span><\/a>), a code repository that a few years back <\/span>overtook what used to be the largest repository<\/span><\/a>, the <\/span>Java Maven<\/span><\/a> repository.<\/span><\/p>\n

It\u2019s Mocha Only!<\/span><\/h2>\n

\"\"Cypress doesn\u2019t only limit you in the language you can write, but also limits which testing framework you use. <\/span>Mocha<\/span><\/a> is the testing framework that you write your tests with (a testing framework\u2019s role in JavaScript is similar to the role <\/span>Junit<\/span><\/a> has in Java, or <\/span>NUnit<\/span><\/a> in C#). You cannot write your tests in another JavaScript framework, such as <\/span>Jest<\/span><\/a> or <\/span>Tape<\/span><\/a>.<\/span><\/p>\n

Selenium WebDriver, on the other hand, does not impose a testing framework on you. Moreover, you don\u2019t even have to use a testing framework. You can write a regular program that is not a test, a program that just drives the browser. Many projects use WebDriver that way, for example to crawl web pages and gather information.<\/span><\/p>\n

But Cypress decided early on that it is dedicated to the task of writing frontend tests, and can <\/span>only<\/span><\/i> be used within a testing framework, and that testing framework MUST be Mocha.<\/span><\/p>\n

Enough already. Show Me Some Cypress Code!<\/span><\/h2>\n

\u201cOK, OK, I got it,\u201d I hear you saying. But can you <\/span>please<\/span><\/i> show me a Cypress test so that all this will be a bit less abstract? Sure, here you go:<\/span><\/p>\n