OiO.lk Community platform!

Oio.lk is an excellent forum for developers, providing a wide range of resources, discussions, and support for those in the developer community. Join oio.lk today to connect with like-minded professionals, share insights, and stay updated on the latest trends and technologies in the development field.
  You need to log in or register to access the solved answers to this problem.
  • You have reached the maximum number of guest views allowed
  • Please register below to remove this limitation

cypress is not identifying a constructor

  • Thread starter Thread starter Satyajit Behera
  • Start date Start date
S

Satyajit Behera

Guest
Hi there I am trying to run a script in cypress by following page object model. But when I am running my script cypress is throwing error that page's _HomePage.HomePage is not a constructor
I am attaching my code below for reference.

In HomepageObject

Code:
class HomePage
{
   myaccountIcon(){
      return cy.get('a[title=Account] div.icon-wrapper.top-action-icons.quick-menu');
   }
   viewCartICon(){
      return cy.get('a[title=Cart]');
   }
   shortListIcon(){
      return cy.get('a[title=Shortlist]');
   }
   hamburgerIcon(){
      return cy.get('div.gc-icon-col.gc-icon-closed img[class=img-responsive]');
   }

    editNameField()
    {
       return cy.get('form > div:nth-child(1) > input');
    }
    editEmailField()
    {
      return cy.get('form > div:nth-child(2) > input');
    }
    editPasswordField()
    {
        return cy.get('form > div:nth-child(3) > input');
    }

    gettwoWayDataBinding()
    {

    }

    selctDropdown()
    {
       return cy.get("select");
    }

    gnavShop_option()
    {
       return cy.get('ul.navbar-nav  li:nth-child(2)');
    }
    sddCTA()
    {
      return cy.get('a.tile-8.sdd');
    }
      clickPersonalizedGnavSection(){
      return cy.get('#selection-panel > div > a.tile-8.personalized').click();
    }
    

}
export default HomePage;

in my script

Code:
///<reference types ="cypress"/>
import { HomePage } from '../support/pageObjects/HomePage';
import { MppPage } from '../support/pageObjects/OrderReviewPage';
describe("Testframwork", () => {
    let data1;
    before(function () {
        cy.log("Loading the fixure file")
        cy.fixture('example.json').then(function (data) {
            data1 = data;
        })
    })
    it("Checkout scenario", () => {
        const homePage = new HomePage();
        const mp = new MppPage();
        cy.visit('https://google.com');
        homePage.editNameField().type(data1.name);
        homePage.editEmailField().type(data1.email);
        homePage.editPasswordField().type(data1.password);
        homePage.selctDropdown().select(data1.gender);
        homePage.gnavShop_option().click();

        cy.get('.card-body h4').each(($el, index, list) => {
            if ($el.text().includes('Blackberry')) {
                cy.get('div.card-footer  button').eq(index).click();
            }

        })
        mp.getContinueCheckout().click();
    })
})

in my package.json file

Code:
{
  "name": "cypressautomation",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "satyajit",
  "license": "ISC",
  "devDependencies": {
    "@types/cypress-cucumber-preprocessor": "^4.0.1",
    "cypress": "^10.6.0",
    "cypress-cucumber-preprocessor": "^4.3.1",
    "mochawesome": "^7.1.3",
    "multiple-cucumber-html-reporter": "^1.21.6"
  },
  "cypress-cucumber-preprocessor": {
    "nonGlobalStepDefinitions": true,
    "cucumberJson": {
      "generate": true,
      "outputFolder": "cypress/cucumber-json",
      "filePrefix": "",
      "fileSuffix": ".cucumber"
    }
  }
}

and below I am attaching the screenshot of the error and other pictures for reference. please help me to solve this. Error image at cypress folder structure

<p>Hi there I am trying to run a script in cypress by following page object model. But when I am running my script cypress is throwing error that page's <strong>_HomePage.HomePage is not a constructor</strong><br />
I am attaching my code below for reference.</p>
<p>In HomepageObject</p>
<pre><code>class HomePage
{
myaccountIcon(){
return cy.get('a[title=Account] div.icon-wrapper.top-action-icons.quick-menu');
}
viewCartICon(){
return cy.get('a[title=Cart]');
}
shortListIcon(){
return cy.get('a[title=Shortlist]');
}
hamburgerIcon(){
return cy.get('div.gc-icon-col.gc-icon-closed img[class=img-responsive]');
}

editNameField()
{
return cy.get('form > div:nth-child(1) > input');
}
editEmailField()
{
return cy.get('form > div:nth-child(2) > input');
}
editPasswordField()
{
return cy.get('form > div:nth-child(3) > input');
}

gettwoWayDataBinding()
{

}

selctDropdown()
{
return cy.get("select");
}

gnavShop_option()
{
return cy.get('ul.navbar-nav li:nth-child(2)');
}
sddCTA()
{
return cy.get('a.tile-8.sdd');
}
clickPersonalizedGnavSection(){
return cy.get('#selection-panel > div > a.tile-8.personalized').click();
}


}
export default HomePage;
</code></pre>
<p>in my script</p>
<pre><code>///<reference types ="cypress"/>
import { HomePage } from '../support/pageObjects/HomePage';
import { MppPage } from '../support/pageObjects/OrderReviewPage';
describe("Testframwork", () => {
let data1;
before(function () {
cy.log("Loading the fixure file")
cy.fixture('example.json').then(function (data) {
data1 = data;
})
})
it("Checkout scenario", () => {
const homePage = new HomePage();
const mp = new MppPage();
cy.visit('https://google.com');
homePage.editNameField().type(data1.name);
homePage.editEmailField().type(data1.email);
homePage.editPasswordField().type(data1.password);
homePage.selctDropdown().select(data1.gender);
homePage.gnavShop_option().click();

cy.get('.card-body h4').each(($el, index, list) => {
if ($el.text().includes('Blackberry')) {
cy.get('div.card-footer button').eq(index).click();
}

})
mp.getContinueCheckout().click();
})
})
</code></pre>
<p>in my <strong>package.json</strong> file</p>
<pre><code>{
"name": "cypressautomation",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "satyajit",
"license": "ISC",
"devDependencies": {
"@types/cypress-cucumber-preprocessor": "^4.0.1",
"cypress": "^10.6.0",
"cypress-cucumber-preprocessor": "^4.3.1",
"mochawesome": "^7.1.3",
"multiple-cucumber-html-reporter": "^1.21.6"
},
"cypress-cucumber-preprocessor": {
"nonGlobalStepDefinitions": true,
"cucumberJson": {
"generate": true,
"outputFolder": "cypress/cucumber-json",
"filePrefix": "",
"fileSuffix": ".cucumber"
}
}
}
</code></pre>
<p>and below I am attaching the screenshot of the error and other pictures for reference.
please help me to solve this.
<a href="https://i.sstatic.net/sOzIr.png" rel="nofollow noreferrer"><img src="https://i.sstatic.net/sOzIr.png" alt="Error image at cypress" /></a>
<a href="https://i.sstatic.net/wJnKN.png" rel="nofollow noreferrer"><img src="https://i.sstatic.net/wJnKN.png" alt="folder structure" /></a></p>
 

Online statistics

Members online
0
Guests online
4
Total visitors
4
Top