Understanding data flow within notebooks embedded into other notebooks

[sebkur]

Hi everyone,

I'm experimenting with embedding one notebook (let's call it a child) into another notebook (let's call it the parent) using the App API.

Now I'm wondering how reactivity is supposed to work within the child and across child and parent.

I have created some rather minimal notebooks to explain the issue. The child notebook has one cell with a slider and a second cell with a markdown referencing that value. When I drag the slider, the markdown cell updates as expected. The parent notebook imports the child notebook, calls await app.embed() and uses the result's output to display it in the parent.

I'm now interacting with the child output from within the parent. When I move the slider, the value in the output of the second cell of the embedded child notebook does not update. This startled me as I was kind of expecting data flow and cell execution to still work within the child? That's my main question here. Is this supposed to work as I expected it or not, i.e. should the second cell from the child notebook update itself when the slider is dragged?

I also tried some interaction with the parent notebook. I can display the same slider from the child in the parent notebook ( result.defs.get("slider")) and dragging either updates the other. I can also display the slider value (result.defs.get("slider").value). At first the value there didn't reflect updates to either of the sliders, however I noticed the documentation says this:

Embedded notebook outputs are interactive: when you interact with UI elements in an embedded notebook's output, any cell referring to the app object other than the one that imported it is marked for execution, and its internal state is automatically updated. This lets you use notebooks as building blocks or components to create higher-level notebooks.

So I added a reference to app in that cell and as a result the value updates when the slider is dragged.

I recorded videos. This is the child working as expected:

child.mp4

This is the parent. Notice how the value in the last cell of the parent cell does update, but in the child (in the line below the pointer dragging the slider), the text keeps saying "the slider value is 1 at the moment":

parent.mp4

Here's the code for reference:

child.py

import marimo

__generated_with = "0.17.0"
app = marimo.App(width="medium")


@app.cell
def _(mo):
    mo.md("""This is a child Notebook that is supposed to be inserted via nesting into another notebook""")
    return


@app.cell
def _():
    import marimo as mo

    slider = mo.ui.slider(start=1, stop=10, label="a slider for updating the cell below")

    slider
    return mo, slider


@app.cell
def _(mo, slider):
    mo.md(f"""the slider value is {slider.value} at the moment""")
    return


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

parent.py

import marimo

__generated_with = "0.17.0"
app = marimo.App(width="medium")


@app.cell
def _():
    import marimo as mo

    mo.md("This is a parent Notebook that includes a child notebook")
    return


@app.cell
async def _():
    from s1_child import app

    result = await app.embed()

    result.output
    return app, result


@app.cell
def _(result):
    result.defs

    parent = result.defs.get("slider")
    parent
    return


@app.cell
def _(app, result):
    app

    result.defs.get("slider").value
    return


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

[sebkur]

Not sure, if this the same as #5092, it seems related, however my use case seems a bit more basic?

[zilto]

Hi @sebkur! I think we're exploring the same ideas in the other discussion you linked.

Regarding your specific example, try importing the child app from s1_child import app in another cell. I believe that each time you update the slider GUI, you also re-execute the cell. This re-imports the module and sets the default values "inside the child widget" and something "desyncs" with the actual "namespaced" values passed between parent and child.

In my experimentation, the import of the child App object was very finicky. For instance, importing it in a setup cell seems to create some infinite looping