{"id":4414,"date":"2022-07-26T08:57:05","date_gmt":"2022-07-26T08:57:05","guid":{"rendered":"https:\/\/codewaveinsdev.wpengine.com\/?p=4414"},"modified":"2022-10-13T05:28:02","modified_gmt":"2022-10-13T05:28:02","slug":"cypress-test-automation","status":"publish","type":"post","link":"https:\/\/codewave.com\/insights\/cypress-test-automation\/","title":{"rendered":"Cypress: a new-age framework for testing modern web applications"},"content":{"rendered":"\n<p>Web app testing is a time-intensive process, especially when we have to test really large &amp; complicated applications. Cypress, a highly popular&nbsp;<a rel=\"noreferrer noopener\" href=\"https:\/\/insights.codewave.com\/test-driven-development\/\" target=\"_blank\">web automation testing<\/a>&nbsp;framework,&nbsp;<a rel=\"noreferrer noopener\" href=\"https:\/\/github.com\/cypress-io\/cypress\" target=\"_blank\">39.6K stars on Github<\/a>, promises to kiss the pain away from testing web applications, locally or in a devOps environment (CI\/CD&nbsp; pipeline).&nbsp;<\/p>\n\n\n\n<h2 id=\"wait-didnt-we-already-have-selenium-for-web-automation-testing\" class=\"wp-block-heading\"><strong>\u2026wait, didn\u2019t we already have Selenium for&nbsp;web automation testing?<\/strong><\/h2>\n\n\n\n<p>Undoubtedly, Selenium is brilliant, but it\u2019s a bare bone testing framework. For every small functionality, you have to write things from scratch. Even for taking screenshots :\/&nbsp;<\/p>\n\n\n\n<p>Also, debugging is relatively painful in selenium if we compare it with Cypress.&nbsp;<\/p>\n\n\n\n<p>On top of all this, you should be well versed in Java or Python or any other scripting languages supported by Selenium. Selenium does support Javascript as well, but you have to use a&nbsp;<em>selenium javascript executor object<\/em>&nbsp;every single time.<\/p>\n\n\n\n<p><\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/codewavetechnologies\/image\/upload\/v1658837836\/cypress-install\/Cypress_web_automation_testing_framework.png\" alt=\"\" width=\"690\" height=\"387\"\/><figcaption>Cypress web automation testing framework<\/figcaption><\/figure>\n\n\n\n<p>On the other hand,&nbsp;<strong>Cypress<\/strong>&nbsp;\u2013 by design is built for javascript i.e., the language the web speaks. Cypress is a modern web automation testing framework and brings testing closer to the web application as now you can seamlessly test using Javascript itself.&nbsp;<\/p>\n\n\n\n<p><\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/codewavetechnologies\/image\/upload\/v1658837836\/cypress-install\/cypress_test_automation_framework.png\" alt=\"\"\/><figcaption>cypress test automation framework<\/figcaption><\/figure>\n\n\n\n<p>With Cypress, you can write, run, and record tests simultaneously.<\/p>\n\n\n\n<h2 id=\"cypress-architecture\" class=\"wp-block-heading\"><strong><span style=\"text-decoration: underline;\">Cypress Architecture<\/span><\/strong><\/h2>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/codewavetechnologies\/image\/upload\/v1658837836\/cypress-install\/cypress_architecture_test_automation.png\" alt=\"\"\/><figcaption>cypress architecture test automation<br><\/figcaption><\/figure>\n\n\n\n<p>There are a ton of web test automation tools available out there, but most of them use selenium under the hood. So, they end up solving the same set of problems, and they end up with similar sets of problems as well.&nbsp;<\/p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\"><p>Cypress is different, as it doesn\u2019t use selenium.<\/p><\/blockquote>\n\n\n\n<p><\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/codewavetechnologies\/image\/upload\/v1658837835\/cypress-install\/cypress_architecture.png\" alt=\"\"\/><figcaption>cypress architecture<\/figcaption><\/figure>\n\n\n\n<p>Cypress is built from the ground-up. Unlike selenium based tools, Cypress does not just run from outside the browser, but operates &amp; executes commands from within the browser in the same&nbsp;<a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/EventLoop\">run-loop<\/a>&nbsp;where the web application under testing runs.&nbsp;<\/p>\n\n\n\n<p>It is installed locally in your system, or cloud testing environment to make use of the OS (operating system) functionalities as well i.e., it provides out-of-the-box (OOTB) solutions for test automation screenshots &amp; video recordings, and file system operations.&nbsp;<\/p>\n\n\n\n<p>It can also be used to test network layer related operations by intercepting, validating, modifying network operations like request payload, cookies, response body, etc., as needed for testing. With intercepting functions you can use assertions to test complex UI functionalities of web apps built using modern JS frameworks \u2013 ReactJs, Angular, Vue, Elm. Assertions help you match the desired state of an app \u2013 a url change, or rendering of a UI element.<\/p>\n\n\n\n<figure class=\"wp-block-pullquote\"><blockquote><p>Read our insight on&nbsp;<a href=\"https:\/\/insights.codewave.com\/appium-setup\/\">Appium setup guide<\/a>.<\/p><\/blockquote><\/figure>\n\n\n\n<h2 id=\"cypress-features\" class=\"wp-block-heading\"><span style=\"text-decoration: underline;\"><strong>Cypress features<\/strong><\/span><\/h2>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/codewavetechnologies\/image\/upload\/v1658837835\/cypress-install\/cypress_supported_browsers.png\" alt=\"\"\/><figcaption>cypress supported browsers<\/figcaption><\/figure>\n\n\n\n<p>Cypress\u2019s unique architecture imparts it unique capabilities:<\/p>\n\n\n\n<ul><li>End-to-end frontend testing; functionality testing;<\/li><li>Network layer access enables texting beyond XHR requests, you can intercept css or image files, or graphQL requests if needed.<\/li><li>You can&nbsp;<em>stub<\/em>&nbsp;(fake an application state programmatically) web applications &amp; browsers, and test a unique UI object or functionality depending on what your test case demands. For example, change the response code to 500, or 403; or send an empty response. You can also skip the UI flow to create a particular application state before you test the intended functionality of the application. For example, skipping the login prerequisite before testing adds to cart functionality of an ecommerce web application by faking the login state. This helps speed up the testing process. But yes, using these shortcuts demand high proficiency with testing &amp; with cypress as well.<\/li><li>You can modify DOM elements in Cypress i.e.,&nbsp;<em>show hidden UI elements<\/em>.<\/li><li>Cypress automatically&nbsp;<em>detects animations and waits<\/em>&nbsp;before interacting with such elements.<\/li><li>It also automatically ensures that the&nbsp;<em>element is visible<\/em>&nbsp;before it performs any operations on it. For example, scrolling a UI element into view before clicking on it.<\/li><li>An interesting Cypress feature is to&nbsp;<em>time-travel<\/em>. With Cypress you can pin-point to a particular line of code (using command log) and see the application state, the after and before&nbsp;<em>screenshots<\/em>&nbsp;of executing that code. All this without the need to write any extra line of code.<\/li><li>You can&nbsp;<em>customize the view port<\/em>&nbsp;in real time,<em>&nbsp;change browsers<\/em>&nbsp;within the Cypress window, and analyze the overview of failed\/successful test results, performance, etcetera in the dashboard.<\/li><li>Cypress makes&nbsp;<em>debugging<\/em>&nbsp;really easy. It provides command log with time-travel feature, highly detailed error reporting, flake-resistant inbuilt features, source maps to show code with bugs in your source file and not the translated file that browser loads. Highlighting the error prone code in browser loaded files makes it complex to identify the source of error in actual file.<\/li><li>Cypress auto reloads every time you make changes to the script, and executes commands in real-time.<\/li><li>It\u2019s available for multiple browsers.<\/li><\/ul>\n\n\n\n<h2 id=\"cypress-vs-selenium\" class=\"wp-block-heading\"><strong><span style=\"text-decoration: underline;\">Cypress vs Selenium<\/span><\/strong><\/h2>\n\n\n\n<figure class=\"wp-block-table\"><table><tbody><tr><th>Features<\/th><th>Cypress Automation<\/th><th>Selenium Automation<\/th><\/tr><tr><td>Language<\/td><td>JavaScript; Node.js package <br> <b>Tool:<\/b> Visual Studio code<\/td><td>Java, Python, Ruby, Kotlin, NodeJs <br> <b>Tool:<\/b> Eclipse, VSC, etcetera.<\/td><\/tr><tr><td>Developer Communication<\/td><td>Testing and development language are the same. Developers too can write test scripts, QA can fix small bugs (not recommended), or in other words; developers can collaborate more effectively with QA engineers to fix a bug.<\/td><td>Often the test scripting and web application languages are different. And so, even for small changes developer-QA collaboration becomes complex.<\/td><\/tr><tr><td>Default UI element locators\/selectors <\/td><td>It accept only css selector by default, but we can extend xpath functionality as well with cypress-xpath npm package.<\/td><td>Accepts both CSS and Xpath locators.<\/td><\/tr><tr><td>Assertion<\/td><td>Assertions can easily be implemented using JS and helps tackle flaky cases.<\/td><td>Soft\/hard assertions are available, but implementation could be tricky and lengthy based on the scripting language you use.<\/td><\/tr><tr><td>Reports<\/td><td>By default we have dashboard reports, no separate code needed to generate reports if you\u2019re using the free Cypress SaaS version.<\/td><td>No default reports, you have to write the code or use third party applications to generate reports.<\/td><\/tr><tr><td>External Reports<\/td><td>We have to install the packages and run the commands in the terminal to generate external reports.<\/td><td>We\u2019ve to write the code to generate the reports.<\/td><\/tr><tr><td>Failed Screenshots<\/td><td>By default, if test cases are failed, dashboard reports will give the screenshots.<\/td><td>You need to write code in selenium to take a screenshot when the test fails.<\/td><\/tr><tr><td>Project Setup<\/td><td>By default cypress will give the project setup.<\/td><td>We need to do project setup manually.<\/td><\/tr><tr><td>Video Preview<\/td><td>By default once the test cases are executed, dashboard reports will give the video preview. <\/td><td>There is no video recording functionality.<\/td><\/tr><tr><td>Alert Popup<\/td><td>Cypress by default handles alert popup, you don&#8217;t need to write any separate code.<\/td><td>We have to write separate code to handle the alert popup.<\/td><\/tr><tr><td>Hidden Elements<\/td><td>If we use <b>{force:true}<\/b> inside the click method, it will click the method forcefully, even if it is hidden. Useful for mocking functionalities.<\/td><td>We have to write a separate code to handle the hidden elements.<\/td><\/tr><tr><td>Finding Locators<\/td><td>By default the Test Runner tool has the feature to find the css selector.<\/td><td>We have a third party plugin to find the locators.<\/td><\/tr><tr><td>Browser support &amp; headless mode<\/td><td>1) In test runner tool we have option to select the browser before execution.<br>2) Through terminal we can run with and without headless mode.<br>3) It interacts the browser directly.<\/td><td>1) We have to download and set the webdriver path in selenium.<br>2) You need to set up configuration for headless mode.<br>3) It interacts to the browser with the help of .exe dependencies (WebDriver).<\/td><\/tr><tr><td>Wait<\/td><td>Here we only have one &#8216;wait&#8217; for all use-cases, and don&#8217;t need to write lengthy code to implement waits.<br><b>Note:<\/b> Here also explicit wait is possible<\/td><td>Here we have two &#8216;waits&#8217;, implicit wait and explicit wait and code implementation is lengthy depending on the language you use for writing test scripts.<\/td><\/tr><tr><td>Error Showing<\/td><td>Cypress provides a command log with aesthetic and detailed error reporting with potential solutions suggestions as well.<\/td><td>Selenium\u2019s error reporting is not aesthetic and gives developers a hard time in identifying issues.<\/td><\/tr><tr><td>Parameterization(Data-Driven)<\/td><td>Through fixture files we can create multiple sets of data, and expose it to the script.<\/td><td>Manually we have to impart the data-driven functionality to test the script for multiple streams of data.<\/td><\/tr><tr><td>Framework<\/td><td>Comes bundled with Mocha, Chai, Blob, JQuery, lodash, and other tools.<\/td><td>Need to configure framework, assertion libraries, and other commonly used libraries in test automation like Sinon.<\/td><\/tr><\/tbody><\/table><figcaption>cypress vs selenium &#8211; a head to head comparison<\/figcaption><\/figure>\n\n\n\n<p>Theory can be boring at-times, so how about getting your hands dirty with Cypress?&nbsp;<\/p>\n\n\n\n<p>Here\u2019s a guide to installing cypress. It\u2019s a prerequisite to writing scripts in Cypress (<a rel=\"noreferrer noopener\" href=\"https:\/\/www.linkedin.com\/company\/3265956\/\" target=\"_blank\">follow us<\/a>&nbsp;to not miss our insight on cypress web automation testing demo)<\/p>\n\n\n\n<h2 id=\"how-to-install-cypress\" class=\"wp-block-heading\"><strong>How to install Cypress<\/strong><strong>?<\/strong><\/h2>\n\n\n\n<p><strong>Cypress installation steps<\/strong><\/p>\n\n\n\n<p><strong>Step 1:<\/strong>&nbsp;Download &amp; install node.js &amp; npm<\/p>\n\n\n\n<p>To check the version of node and npm, we can use command line.<\/p>\n\n\n\n<p>Try&nbsp;<strong>node -v<\/strong>&nbsp;and&nbsp;<strong>npm -v&nbsp;<\/strong>&nbsp;to check node and npm version respectively. If it shows the results as in the following images, you have them installed.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/codewavetechnologies\/image\/upload\/v1658837835\/cypress-install\/node_version_check.png\" alt=\"\"\/><figcaption>To check node version<\/figcaption><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/codewavetechnologies\/image\/upload\/v1658837836\/cypress-install\/npm_version_check.png\" alt=\"\"\/><figcaption>To check npm version<\/figcaption><\/figure>\n\n\n\n<p><strong>Step 2:&nbsp;<\/strong>set NODE_HOME Environment variable<\/p>\n\n\n\n<p>Open the executable node.js file location (file path) from the directory where you installed NodeJS.&nbsp;<\/p>\n\n\n\n<p>Set the environment variable by opening&nbsp;<em>system settings&nbsp;<\/em>from the&nbsp;<em>control<\/em>&nbsp;<em>panel<\/em>&nbsp;-&gt; click on&nbsp;<em>properties<\/em>&nbsp;\u2013&gt; choose&nbsp;<em>Advanced system setting<\/em>&nbsp;\u2013&gt; click on&nbsp;<em>Environment variables<\/em>.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/codewavetechnologies\/image\/upload\/v1658837835\/cypress-install\/environment_variables.png\" alt=\"\"\/><figcaption>environment variables<\/figcaption><\/figure>\n\n\n\n<p>Now, paste&nbsp;<strong>NODE_HOME<\/strong>&nbsp;under&nbsp;<em>variable name<\/em>&nbsp;and the copied path under&nbsp;<em>variable value.<\/em><\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/codewavetechnologies\/image\/upload\/v1658837836\/cypress-install\/environment_path_variable_for_nodeJS.png\" alt=\"\"\/><figcaption>environment path variable for nodeJS<\/figcaption><\/figure>\n\n\n\n<p>You\u2019ll be able to see the newly added variable under system variables.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/codewavetechnologies\/image\/upload\/v1658837836\/cypress-install\/node_home_environment_variable.png\" alt=\"\"\/><figcaption>System variables<\/figcaption><\/figure>\n\n\n\n<p><strong>Step 3:&nbsp;<\/strong>Create cypress project folder<\/p>\n\n\n\n<p>Create a folder with project\/any name in a directory of your choice. You can do this using the UI or via command line.<\/p>\n\n\n\n<p><strong>Step 4:&nbsp;<\/strong>Generate\/add package.json into project folder<\/p>\n\n\n\n<p>In the cmd prompt move to the directory where you created the project folder<\/p>\n\n\n\n<p>Type&nbsp;<strong>npm init<\/strong>&nbsp;and click&nbsp;<em>enter.<\/em><\/p>\n\n\n\n<p>It asks you for project related details. It\u2019s a one time setup, but can be modified later as well.<\/p>\n\n\n\n<p>&nbsp;* package name : Add_a_projectname_of_your_choice<\/p>\n\n\n\n<p>&nbsp;* version: leave_it_default&nbsp;<\/p>\n\n\n\n<p>&nbsp;* description: leave_it_default<\/p>\n\n\n\n<p>&nbsp;* entry point: leave_it_default<\/p>\n\n\n\n<p>&nbsp;* test command: leave_it_default<\/p>\n\n\n\n<p>&nbsp;* git repository : leave_it_default<\/p>\n\n\n\n<p>&nbsp;* Keywords: leave_it_default<\/p>\n\n\n\n<p>&nbsp;* author: assign_an_author_name&nbsp;&nbsp;<\/p>\n\n\n\n<p>&nbsp;* license : leave_it_default<\/p>\n\n\n\n<p>&nbsp;It generates a package.json file.<\/p>\n\n\n\n<p><strong>Step 5:&nbsp;<\/strong>Install Cypress into the project folder<\/p>\n\n\n\n<p>Open the project folder in cmd prompt, and run a few command which installs cypress in your project directory and saves it in package.json<\/p>\n\n\n\n<p><strong>npm install cypress \u2013save-dev<\/strong><\/p>\n\n\n\n<p>Use the above command when you are installing cypress for the first time on a system. Next time if you recreate the test environment, or needs to reinstall cypress, you can avoid adding \u2013save, -dev, and use only:<\/p>\n\n\n\n<p><strong>npm install cypress<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/codewavetechnologies\/image\/upload\/v1658837836\/cypress-install\/install_cypress_test_automation_frameowrk.png\" alt=\"\"\/><figcaption>Cypress installation command<\/figcaption><\/figure>\n\n\n\n<p><strong>Step 6:&nbsp;<\/strong>Download Visual Studio Code<\/p>\n\n\n\n<p><strong>Step 7:&nbsp;<\/strong>Open Test Runner through VS code terminal<\/p>\n\n\n\n<p>==&gt; Test runner can be used to run our testcase<\/p>\n\n\n\n<p>Go to Terminal -&gt; New terminal<\/p>\n\n\n\n<p>Type:&nbsp;<\/p>\n\n\n\n<p><strong>node_modules\\.bin\\cypress open&nbsp;<\/strong><\/p>\n\n\n\n<p>(or) Type:&nbsp;<\/p>\n\n\n\n<p><strong>npx cypress open<\/strong><\/p>\n\n\n\n<p>That\u2019s it. This launches a fresh cypress instance. Now, you\u2019re ready to write scripts using Cypress to test web applications.<\/p>\n\n\n\n<h2 id=\"to-sum-it-up\" class=\"wp-block-heading\"><strong>To sum it up<\/strong><\/h2>\n\n\n\n<p><a href=\"https:\/\/insights.codewave.com\/test-driven-development\/\" target=\"_blank\" rel=\"noreferrer noopener\">Test driven development<\/a>&nbsp;of web applications is a must to build a secure app, to deliver a smooth customer experience. And Cypress is a brilliant programmatic &amp; UI powered web application testing automation tool.&nbsp;<\/p>\n\n\n\n<p>With features like \u2013 mocking, stubbing, command log, time travel to a specific instance of testing life cycle, automatic screenshots, video recordings of web automation scripts execution, detailed error reporting for debugging, source maps &amp; stack tracing, and auto-reloads \u2013 Cypress does simplify writing &amp; executing scripts locally and in DevOps environment.<\/p>\n\n\n\n<p><a href=\"https:\/\/www.linkedin.com\/company\/3265956\/\" target=\"_blank\" rel=\"noreferrer noopener\">Follow us on LinkedIn<\/a>&nbsp;for more tips &amp; tutorials around secure web app development.&nbsp;<a href=\"https:\/\/codewave.com\/contact\" target=\"_blank\" rel=\"noreferrer noopener\">Reach out to our consultants<\/a>&nbsp;for developing scalable, secure web apps. And if you\u2019re looking for a career in test automation -&gt; head to our&nbsp;<a href=\"https:\/\/codewave.com\/careers\/\" target=\"_blank\" rel=\"noreferrer noopener\">careers page<\/a>.<\/p>\n\n\n\n<div class=\"wp-block-buttons is-layout-flex wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button is-style-outline\"><a class=\"wp-block-button__link\" href=\"https:\/\/www.codewave.com\/contact\" target=\"_blank\" rel=\"noreferrer noopener\">CONTACT CODEWAVE&#8217;S Cypress CONSULTANTS<\/a><\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"Why developers are enticed towards Cypress for End-to-end web automation testing? With head to head Cypress vs Selenium testing comparison.\n","protected":false},"author":16,"featured_media":4416,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"csco_singular_sidebar":"","csco_page_header_type":"full","csco_page_load_nextpost":"","csco_post_video_location":[],"csco_post_video_url":"","csco_post_video_bg_start_time":0,"csco_post_video_bg_end_time":0,"footnotes":""},"categories":[31],"tags":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v24.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Cypress: a new-age framework for testing modern web applications<\/title>\n<meta name=\"description\" content=\"Cypress, a highly popular web automation testing framework, 39.6K stars on Github, promises to kiss the pain away from testing web apps.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/codewave.com\/insights\/cypress-test-automation\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Cypress: a new-age framework for testing modern web applications\" \/>\n<meta property=\"og:description\" content=\"Cypress, a highly popular web automation testing framework, 39.6K stars on Github, promises to kiss the pain away from testing web apps.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/codewave.com\/insights\/cypress-test-automation\/\" \/>\n<meta property=\"article:published_time\" content=\"2022-07-26T08:57:05+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-10-13T05:28:02+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/codewave.com\/insights\/wp-content\/uploads\/2022\/08\/cypress-test-automation.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1280\" \/>\n\t<meta property=\"og:image:height\" content=\"720\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Sakthivel\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Sakthivel\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"11 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/codewave.com\/insights\/cypress-test-automation\/\",\"url\":\"https:\/\/codewave.com\/insights\/cypress-test-automation\/\",\"name\":\"Cypress: a new-age framework for testing modern web applications\",\"isPartOf\":{\"@id\":\"https:\/\/codewave.com\/insights\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/codewave.com\/insights\/cypress-test-automation\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/codewave.com\/insights\/cypress-test-automation\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/codewave.com\/insights\/wp-content\/uploads\/2022\/08\/cypress-test-automation.jpg\",\"datePublished\":\"2022-07-26T08:57:05+00:00\",\"dateModified\":\"2022-10-13T05:28:02+00:00\",\"author\":{\"@id\":\"https:\/\/codewave.com\/insights\/#\/schema\/person\/f739e4a8b4d178f418fdaa0770bbe297\"},\"description\":\"Cypress, a highly popular web automation testing framework, 39.6K stars on Github, promises to kiss the pain away from testing web apps.\",\"breadcrumb\":{\"@id\":\"https:\/\/codewave.com\/insights\/cypress-test-automation\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/codewave.com\/insights\/cypress-test-automation\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/codewave.com\/insights\/cypress-test-automation\/#primaryimage\",\"url\":\"https:\/\/codewave.com\/insights\/wp-content\/uploads\/2022\/08\/cypress-test-automation.jpg\",\"contentUrl\":\"https:\/\/codewave.com\/insights\/wp-content\/uploads\/2022\/08\/cypress-test-automation.jpg\",\"width\":1280,\"height\":720,\"caption\":\"cypress-test-automation\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/codewave.com\/insights\/cypress-test-automation\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/codewave.com\/insights\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Cypress: a new-age framework for testing modern web applications\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/codewave.com\/insights\/#website\",\"url\":\"https:\/\/codewave.com\/insights\/\",\"name\":\"\",\"description\":\"Innovate with tech, design, culture\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/codewave.com\/insights\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/codewave.com\/insights\/#\/schema\/person\/f739e4a8b4d178f418fdaa0770bbe297\",\"name\":\"Sakthivel\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/codewave.com\/insights\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/4e641c6f1d09286a48845171c292560e?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/4e641c6f1d09286a48845171c292560e?s=96&d=mm&r=g\",\"caption\":\"Sakthivel\"},\"description\":\"Sakthivel is an end-to-end test automation consultant @ codewave specialising in Cypress, Selenium, and other QA tools.\",\"sameAs\":[\"https:\/\/codewave.com\"],\"url\":\"https:\/\/codewave.com\/insights\/author\/sakthivel\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Cypress: a new-age framework for testing modern web applications","description":"Cypress, a highly popular web automation testing framework, 39.6K stars on Github, promises to kiss the pain away from testing web apps.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/codewave.com\/insights\/cypress-test-automation\/","og_locale":"en_US","og_type":"article","og_title":"Cypress: a new-age framework for testing modern web applications","og_description":"Cypress, a highly popular web automation testing framework, 39.6K stars on Github, promises to kiss the pain away from testing web apps.","og_url":"https:\/\/codewave.com\/insights\/cypress-test-automation\/","article_published_time":"2022-07-26T08:57:05+00:00","article_modified_time":"2022-10-13T05:28:02+00:00","og_image":[{"width":1280,"height":720,"url":"https:\/\/codewave.com\/insights\/wp-content\/uploads\/2022\/08\/cypress-test-automation.jpg","type":"image\/jpeg"}],"author":"Sakthivel","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Sakthivel","Est. reading time":"11 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/codewave.com\/insights\/cypress-test-automation\/","url":"https:\/\/codewave.com\/insights\/cypress-test-automation\/","name":"Cypress: a new-age framework for testing modern web applications","isPartOf":{"@id":"https:\/\/codewave.com\/insights\/#website"},"primaryImageOfPage":{"@id":"https:\/\/codewave.com\/insights\/cypress-test-automation\/#primaryimage"},"image":{"@id":"https:\/\/codewave.com\/insights\/cypress-test-automation\/#primaryimage"},"thumbnailUrl":"https:\/\/codewave.com\/insights\/wp-content\/uploads\/2022\/08\/cypress-test-automation.jpg","datePublished":"2022-07-26T08:57:05+00:00","dateModified":"2022-10-13T05:28:02+00:00","author":{"@id":"https:\/\/codewave.com\/insights\/#\/schema\/person\/f739e4a8b4d178f418fdaa0770bbe297"},"description":"Cypress, a highly popular web automation testing framework, 39.6K stars on Github, promises to kiss the pain away from testing web apps.","breadcrumb":{"@id":"https:\/\/codewave.com\/insights\/cypress-test-automation\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/codewave.com\/insights\/cypress-test-automation\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/codewave.com\/insights\/cypress-test-automation\/#primaryimage","url":"https:\/\/codewave.com\/insights\/wp-content\/uploads\/2022\/08\/cypress-test-automation.jpg","contentUrl":"https:\/\/codewave.com\/insights\/wp-content\/uploads\/2022\/08\/cypress-test-automation.jpg","width":1280,"height":720,"caption":"cypress-test-automation"},{"@type":"BreadcrumbList","@id":"https:\/\/codewave.com\/insights\/cypress-test-automation\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/codewave.com\/insights\/"},{"@type":"ListItem","position":2,"name":"Cypress: a new-age framework for testing modern web applications"}]},{"@type":"WebSite","@id":"https:\/\/codewave.com\/insights\/#website","url":"https:\/\/codewave.com\/insights\/","name":"","description":"Innovate with tech, design, culture","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/codewave.com\/insights\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/codewave.com\/insights\/#\/schema\/person\/f739e4a8b4d178f418fdaa0770bbe297","name":"Sakthivel","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/codewave.com\/insights\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/4e641c6f1d09286a48845171c292560e?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/4e641c6f1d09286a48845171c292560e?s=96&d=mm&r=g","caption":"Sakthivel"},"description":"Sakthivel is an end-to-end test automation consultant @ codewave specialising in Cypress, Selenium, and other QA tools.","sameAs":["https:\/\/codewave.com"],"url":"https:\/\/codewave.com\/insights\/author\/sakthivel\/"}]}},"featured_image_src":"https:\/\/codewave.com\/insights\/wp-content\/uploads\/2022\/08\/cypress-test-automation-600x400.jpg","featured_image_src_square":"https:\/\/codewave.com\/insights\/wp-content\/uploads\/2022\/08\/cypress-test-automation-600x600.jpg","author_info":{"display_name":"Sakthivel","author_link":"https:\/\/codewave.com\/insights\/author\/sakthivel\/"},"_links":{"self":[{"href":"https:\/\/codewave.com\/insights\/wp-json\/wp\/v2\/posts\/4414"}],"collection":[{"href":"https:\/\/codewave.com\/insights\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/codewave.com\/insights\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/codewave.com\/insights\/wp-json\/wp\/v2\/users\/16"}],"replies":[{"embeddable":true,"href":"https:\/\/codewave.com\/insights\/wp-json\/wp\/v2\/comments?post=4414"}],"version-history":[{"count":0,"href":"https:\/\/codewave.com\/insights\/wp-json\/wp\/v2\/posts\/4414\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/codewave.com\/insights\/wp-json\/wp\/v2\/media\/4416"}],"wp:attachment":[{"href":"https:\/\/codewave.com\/insights\/wp-json\/wp\/v2\/media?parent=4414"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/codewave.com\/insights\/wp-json\/wp\/v2\/categories?post=4414"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/codewave.com\/insights\/wp-json\/wp\/v2\/tags?post=4414"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}