Skip to content

HTML select event throws when serializing #275

@mattrunyon

Description

@mattrunyon

Description

I was trying to use ui.html.select and the on_change event throws because it's trying to convert a circular structure to JSON.

Steps to reproduce

import deephaven.ui as ui
from deephaven.table import Table
import deephaven.plot.express as dx

_stocks = dx.data.stocks()

def use_distinct_value(table: Table, column: str):
    distinct_table = ui.use_memo(lambda: table.select_distinct(formulas=[column]), [table, column])
    return ui.use_column_data(distinct_table)

@ui.component
def distinct_picker(table: Table, column: str):
    distinct_values = use_distinct_value(table, column)

    return [
        ui.html.select(
            [ui.html.option(v, value=v, key=v) for v in distinct_values],
            on_change=(lambda e: print(e))
        )
    ]

dp = distinct_picker(_stocks, "exchange")

Expected results

Prints the selected value

Actual results

Throws in the JS console

Uncaught (in promise) Error: Converting circular structure to JSON
    --> starting at object with constructor 'HTMLOptionElement'
    |     property '__reactFiber$yl0m46k8uh8' -> object with constructor 'VKe'
    --- property 'stateNode' closes the circle
    at new JSONRPCErrorException2 (eval at <anonymous> (loadRemoteModule.js:21:24), <anonymous>:4302:28)

Versions

Engine Version: 0.33.0-SNAPSHOT
Web UI Version: 0.63.0
Java Version: 21.0.2
Barrage Version: 0.6.0
Browser Name: Chrome 121
OS Name: Linux

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions