How test the Web UI for Anvil Apps

Anvil Q&A
7

Popping back in to answer this question, which got kinda lost in the follow-up:

This can be solved straightforwardly, by using anvil.js to put identifying IDs or classes onto particular components in your __init__ method. (This is the approach I mentioned here, which got refined into a scary but effective monkey-patch for every instance of the Component class here)

Here’s how it works:

anvil.js.get_dom_node(target_component).classList.add("some-class")

or

anvil.js.get_dom_node(target_component).id = "something-meaningful"

Or you can even find and target elements within components. For example, to target the <button> element inside a Button component:

from anvil.js import get_dom_node, window

# Find the component:
node = window.jQuery(get_dom_node(self.button_1))
# Tag the actual <button> element that component:
node.find("button").attr("id", "something-meaningful")
1 Like