Read json object from

[csiegl182]

I've build a simple Ipython notebook app using the JSONeditor widget. By pressing the button 'Print JSON' the content of the JSONeditor should be printed within the notebook. Initially this works. But when editing the one value of the json object within the editor and pressing the button again the original json object is printed and not the updated one.

I am not sure if this is a bug or if I am missing something. However, according to the documentation this should work accordingly.

Complete, minimal, self-contained example code that reproduces the issue

import panel as pn
import json

pn.extension()

json_editor = pn.widgets.JSONEditor(value={"name": "John", "age": 30}, mode='text')

def print_json(event):
    json_obj = json_editor.value
    print(json.dumps(json_obj, indent=2))

print_button = pn.widgets.Button(name='Print JSON', button_type='primary')
print_button.on_click(print_json)

layout = pn.Column(json_editor, print_button)

layout.servable()

ALL software version info

Python 3.11.9
bleach 6.2.0
bokeh 3.6.1
certifi 2024.8.30
charset-normalizer 3.4.0
contourpy 1.3.1
idna 3.10
Jinja2 3.1.4
linkify-it-py 2.0.3
Markdown 3.7
markdown-it-py 3.0.0
MarkupSafe 3.0.2
mdit-py-plugins 0.4.2
mdurl 0.1.2
numpy 2.1.3
packaging 24.2
pandas 2.2.3
panel 1.5.4
param 2.1.1
pillow 11.0.0
pip 24.0
python-dateutil 2.9.0.post0
pytz 2024.2
pyviz_comms 3.0.3
PyYAML 6.0.2
requests 2.32.3
setuptools 69.2.0
six 1.16.0
tornado 6.4.2
tqdm 4.67.0
typing_extensions 4.12.2
tzdata 2024.2
uc-micro-py 1.0.3
urllib3 2.2.3
webencodings 0.5.1
xyzservices 2024.9.0

[MarcSkovMadsen]

I can replicate this with panel==1.5.4. The browser console also says that we are subscribing to an invalid event.

import panel as pn
import json

pn.extension("jsoneditor")

json_editor = pn.widgets.JSONEditor(value={"name": "John", "age": 30}, mode='text')

def print_json(event):
    json_obj = json_editor.value
    print(json.dumps(json_obj, indent=2))

print_button = pn.widgets.Button(name='Print JSON', button_type='primary')
print_button.on_click(print_json)

layout = pn.Column(json_editor, print_button, json_editor.param.value)

layout.servable()

[hoxbro]

I think it relates to the ace editor inside the JSONEditor not being correctly connected in the shadow dom.

Ref: josdejong/jsoneditor#742