{"id":30590,"date":"2022-09-14T12:07:29","date_gmt":"2022-09-14T12:07:29","guid":{"rendered":"https:\/\/www.bacancytechnology.com\/blog\/?p=30590"},"modified":"2024-12-27T08:27:30","modified_gmt":"2024-12-27T08:27:30","slug":"angular-cypress-example-part-2","status":"publish","type":"post","link":"https:\/\/www.bacancytechnology.com\/blog\/angular-cypress-example-part-2","title":{"rendered":"Angular Cypress Example: Test Angular App using Cypress (Part 2)"},"content":{"rendered":"<h2>Introduction<\/h2>\n<p>In this blog, we will explore more about Automation testing using cypress in Angular with different scenarios. Before moving on to the tutorial, it would be helpful for you to understand the basics of testing your Angular application. For that, you can visit the <a href=\"https:\/\/www.bacancytechnology.com\/blog\/angular-cypress-example-part-1\" target=\"_blank\" rel=\"noopener\"><b>Angular Cypress Example Tutorial Part 1<\/b><\/a>.<\/p>\n<p>The last tutorial covered basic setup and a few testing scenarios. Today we will learn about a few advanced testing examples.<\/p>\n<p>So, let\u2019s get started with our blog.<\/p>\n<h2>Tutorial Goal: Angular Cypress Example<\/h2>\n<p>Visit the video below for an overview of what we will cover in the tutorial.<\/p>\n<p><iframe loading=\"lazy\" width=\"560\" height=\"315\" src=\"https:\/\/www.youtube.com\/embed\/GIBV7QIav00\" title=\"YouTube video player\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen><\/iframe><\/p>\n<h2>Basic Set Up<\/h2>\n<p>Clone the repository: <a href=\"https:\/\/github.com\/bacancy-parthsardhara\/cypress-testing-angular\" target=\"_blank\" rel=\"noopener\">angular-cypress-example<\/a> and follow these commands to set up the project in your system.<\/p>\n<p>Open a terminal and run the below command.<\/p>\n<pre>git clone https:\/\/github.com\/bacancy-parthsardhara\/cypress-testing-angular.git\r\ncd cypress-testing-angular\r\ngit checkout cypress-test\r\nnpm install\r\nng s -o\r\nnpm run cypress:open \/\/ chrome automated browser\r\n            OR\r\nnpm run cypress:run \/\/ terminal<\/pre>\n<p>Once done, you will be prompted, as shown below.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Basic-Set-Up-min.png\" alt=\"Basic Set Up\" width=\"1100\" height=\"826\" class=\"alignnone size-full wp-image-30614\" srcset=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Basic-Set-Up-min.png 1100w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Basic-Set-Up-min-300x225.png 300w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Basic-Set-Up-min-1024x769.png 1024w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Basic-Set-Up-min-768x577.png 768w\" sizes=\"auto, (max-width: 1100px) 100vw, 1100px\" \/><\/p>\n<p>We are done with the setup. Let\u2019s move ahead and explore our <i>angular cypress example<\/i>.<\/p>\n<h2>Getting Started with Automation Testing in Angular App<\/h2>\n<p>We will be writing automation test cases for the Registration page. And in that case, we will create a file named registration.ts located at path <strong>cypress-testing\\cypress\\integration<\/strong> and which is a sibling to the <strong>spec.ts<\/strong> file too.<\/p>\n<p>After creating the registration file, you will see that file in cypress, as shown below.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/file-in-cypress-min.png\" alt=\"file in cypress\" width=\"1100\" height=\"600\" class=\"alignnone size-full wp-image-30616\" srcset=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/file-in-cypress-min.png 1100w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/file-in-cypress-min-300x164.png 300w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/file-in-cypress-min-1024x559.png 1024w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/file-in-cypress-min-768x419.png 768w\" sizes=\"auto, (max-width: 1100px) 100vw, 1100px\" \/><\/p>\n<h2>First Test Case<\/h2>\n<p>As of now, we have nothing in the registration.ts file so let\u2019s write one test case the way we did for the login page in that file, like the below code.<\/p>\n<p>Our first test case would be <strong>\u201c&#8217;Should visit the registration page&#8217;\u201d<\/strong><\/p>\n<pre>describe('Registration page test cases', () => {\r\n    it('Should visit the registration page', () => {\r\n      cy.visit('\/registration');\r\n      cy.url().should('includes', 'registration');\r\n      cy.get('#registrationFormTitle').should('be.visible');\r\n      cy.get('#registrationFormTitle').should('have.text', 'Registration Form');\r\n      cy.get('#registrationFormEmailInputValue').should('not.exist');\r\n      cy.get('#registrationFormPasswordInputValue').should('not.exist');\r\n    })\r\n  })\r\n<\/pre>\n<p><strong>Output<\/strong><\/p>\n<p>Now, if you click on registration in cypress runner, you will see the output like the below image.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/click-on-registration-in-cypress-runner-2.png\" alt=\"click on registration in cypress runner\" width=\"1100\" height=\"600\" class=\"alignnone size-full wp-image-30642\" srcset=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/click-on-registration-in-cypress-runner-2.png 1100w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/click-on-registration-in-cypress-runner-2-300x164.png 300w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/click-on-registration-in-cypress-runner-2-1024x559.png 1024w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/click-on-registration-in-cypress-runner-2-768x419.png 768w\" sizes=\"auto, (max-width: 1100px) 100vw, 1100px\" \/><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/First-Test-Case-min.png\" alt=\"First Test Case\" width=\"1100\" height=\"600\" class=\"alignnone size-full wp-image-30612\" srcset=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/First-Test-Case-min.png 1100w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/First-Test-Case-min-300x164.png 300w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/First-Test-Case-min-1024x559.png 1024w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/First-Test-Case-min-768x419.png 768w\" sizes=\"auto, (max-width: 1100px) 100vw, 1100px\" \/><\/p>\n<p>First, we used the <strong>visit()<\/strong> method to visit a particular URL, then checked the cypress assertions using the <strong>url()<\/strong> and <strong>should()<\/strong> method. Later, we checked the value of the form title.<\/p>\n<p class=\"boxed bg--secondary\" style=\"border: 1px solid #c7c7c7; box-shadow: 0 0 40px rgba(0, 0, 0, 0.2);\"><strong><i><span style=\"font-size:22px; color:#000;\">Are you looking for proficient Angular developers for your project?<\/span><br \/>\nBacancy is here for you! Contact us now and hire <a href=\"https:\/\/www.bacancytechnology.com\/angular-js-development\" target=\"_blank\" rel=\"noopener\">Angular developer<\/a> to build, optimize, and deploy your application.<\/i><\/strong><\/p>\n<h2>Second Test Case<\/h2>\n<p>Next, we would check the email ID, ensure it is required, and articulate a proper validation error message.<\/p>\n<p>First, we need to provide an ID for every place to get the particular element. For example, we have the code below in the <strong>registration.html<\/strong> file for the email input field.<\/p>\n<div id=\"attachment_30611\" style=\"width: 1110px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-30611\" src=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Second-Test-Case-min.png\" alt=\"Second Test Case\" width=\"1100\" height=\"600\" class=\"size-full wp-image-30611\" srcset=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Second-Test-Case-min.png 1100w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Second-Test-Case-min-300x164.png 300w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Second-Test-Case-min-1024x559.png 1024w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Second-Test-Case-min-768x419.png 768w\" sizes=\"auto, (max-width: 1100px) 100vw, 1100px\" \/><p id=\"caption-attachment-30611\" class=\"wp-caption-text\">Second Test Case<\/p><\/div>\n<p>For accessing \u201cEmail is required,\u201d we will need the ID of that particular tag. So, define an ID for both errors, as shown below. We will be using these IDs.<\/p>\n<ul class=\"bullets text-left\">\n<li>id=&#8221;registrationFormEmailInputErrorRequired&#8221;<\/li>\n<li>id=&#8221;registrationFormEmailInputErrorInvalid&#8221;<\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/define-an-ID-min.png\" alt=\"define an ID\" width=\"1100\" height=\"600\" class=\"alignnone size-full wp-image-30610\" srcset=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/define-an-ID-min.png 1100w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/define-an-ID-min-300x164.png 300w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/define-an-ID-min-1024x559.png 1024w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/define-an-ID-min-768x419.png 768w\" sizes=\"auto, (max-width: 1100px) 100vw, 1100px\" \/><\/p>\n<p>Now let\u2019s write the test cases, which will first focus on the email input field and then, without entering any value, will focus password tab, and due to our code, it should show the error message below on the browser.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/write-the-test-cases-min.png\" alt=\"write the test cases\" width=\"1100\" height=\"600\" class=\"alignnone size-full wp-image-30609\" srcset=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/write-the-test-cases-min.png 1100w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/write-the-test-cases-min-300x164.png 300w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/write-the-test-cases-min-1024x559.png 1024w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/write-the-test-cases-min-768x419.png 768w\" sizes=\"auto, (max-width: 1100px) 100vw, 1100px\" \/><\/p>\n<p>For this, we have a <strong>focus()<\/strong> method in cypress to focus on any field. Here our priority is to concentrate on email and second on the password, which will show an error message.<\/p>\n<pre>it('Should enter valid email and password and redirect to the dashboard', () => {\r\n    cy.visit('\/registration');\r\n    cy.url().should('includes', 'registration');\r\n    cy.get('#registrationFormEmailInput').focus();\r\n    cy.get('#registrationFormPasswordInput').focus();\r\n    cy.get('#registrationFormEmailInputErrorRequired').should('be.visible');\r\n    cy.get('#registrationFormEmailInputErrorInvalid').should('be.visible');\r\n})\r\n<\/pre>\n<p>It would look something like this.<\/p>\n<p><strong>Output<\/strong><\/p>\n<p>Using the above code, if we check on the chrome automation cypress, we will see the below output, which clearly shows the error.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/check-on-the-chrome-automation-cypress-min.png\" alt=\"check on the chrome automation cypress\" width=\"1100\" height=\"600\" class=\"alignnone size-full wp-image-30608\" srcset=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/check-on-the-chrome-automation-cypress-min.png 1100w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/check-on-the-chrome-automation-cypress-min-300x164.png 300w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/check-on-the-chrome-automation-cypress-min-1024x559.png 1024w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/check-on-the-chrome-automation-cypress-min-768x419.png 768w\" sizes=\"auto, (max-width: 1100px) 100vw, 1100px\" \/><\/p>\n<h2>Third Test Case<\/h2>\n<p>What happens if we give the correct input? Does cypress remove those red errors? Let\u2019s see<\/p>\n<p>Ensure you have used .skip to skip the first two test cases to proceed to the third test case.<\/p>\n<pre>it('Should enter valid email and hide the errors line', () => {\r\n    cy.visit('\/registration');\r\n    cy.url().should('includes', 'registration');\r\n    cy.get('#registrationFormEmailInput').focus();\r\n    cy.get('#registrationFormPasswordInput').focus();\r\n    cy.get('#registrationFormEmailInput').type('parth@gmail.com');\r\n    cy.get('#registrationFormEmailInputErrorRequired').should('not.exist');\r\n    cy.get('#registrationFormEmailInputErrorInvalid').should('not.exist');\r\n})\r\n<\/pre>\n<p>Once done, the file would look like this.<\/p>\n<div id=\"attachment_30605\" style=\"width: 1110px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-30605\" src=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Third-Test-Case-1-min.png\" alt=\"Third Test Case\" width=\"1100\" height=\"935\" class=\"size-full wp-image-30605\" srcset=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Third-Test-Case-1-min.png 1100w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Third-Test-Case-1-min-300x255.png 300w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Third-Test-Case-1-min-1024x870.png 1024w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Third-Test-Case-1-min-768x653.png 768w\" sizes=\"auto, (max-width: 1100px) 100vw, 1100px\" \/><p id=\"caption-attachment-30605\" class=\"wp-caption-text\">Third Test Case<\/p><\/div>\n<p><strong>Output<\/strong><\/p>\n<p>You can see in the output that the validation error for the email field is removed as the input text has matched the validation pattern.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/validation-error-for-the-email-field-is-removed-min.png\" alt=\"validation error for the email field is removed\" width=\"1100\" height=\"600\" class=\"alignnone size-full wp-image-30603\" srcset=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/validation-error-for-the-email-field-is-removed-min.png 1100w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/validation-error-for-the-email-field-is-removed-min-300x164.png 300w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/validation-error-for-the-email-field-is-removed-min-1024x559.png 1024w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/validation-error-for-the-email-field-is-removed-min-768x419.png 768w\" sizes=\"auto, (max-width: 1100px) 100vw, 1100px\" \/><\/p>\n<h2>Fourth Test Case<\/h2>\n<p>Before we write our fourth test case, let me introduce you to one cypress method named cy.wait(), which will wait for some time and execute the next thing.<\/p>\n<p><strong>cy.wait(millisecond value);<\/strong><\/p>\n<p><i>Example<\/i>:- <mark>cy.wait(2000)<\/mark>; \/\/ it will wait for 2 second.<\/p>\n<p>Let&#8217;s see how to select the value from the dropdown.<\/p>\n<p>The same way can use the click() method to select the dropdown value and then select any value from them.<\/p>\n<p>Write the test cases for selecting a dropdown value using the snippet below.<\/p>\n<pre>it('Should enter valid email and hide the errors line', () => {\r\n    cy.visit('\/registration');\r\n    cy.url().should('includes', 'registration');\r\n    cy.get('#registrationFormLanguageSelect').select('English');\r\n    cy.wait(2000);\r\n    cy.get('#registrationFormLanguageSelect').select('French');\r\n})<\/pre>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/select-a-dropdown-value-1-min.png\" alt=\"select a dropdown value\" width=\"1100\" height=\"949\" class=\"alignnone size-full wp-image-30602\" srcset=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/select-a-dropdown-value-1-min.png 1100w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/select-a-dropdown-value-1-min-300x259.png 300w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/select-a-dropdown-value-1-min-1024x883.png 1024w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/select-a-dropdown-value-1-min-768x663.png 768w\" sizes=\"auto, (max-width: 1100px) 100vw, 1100px\" \/><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Registration-form-min.png\" alt=\"Registration form\" width=\"1100\" height=\"600\" class=\"alignnone size-full wp-image-30601\" srcset=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Registration-form-min.png 1100w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Registration-form-min-300x164.png 300w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Registration-form-min-1024x559.png 1024w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Registration-form-min-768x419.png 768w\" sizes=\"auto, (max-width: 1100px) 100vw, 1100px\" \/><\/p>\n<p><strong>Note:<\/strong> We have used the cy.wait() method to easily see the result for selecting first English and then wait for two seconds, and then it will choose French language.<\/p>\n<p>You Might Like to Read: <a href=\"https:\/\/www.bacancytechnology.com\/blog\/whats-new-in-angular-14\" target=\"_blank\" rel=\"noopener\">What\u2019s New in Angular 14?<\/a><\/p>\n<h2>Last Test Case<\/h2>\n<p>Now let\u2019s write the last test case. Which will enter all the values, submit the registration page, and redirect to the dashboard page.<\/p>\n<pre>it('Should register the record and redirect to the dashboard page', () => {\r\n    cy.visit('\/registration');\r\n    cy.url().should('includes', 'registration');\r\n    cy.get('#registrationFormNameInput').type('Parth Sardhara');\r\n    cy.get('#registrationFormMobileNoInput').type('9876543211');\r\n    cy.get('#registrationFormEmailInput').type('parth@gmail.com');\r\n    cy.get('#registrationFormPasswordInput').type('Parth@123');\r\n    cy.get('#registrationFormLanguageSelect').select('English');\r\n    cy.get('#registrationFormGenderMaleRadio').click();\r\n    cy.get('#registrationFormSubmitButton').click();\r\n})\r\n<\/pre>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/last-test-case-min.png\" alt=\"Last Test Case\" width=\"1100\" height=\"885\" class=\"alignnone size-full wp-image-30599\" \/><\/p>\n<p><strong>Output<\/strong><\/p>\n<p>The output would be like this.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Last-Test-Case.png\" alt=\"Last Test Case\" width=\"1100\" height=\"600\" class=\"alignnone size-full wp-image-30598\" srcset=\"https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Last-Test-Case.png 1100w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Last-Test-Case-300x164.png 300w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Last-Test-Case-1024x559.png 1024w, https:\/\/www.bacancytechnology.com\/blog\/wp-content\/uploads\/2022\/09\/Last-Test-Case-768x419.png 768w\" sizes=\"auto, (max-width: 1100px) 100vw, 1100px\" \/><\/p>\n<h2>Additional Tips and Tricks<\/h2>\n<ul class=\"bullets text-left\">\n<li>If we want to skip a particular test case, we need to use .skip after it, as shown below.<\/li>\n<\/ul>\n<pre>it('Should visit the registration page', () => { ... }\r\nTO\r\nit.skip('Should visit the registration page', () => { ... }\r\n<\/pre>\n<ul class=\"bullets text-left\">\n<li>If we want to run only a particular test case then we need to use .only after it like the below image.<\/li>\n<\/ul>\n<pre>it('Should visit the registration page', () => { ... }\r\nTO\r\nit.only('Should visit the registration page', () => { ... }\r\n<\/pre>\n<h2>Conclusion<\/h2>\n<p>This was about how to implement automation testing in your angular application. We hope the Angualar cypress example has helped you. Visit the <a href=\"https:\/\/www.bacancytechnology.com\/tutorials\/angularjs\" target=\"_blank\" rel=\"noopener\">Angular tutorials page<\/a> and learn more about Angular. Feel free to reach out if you have questions or suggestions.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Introduction In this blog, we will explore more about Automation testing using cypress in Angular with different scenarios. Before moving on to the tutorial, it would be helpful for you to understand the basics of testing your Angular application. For that, you can visit the Angular Cypress Example Tutorial Part 1. The last tutorial covered [&hellip;]<\/p>\n","protected":false},"author":37,"featured_media":30622,"comment_status":"open","ping_status":"open","sticky":false,"template":"blog-new-template.php","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"_lmt_disableupdate":"no","_lmt_disable":"","footnotes":""},"categories":[989],"tags":[],"coauthors":[1580],"class_list":["post-30590","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-angularjs"],"acf":[],"modified_by":"Binal Prajapati","_links":{"self":[{"href":"https:\/\/www.bacancytechnology.com\/blog\/wp-json\/wp\/v2\/posts\/30590","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.bacancytechnology.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.bacancytechnology.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.bacancytechnology.com\/blog\/wp-json\/wp\/v2\/users\/37"}],"replies":[{"embeddable":true,"href":"https:\/\/www.bacancytechnology.com\/blog\/wp-json\/wp\/v2\/comments?post=30590"}],"version-history":[{"count":0,"href":"https:\/\/www.bacancytechnology.com\/blog\/wp-json\/wp\/v2\/posts\/30590\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.bacancytechnology.com\/blog\/wp-json\/wp\/v2\/media\/30622"}],"wp:attachment":[{"href":"https:\/\/www.bacancytechnology.com\/blog\/wp-json\/wp\/v2\/media?parent=30590"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.bacancytechnology.com\/blog\/wp-json\/wp\/v2\/categories?post=30590"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.bacancytechnology.com\/blog\/wp-json\/wp\/v2\/tags?post=30590"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/www.bacancytechnology.com\/blog\/wp-json\/wp\/v2\/coauthors?post=30590"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}