First Check

• I added a very descriptive title here.
• This is not a security issue (those should be reported via the security advisory instead).
• This is not a Q&A. I am sure something is wrong with NiceGUI or its documentation.
• I used the GitHub search to find a similar issue and came up empty.

Example Code

@ui.refreshable
def show_input():
    ui.input()

show_input()
ui.button('Refresh', on_click=show_input.refresh)

Description

When using ui.input() inside a @ui.refreshable, clicking the Refresh button causes a TypeError in the browser console.

Steps to reproduce:

1. Run the example code above.
2. Type something into the input field.
3. Click the "Refresh" button.

Expected: The input refreshes without errors.

Actual: A JavaScript error is thrown:

TypeError: Cannot read properties of undefined (reading 'props')

This happens in input.js at the beforeUnmount hook (line 31). When a refreshable rebuilds its content, the element may already be removed from mounted_app.elements by the time Vue's beforeUnmount fires. The code assumes mounted_app.elements[this.$props.id.slice(1)] always exists, but it can be undefined.

NiceGUI Version

3.7.1

Python Version

3.10.19

Browser

Chrome

Operating System

Linux