Event duplication phenomenon question

[YoonSungHyun-Git]

Hello, I am using tree widget and select box.

When you click on a tree node, an input or selectbox appears depending on the value.

I am asking this question because this problem occurred while dynamically changing options.

Problem:
When the textual app is first run and a node is clicked, the execution order of events is as follows.

Tree.NodeSelected -> Select.Changed

And change the value of selectbox.

Select.Changed

Then click on that node again.

Tree.NodeSelected -> Select.Changed -> Select.Changed

As shown above, Select.Changed occurs twice. Does anyone know or have a solution to this phenomenon?

In Node.Selected, the value of set_options and node is substituted to select.

And I'm curious about one more thing. I want to skip the first one by giving a flag in Node Selected,
but it is meaningless because Select.Changed is executed only after the node Selected method is completed.
I'm curious how you handle this situation.

[TomJGooding]

Could you possibly provide a minimal reproducible example to help understand your question?

[TomJGooding]

Sorry but I can't run your example. Could you clarify what options you are setting here? Also I don't think the NodeSelected event has a value?

    @on(Tree.NodeSelected)
    async def tree_node_selected(self, event: Tree.NodeSelected) -> None:
        self.selectbox_field.set_options(options)
        self.selectbox_field.value = event.value

[YoonSungHyun-Git]

I didn't know you wanted an example in action. I'm sorry.

When there is a number, string, or Boolean value in the node, we want to change the option value of the selectbox according to this value, so we use set_options, and the act of changing the value is to select the value of the node.

The option value is one of these things.

ex_options = {
    'switch': ['on', 'off'],
    'flag': [True, False],
    'count': [1,2,3,4,5]
}

def tree_node_selected(self, event: Tree.NodeSelected) -> None:
        label = str(event.node.label)

        if '=' in label:
               name, value = label.split('=', 1)

              if name in except_node_mappings:
                     options =  [(item, item) for item in ex_options[name]]

              self.selectbox_field.set_options(options)
              self.selectbox_field.value = event.value

[willmcgugan]

Hi @YoonSungHyun-Git What we really need is a complete working example. Can you write a short piece of code that demonstrates the issue? It would need to be something we can simply cut and paste so we can run it here.

[TomJGooding]

I think the problem might be that the set_options method will also select the first valid option as noted in the docs?

I've created a quick example below which logs the Select.Changed events.

Simple example showing set_options

from textual.app import App, ComposeResult
from textual.containers import Horizontal
from textual.widgets import Button, RichLog, Select


class ExampleApp(App):
    CSS = """
    Button { width: 1fr; margin: 1;}
    """

    def compose(self) -> ComposeResult:
        yield Button("Set the options", variant="primary")
        with Horizontal():
            yield Select(
                allow_blank=False,
                options=[("Please press the button first", "none")],
            )
            yield RichLog()

    def on_select_changed(self, event: Select.Changed) -> None:
        log = self.query_one(RichLog)
        log.write(event)

    def on_button_pressed(self) -> None:
        select = self.query_one(Select)
        # This will automatically pick the first option "foo"
        select.set_options([("foo", "foo"), ("bar", "bar")])
        # Then the "bar" option is picked
        select.value = "bar"


if __name__ == "__main__":
    app = ExampleApp()
    app.run()

You can prevent the first Select.Changed event by adding the prevent context manager:

        with self.prevent(Select.Changed):
            select.set_options([("foo", "foo"), ("bar", "bar")])

[YoonSungHyun-Git]

I was wondering how I could prevent the first changed event, but there was an option to prevent it!

I was able to prevent the event by using prevent where node is selected.
I appreciate it. It worked out well.