RedHatQE / widgetastic.core

Making testing of UIs fantastic.
Other
36 stars 43 forks source link

Highlight elements as we interact with them #208

Closed john-dupuy closed 3 years ago

john-dupuy commented 3 years ago

In writing UI tests locally, it is oftentimes difficult to get insight into what parts of a page selenium is touching. This PR changes the style of the current element to place a "red border" around it. This is particularly useful to see what parts of the page is_displayed/am_i_here methods are checking.

However, in order for it to be useful the border must be visible for some small amount of time, which means a time.sleep and additional interaction time. I played around with various approaches:

@quarckster @mshriver I'm curious what y'all think about this and whether there's any good solution to having the highlight be visible. I don't want to unnecessarily increase test execution time. I do think this would be beneficial when debugging tests locally or even if the highlights are able to be captured in a screenshot or test execution gif and uploaded to Ibutsu. Perhaps it could be an optional feature that's easy to enable locally.

EDIT: I've just come across https://gist.github.com/marciomazza/3086536 which suggests using setTimeout in JS on the style. Let me try that out. EDIT (2): Just updated to use setTimeout and it works a lot better.

quarckster commented 3 years ago

@john-dupuy it looks very interesting but I'm wondering if we could use it on demand? Besides, what do you think about putting this logic into DefaultPlugin class?

john-dupuy commented 3 years ago

@quarckster Yeah, I think having it be an on-demand feature is appropriate, as it's mostly for local debugging. I will look into adding it to the browser plugin.

john-dupuy commented 3 years ago

@quarckster just updated for those things. In IQE-core we can then handle this new kwarg based on a config value.

quarckster commented 3 years ago

The tests pass locally.