When I use the dialog popup, it errors when scrolling to the bottom.

[sonicno1]

First Check

• I added a very descriptive title here.
• 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

async def safe_scroll_to_bottom():
    await asyncio.sleep(0.1) 
    ui.run_javascript('window.scrollTo(0, document.body.scrollHeight);')


replace(dialog1, "log!", "day", "last")
result = await dialog1
if result == "Yes":
    await safe_scroll_to_bottom()

Description

When I use the dialog popup, it errors when scrolling to the bottom.

ERROR:nicegui:The parent element this slot belongs to has been deleted.
Traceback (most recent call last):
  File "/usr/local/lib/python3.9/site-packages/nicegui/events.py", line 439, in wait_for_result
    await result
  File "/home/sonic/Python/nicegui/sonic_tools/sonic_tools.py", line 1214, in operateLog
    ui.run_javascript('window.scrollTo(0, document.body.scrollHeight);')
  File "/usr/local/lib/python3.9/site-packages/nicegui/functions/javascript.py", line 23, in run_javascript
    return context.client.run_javascript(code, timeout=timeout)
  File "/usr/local/lib/python3.9/site-packages/nicegui/context.py", line 31, in client
    return self.slot.parent.client
  File "/usr/local/lib/python3.9/site-packages/nicegui/slot.py", line 30, in parent
    raise RuntimeError('The parent element this slot belongs to has been deleted.')
RuntimeError: The parent element this slot belongs to has been deleted.

NiceGUI Version

2.24.0

Python Version

3.9

Browser

Chrome

Operating System

Windows

Additional Context

No response

[sonicno1]

So, is there a better way to scroll the page?

[sonicno1]

It's not issue

[sonicno1]

Although this is not a issue, it was functioning properly in versions before 2.20. Currently, I want that when I open a dialog box, clicking the button inside the dialog will pop up a second dialog box and close the first one. Now it shows a message that the element has been deleted.

[sonicno1]

from nicegui import ui

def replace(dialog1,title,btn1,btn2):
    try:
        dialog1.clear()
    except:
        pass
    with dialog1, ui.card().classes('absolute-center items-center'):
        ui.label(title)
        with ui.row():
            ui.button(btn1, on_click=lambda: dialog1.submit('Yes')).props('style="text-transform: none;"')
            ui.button(btn2, on_click=lambda: dialog1.submit('No')).props('style="text-transform: none;"')
    dialog1.open()

def Func_Menu():
    with ui.dialog() as dialog1, ui.card().classes('w-32 h-32 absolute-center items-center'):
        ui.label("")
    dialog1.clear()
    
    async def operateLog():
        replace(dialog1,"test","yes","no")
        result = await dialog1
        if result == "Yes" :
            print("test")

    async def tant():
        replace(dialog1,"One","yes", "no")
        result = await dialog1
        if result == "Yes" :
            ui.notify(f"Test1! ")
        elif result == "No":
            ui.notify(f"Test2! ")

    with dialog1, ui.card().classes(''):
        ui.label("")
        navigation = ui.grid(columns=3).classes('w-full gap-2 text-sm')
        with navigation:
            ui.button("logs", on_click=operateLog)
            ui.button("tant", on_click=tant)
        dialog1.open()

@ui.page('/')
def main_page():    
    ui.button("Open_Dialog", on_click=Func_Menu)
    
if __name__ in {"__main__", "__mp_main__"}:
    ui.run()
		

[evnchn]

I'm having difficulty reading the code on mobile right now. I'll give high-level comments.

NiceGUI 2.21.0, #4938, we got rid of the circular references and the reference counting mechanism will remove the element immediately once nobody reference it.

It is the number-1 cause for code breaking on 2.21+ while works on 2.20 and below.

It is not technically NiceGUI problem since your code could still break on 2.20 if the garbage collector runs in just the right moment. You can argue NiceGUI got more strict, though. Code which breaks 1% of the time in 2.20 may break 100% of the time in 2.21+. I think it's the right thing to do, still.

The course of action is to properly manage the references to the element. Large language models may help you with that. Feed it #4938 for additional context.

[evnchn]

Hello @sonicno1. I got time to read your code.

Reading #5134 (comment), the issue, as it turns out, is not in the scroll-to-bottom (in fact scroll-to-bottom is not in that snippet at all).

Rather, it has to do with how you are using ui.notify in tant while print in operateLog.

I still can't debug why your code, the parent slot is deleted. I'm not that good at reference counter to be honest. I can offer a fix though: the on_click it can actually pass a ClickEventArguments and it contains the client. Looking at the traceback we're looking for the client after all (see the self.slot.parent.client?)

from nicegui import ui
from nicegui.events import ClickEventArguments


def replace(dialog1, title, btn1, btn2):
    try:
        dialog1.clear()
    except:
        pass
    with dialog1, ui.card().classes('absolute-center items-center'):
        ui.label(title)
        with ui.row():
            ui.button(btn1, on_click=lambda: dialog1.submit('Yes')).props('style="text-transform: none;"')
            ui.button(btn2, on_click=lambda: dialog1.submit('No')).props('style="text-transform: none;"')
    dialog1.open()


def Func_Menu():
    with ui.dialog() as dialog1, ui.card().classes('w-32 h-32 absolute-center items-center'):
        ui.label('')
    dialog1.clear()

    async def operateLog():
        replace(dialog1, 'test', 'yes', 'no')
        result = await dialog1
        if result == 'Yes':
            print('test')

    async def tant(e: ClickEventArguments): # PATCH HERE
        replace(dialog1, 'One', 'yes', 'no')
        result = await dialog1
        if result == 'Yes':
            with e.client: # PATCH HERE
                ui.notify(f'Test1! ')
        elif result == 'No':
            with e.client: # PATCH HERE
                ui.notify(f'Test2! ')

    with dialog1, ui.card().classes(''):
        ui.label('')
        navigation = ui.grid(columns=3).classes('w-full gap-2 text-sm')
        with navigation:
            ui.button('logs', on_click=operateLog)
            ui.button('tant', on_click=tant)
        dialog1.open()


@ui.page('/')
def main_page():
    ui.button('Open_Dialog', on_click=Func_Menu)


if __name__ in {'__main__', '__mp_main__'}:
    ui.run()

[sonicno1]

Hello @evnchn , thank you very much for the patch you provided, it works great.