How can I access the a Selector's fully qualified CSS string?

[GrayedFox]

There are situations where I unfortunately need to fall back on using the built in cy.get() and cy.find() commands, but I am trying to declare nearly all of my selectors as static using the decorators.

I'd like to be able to do something like this:

class MySelectors {
  @By.Id('email') static email: Selector;
  @By.Attribute('product-title') static title: Selector;
}

console.log(MySelectors.email.toString()) // outputs '#email'
console.log(MySelectors.title.toString()) // outputs '[data-testid="product-title"]'

Is there some way to do this already?

[anton-kravchenko]

@GrayedFox you can use isloggingenabled configuration to log selectors to the console.

MySelectors.email.toString() is not going to work because email is a Cypress 'chain' object which has no idea about selectors.

Also you can use BySelector decorator for CSS and ByXPath for XPath selectors. This way you would know exactly what is being used as a selector string.

[GrayedFox]

Hmm, I could indeed define a constant string that is a CSS selector and then reference that, that's a good enough workaround 👍🏾