hover(selector) versus button(selector).exists

[Faulkner368]

I am not familiar with Taiko but was doing some PR's recently and encountered some gauge / taiko steps where it appeared to me based on my limited knowledge that a step was redundant.

I felt so because first a button(selector).exists() check was made, then hover(selector) using the same selector, the documentation states that a error is thrown if hover selector finds no elements.

So aren't these two functions testing the same thing and using both redundant ? as checking the button exists using a query selector verifies the button is in the DOM, but since hover just checks it can find an element in the DOM matching the selector then its basically the same check; if you can hover on it then it exists so why have both button exists and hover both using the same selector.

I wanted to see if there was a good reason and or benefit to using the hover, I suspected its existence meant it did more than just check the DOM for the selector otherwise it just repeats things like button(selector) or link(selector) and feels pointless so wanted to check if I was missing something and the hover was beneficial for its own hover related reasons.

Excuse my ignorance regarding Taiko

[NivedhaSenthil]

Yes Taiko does a check for element to be actionable before performing any action, can you please point me to the place where you noticed this step that you felt redundant ?

[Faulkner368]

Thanks for the response @NivedhaSenthil. I am not able to link to the source code but I can give an idea of it

step("Verify that button A1 exists", async function () {
    var buttonExists = await button({ title: "Some Title" }).exists();
    expect(buttonExists, `Error expected the A1 button to exist}`).to.be.true
});

step("Hover on button A1", async function () {
    await hover({ title: "Some Title" });
});

It seems like hover is doing nothing special and that all this confirms is the selector given to the hover function was able to find at least one matching element in the DOM and there fore this has already been achieved with the first step as it uses the button function with the same selector to check that the button exists.

[NivedhaSenthil]

Hover will actually perform the mouse hover action, so if the site being tested has listeners on hover action over the particular selector then those will be triggered. exists() will not perform any action on the selector would just check for the presence.

[Faulkner368]

OK, that is a good point, in this case we don't have anything except a click listener so I still think it makes it a redundant step based on this. Thanks for your help, it is much appreciated, as I have not worked with Taiko before I wanted to better understand what hover does as the documentation just said it tries to get elements using the selector and if it finds none it returns an error so this limited information suggested to me that its just checking the DOM for an element matching the selector so felt no different to button().

Again, much appreciated