Can't type() using xpath

[gerardovanegas-eagle]

I've tried to use xpath to type() and I'm getting the following error message:

CypressError: cy.type() failed because it requires a DOM element.

The subject received was:

{}

The previous command that ran was:

cy.xpath()

this is my code:

describe('Juntoz Test', function () {
  before('Log In first with determined user', function () {
    cy.visit('https://juntoz.com');
    expect(cy).property('xpath').to.be.a('function')
    const emailAddress = Cypress.env('emailAddress')
    const password = Cypress.env('password')
    cy.xpath("//i[@class='fa fa-angle-down pull-right popover-item-icon']").click()
    cy.xpath("//button[@class='btn btn-juntoz ng-scope' and text()='Identificarse']").click()
    cy.xpath("//input[@ng-model='emailLogin']").type(emailAddress, {force:true})
    cy.xpath("//input[@ng-model='passwordLogin']").type(password, {force:true})
})

[bahmutov]

Are these xpaths even correct? Can you confirm that they work from DevTools console? Why use them at all? You first selector to open the login should be just cy.get('#btnaccount') and the other one are similar. Just use jQuery selectors that you have!

• https://on.cypress.io/best-practices#Selecting-Elements
• https://on.cypress.io/get

[gerardovanegas-eagle]

I know, I was just trying to experiment using xpath, I was super excited because not all locators work with JQuery, and this never happened to me on selenium using "manual" xpaths, I'm not required to use xpath or JQuery, I was trying to experiment how much I could use xpath.

[gerardovanegas-eagle]

and yes, both worked on DevTools console, I'm positive about it

[bahmutov]

How do you try xpath selectors in devtools console?

Sent from my iPhone

On Jan 9, 2019, at 11:59, gerardovanegas-eagle notifications@github.com wrote:

I've tried to use xpath to type() and I'm getting the followin error message: CypressError: cy.type() failed because it requires a DOM element.

The subject received was:

{}

The previous command that ran was:

cy.xpath()

this is my code:

describe('Juntoz Test', function () { before('Log In first with determined user', function () { cy.visit('https://juntoz.com'); expect(cy).property('xpath').to.be.a('function') const emailAddress = Cypress.env('emailAddress') const password = Cypress.env('password') cy.xpath("//i[@Class='fa fa-angle-down pull-right popover-item-icon']").click() cy.xpath("//button[@Class='btn btn-juntoz ng-scope' and text()='Identificarse']").click() cy.xpath("//input[@ng-model='emailLogin']").type(emailAddress, {force:true}) cy.xpath("//input[@ng-model='passwordLogin']").type(password, {force:true})

})

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub, or mute the thread.

[gerardovanegas-eagle]

I'm not sure if we are talking about the same thing but I inspect the page and I ctrl+f on the html then paste my xpath, that's how I know it locates the element.

[jennifer-shehane]

Yeah, the error does seem to be indicating that the cy.xpath() command before the .type() did not yield a DOM element, but instead an empty object.

I personally don't remember that much about xpath anymore, but I noticed this website is public, and inspected the email login to be this html:

<input type="email" class="form-control ng-pristine ng-valid-email ng-invalid ng-invalid-required ng-touched" name="userEmail" required="" placeholder="Email" ng-model="emailLogin">

I can also confirm that ctrl + f in the Elements tab of the devtools, which you can use to 'Find by string, selector, or XPath' does indeed highlight this email element.

[bahmutov]

If you want to find element in the elements panel of DevTools, then right click and Copy XPath, you can then check it in the DevTools Console using $x('... xpath ... ') For example

When I try the XPaths from the given test I get the element

[bahmutov]

so I have been looking at this website, and it is flakey. Sometimes it loads in 60 seconds, sometimes it does not. The "Login" popup shows by default then disappears, so I cannot reliably tell what is going there. Here is the spec file I am using

/// <reference types="cypress" />
/// <reference path="../../src/index.d.ts" />

it.only('types', function () {
  cy.visit('https://juntoz.com')
  expect(cy)
    .property('xpath')
    .to.be.a('function')
  const emailAddress = Cypress.env('emailAddress')
  const password = Cypress.env('password')

  // using XPath
  cy.xpath('//*[@id="btnaccount"]').click()
  cy.contains('button', 'Identificarse').click({ force: true })
})

[bahmutov]

I have added a simple test to show that cy.xpath(...).type() is working in https://github.com/cypress-io/cypress-xpath/commit/f9e3a467d17077256c6863bb6c0ab3e1fc818264