Hey, i'm currently using PrimeNG, and I wanted to write customQueries to select certain components. Also i'm using @testing-library/cypress. I've tried multiple different variant and searched for hours for explanations or good examples, which could help me understand what i'm doing wrong. Currently the (not working) implementation looks like this:

Cypress.Commands.addQuery('findPrimeNgDialog', function(header) {
  return subject => subject.findByRole('dialog')
})

I have to use the subject, as I cannot just

return subject => cy.findByRole('dialog')

. So, when I try to call the query, similar to

cy.get()

, like this

cy.getPrimeNgDialog('HeaderText').as('Dialog')

, I expected it to work like

get()

, however

subject

is undefined. However calling it with

cy.get('body').getPrimeNgDialog('HeaderText').as('Dialog')

results in getting a

jquery.fn.init

object, but I don't really know what to do with that object. I thought I could simply chain the queries together, but it does not work. Sadly, I haven't found much information or examples about addQuery, therefore I really don't know what to try next. I'm fairly certain I misunderstood how addQuery is supposed to work, can someone explain this to me, or point to a ressource where I could learn more about that? The only thing I got to work is

Cypress.Commands.addQuery('findPrimeNgDialog', function(header) {
  const getFn = cy.now('contains', '[role="dialog"]', header) as any
  return subject => getFn(subject) // However not chainable inside here
})

But since

cy.now()

is not chainable, therefore I have to use

contains

instead of

get

to be able to search for the text inside. And at this point i'm questioning myself, if what i'm trying is actually meaningful.

See how to write queries in my plug-in cypress-map

@gray-kilobyte-89541 I looked through your plugin, but I still don't understand how that would help me in my use case. I want to chain a function from

cy

or another element to find elements. Still don't know hab to use

jquery.fn.init

to search for something

the problem is jQuery need to use small synchronous functions, not other Cypress commands or queries

I read the customQuery page multiple times... Maybe addQuery is just the wrong tool for this useCase

no, it is correct, you just can't use other top level queries like

cy.contains

but you could use jQuery

:contains

selector Here I am showing Cy commands, but you can simply use jQuery there https://glebbahmutov.com/cypress-examples/commands/querying.html#find-text-with-contains-selector

Okay, so the only option is to use

cy.now

since I cannot use

cy.get

or

subject.get

inside the inner function. But also I cannot chain it from another element?

No, don’t use cy.now since it returns a promise and you need a sync function

Well, but it's the only thing that's working for me