I don’t know if you figured it out, but as no one else has answered, I might take a stab at this.
I work on QA automation and, even though I haven’t used Elixir for that (thus have not used Wallaby) and have not worked on UI testing recently, maybe my prior experience with it might help here.

It seems that your code is not finding the element. If the selector is correct, then the issue is probably of timing. That happens a lot in UI tests when there’s content rendered dynamically (through JS) and it still isn’t loaded when you query it. My advice would be to:

1. Check in the developer tools console if that selector is valid. Hint: you can use $$("<your CSS selector>") for CSS selectors and $x("<your XPath selector>") for XPath.
2. Check in Wallaby’s documentation for some sort of way to wait until an element is found or a timeout limit is reached. After quickly glancing the docs, Browser.find or Browser.retry, but I’m just guessing here.

So far, that’s the most I can say with the current information I have on Wallaby and your problem.
Also, if you have the chance, see if you can use IEX.pry to put a sort of “breakpoint” and do some trial-and-error without having to reload the browser and start from scratch every time.

As for the <i> element, some icon libraries (like FontAwesome) use those elements to put icons, usually with specific classes; not sure if that’s the case here.

I think I can help with that: Wallaby is supposed to wait for the element to appear on the page. The execute_query function contains a Browser.retry call already: wallaby/lib/wallaby/browser.ex at main · elixir-wallaby/wallaby · GitHub and will try again until all validations pass (including number of elements we want to see) or until its timeout (3s by default but you can configure it: wallaby/lib/wallaby/browser.ex at main · elixir-wallaby/wallaby · GitHub ).

@NAR You can try increasing the :max_wait_time config value. (I think it would be cool to be able to tune it per query execution, we could look into adding support for that to Wallaby). Another thing you could do is have a custom helper for waiting that takes the timeout as an argument. You could use Browser.execute_query or Browser.has and/or Browser.retry as its building blocks (or copy&paste&modify them to hack something together ). You could make a few versions of it, i.e. one that ignores query result and returns the parent, one that takes a function block to execute on the found element, and one that would return the found element. I’m curious what you end up with so please do share your findings or problems you stumble upon.