Cypress V/S Selenium

 

Cypress V/S Selenium

During my learning of Cypress, I noted down a few important differences between these tools.

Documentation: Cypress Selenium

Feature	Cypress	Selenium
Language Support	JavaScript	Multiple languages including Java, C#, etc.
Test Architecture	Mocha test runner and Chai assertion library built-in	Requires separate test frameworks and assertion libraries
Browser Support	Chrome, Firefox, Electron	Multiple browsers including Chrome, Firefox, Safari, Edge, etc.
Test Structure	Built-in test runner and assertion library	Needs separate test runners and assertion libraries
Test Execution	Faster execution	Slower execution due to the use of WebDriver
DOM Manipulation	Native commands for DOM manipulation	Needs to use JavaScriptExecutor for DOM manipulation
Locators	Cypress uses jQuery-like syntax for selecting elements	Selenium uses various locating strategies such as XPath, CSS Selector, etc.
Automatic Waits	Automatically waits for commands to complete before moving on	Requires explicit wait statements
Debugging	Cypress provides an interactive debugger	Selenium does not have built-in interactive debugger
Cross-browser Testing	Limited cross-browser testing support	Strong cross-browser testing support
Community Support	Cypress has a smaller but active community	Selenium has a larger and more established community
Learning Curve	Easier to learn and get started with	Steeper learning curve compared to Cypress
Screenshot and Video Capture	Built-in commands for capturing screenshots and videos	Requires additional code to capture screenshots
Dashboard Support	Cypress Dashboard provides test run visualization and analytics	Selenium does not have built-in dashboard support



Assertions

Assertion Technique	Cypress	Selenium
Built-in Assertion Library	Cypress provides a built-in assertion library cy.get('h1').should('have.text', 'Welcome to my App')	Selenium does not have a built-in assertion library Assert.assertEquals("Welcome to my App", driver.findElement( By.tagName("h1")).getText())
Chaining	Cypress allows chaining of commands for easy assertions cy.get('input').type('test').should ('have.value', 'test')	Selenium does not support chaining of commands for assertions driver.findElement(By.id("input")). sendKeys("test"); assertEquals("test", driver.findElement(By.id("input")). getAttribute("value"));
Async/Await	Cypress supports async/await syntax for assertions await cy.get('button').click()	Selenium does not support async/await syntax for assertions. WebElement button = driver.findElement(By.id("button")); WebElement button = driver.findElement(By.id("button")); WebElement button = driver.findElement(By.id("button")); element.click();
Error Messages	Cypress provides detailed error messages for easy debugging cy.get('input').should('have.attr', 'required')	Selenium error messages may be more cryptic and difficult to debug assertTrue(driver.findElement(By. id("input")).getAttribute("required") != null);
Negation	Cypress allows easy negation of assertions with the not keyword	Selenium requires the use of the assertNot method for negation of assertions
Custom Assertions	Cypress allows for easy creation of custom assertions	Selenium requires more setup for creating custom assertions
Retry	Cypress automatically retries assertions until they pass or time out	Selenium does not have built-in retry functionality for assertions
		
		



Assertion Technique	Cypress	Selenium
Equality	expect(foo).to.equal(bar)	assertEquals(foo, bar)
Existence	cy.get('.selector').should('exist')	assertTrue(driver.findElement (By.cssSelector(".selector")). isDisplayed())
Visibility	cy.get('.selector').should('be.visible')	assertTrue(driver.findElement (By.cssSelector(".selector")). isDisplayed())
Behavioral	cy.get('.selector').should('have.class', 'active') cy.get('.selector').should('have.css', 'background-color', 'rgb(255, 0, 0)') cy.get('.selector').should('contain.text', 'Hello, World!')	Actions actions = new Actions(driver); WebElement element = driver.findElement(By. cssSelector(".selector")); actions.moveToElement (element).perform(); assertTrue(element. getAttribute("class"). contains("active")); assertEquals("rgb(255, 0, 0)", element.getCssValue ("background-color")); assertEquals(true, element.getText().contains ("Hello, World!"))