Cypress Vs Selenium (Everything You Need To Know)

Selenium and cypress both are test automation tools used for web applications. Selenium is a well-established player while Cypress is comparatively new in the test community, however, it has gained lots of popularity in no time. Nowadays it is a very prominent question Which tool is better cypress or selenium(Cypress Vs Selenium)? In my opinion, it totally depends on your requirement, and if you are well-versed in one automation framework then it is not going to be difficult to learn another one. In this article, I have tried to list down the similarities and differences between both frameworks.

1)Commands:

Function	Selenium	Cypress
Launch the URL in the Browser	driver. get(URL)	cy.visit(URL)
Locate the web element	driver.findElement()	cy.get()
Wait for a specified period of time	thread.sleep(time)	cy.wait()
Enter text in the Textbox	driver.sendKeys()	cy.type()
To Check the visibility of the element	driver.findElement().isDisplayed()	cy.get(‘selector’).should(‘be.visible’)
To Check/Assert Text(Assertion)	assertEquals(driver.findElement.getText(),expected text)	cy.get(‘selector’).should(‘have.text’,text)
Check Checkbox	driver.findElement().click()	cy.get(‘[type=”checkbox”]’).check()
Clear or reset an input field	.clear()	cy.get().clear()
Perform Double Click	Use actions class	cy.get(‘button’).dblclick() cy.contains(”).dblclick()
Reload/Refresh page	driver. navigate().refresh()	cy.reload()
Cookies	driver.manage().deleteAllCookies();	cy.clearCookies()

2)Key Differences

	Selenium	Cypress
Supported language	Java, c#, Python, JavaScript, Ruby	JavaScript
Supported Browser	Chrome, Firefox, Safari, Edge	Chrome, Electron, Firefox
Supported Test frameworks	MochaJS, Jest, WebDriverIO, and other wrappers like Selenoid	MochaJS
Type of Tests	Integration Tests, E2E tests, UI testing	E2E, Unit Tests
Community Support	Robust community	Emerging

3)Key Strengths and ShortComings

a)Selenium:

Strength	Disadvantage
Cross-browser and Cross-platform	The flakiness of the tests
Multilanguage Support	Speed, Execution time
Testing of Mobile applications, Availability of several wrapper tools, Strong Community Support	Lots of Configuration is required to SetUp the test environment
Support of Parallel testing and Cloud platforms integration	No Built-in command for the automatic generation of test results.

b)Cypress:

Strength	Disadvantage
Automatic wait handling hence the execution is fast	Does not provide support for multi-tabs
Time Travel(Captures screenshot at the time of execution)	Two browsers can not be driven at the same time
Does not require additional configuration or dependencies.	Limited support for Iframes
No network lag or test flakiness	Tests can be written only in JavaScript
Cypress auto-accepts alerts and popup	Support only CSS selector
Bundles with the Chai assertion library.	Mouse Hover events are not supported, need to use JQuery or force click.

4)Architecture

Selenium web driver is not a standalone tool. It comprises Language bindings, JSON Wire Protocol, Browser Drivers, and Browses. It operates by running outside the browser and executing remote commands across the network. Selenium can run tests on the browsers only if they are locally installed, either on the local machine or on the server machines. So browser installation is necessary.

The Cypress engine directly operates inside the browser. In other words, It is the browser that is executing your test code. This enables Cypress to listen and modify the browser behaviour at run time by manipulating DOM and altering Network requests and responses on the fly.

5)Code Snippet(Cypress Vs Selenium)

Task:

• Launch URL “https://Google.com”
• A search query in the search bar
• Print results

Cypress Code snippet:

describe('Cypress Test', () => {
  it('Google Search', () => {
    // Visit Google
    cy.visit('https://www.google.com/')

    // Get Search Bar and enter the search keyword
    cy.get('input[name="q"]').type('Cypress');

    // Submit the Search
    cy.get('input[value="Google Search"]').first().click();

    // Get Search Results
    cy.url().then(url => {
      const getUrl = url
      cy.log('Results URL: '+getUrl)
    })
  })
})

Selenium script:

public class GoogleSearch{
   public static void main(String[] args) {
      WebDriverManager.chromedriver().setup();
      driver = new ChromeDriver();
      driver.manage().timeouts().implicitlyWait(5, TimeUnit.SECONDS);
      driver.get("https://www.google.com/");
      // identify element
      WebElement p=driver.findElement(By.name("q"));
      //enter text with sendKeys() then apply submit()
      p.sendKeys("Selenium Java");
     
     
     p.submit();
      driver.close();
   }
}

Cypress is specifically targeted towards developers and QA engineers to facilitate test-driven development coupled with end-to-end testing. However, Cypress requires some programming experience in JavaScript to utilize the tool effectively. Furthermore, it will not be as feature-rich as Selenium and may require additional configurations and workarounds since it is a newer solution.