This tutorial explains easy way to set up Cypress and Typescript Automation Framework with page object model. Cypress is new tool alternative to protractor.
Join the DZone community and get the full member experience. This article explains creating or setting up a cypress.io end-to-end testing framework from scratch using Typescript. Unlike another tutorial, this explains setting up the Cypress framework using Typescript in a simple and easy way. This article is helpful for whoever wants to set up the Cypress Typescript automation framework for the first time. Also, I know that there are many, migrating from different automation frameworks like Protractor, webdriver.io, etc. this will be helpful for them too. This Tutorial shows page object model creation as well, however you can use it for any type of framework by skipping those steps. 2. Install Visual Studio Code: If you don’t have Visual Studio Code on your computer navigate to https://code.visualstudio.com/download download and install. The first step is to create a new folder on your computer on a desired location. Below I am creating CypressTypescript as the project folder. i. Open, Visual Studio Code, Click on File > Open Folder ii. Choose, CypressTypescript Folder and Click on Select Folder at the bottom Open Terminal, In Visual Studio Code by clicking on Terminal Menu > Choose New Terminal. Note: Ensure New Terminal opened in the working directory as CypressTypescript. ii. It will ask you a set of questions if you want, you can type the desired text, else hit [Enter] key one by one until you get the message Is this Ok?, then again hit enter it will create package.json for you. In the Visual Studio Code Terminal, you need to type below command: The above command may take some time so please wait until it finishes. The first time when you enter the cypress open command it will create a default setup for you, which also includes directories like cypress, integration, fixtures, etc. To open cypress enter the below command in your Visual Studio Code terminal window.
