Merged
125 changes: 123 additions & 2 deletions dash/dash.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -475,6 +475,110 @@ def _validate_callback(self, output, inputs, state, events):
output.component_id,
output.component_property).replace(' ', ''))

def _validate_callback_output(self, output_value, output):
valid = [str, dict, int, float, type(None), Component]

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Since we JSON serialize with the json.dumps(obj, cls=plotly.utils.PlotlyJSONEncoder), this list actually has a few other items: https://github.com/plotly/plotly.py/blob/6b3a0135977b92b3f7e0be2a1e8b418d995c70e3/plotly/utils.py#L137-L332

So, if there was a component property that accepted a list of numbers, then technically the user could return a numpy array or a dataframe.

The only example that immediately comes to mind is updating the figure property in a callback with the plotly.graph_objs. These objects get serialized because they have a to_plotly_json method.

So, I wonder if instead of validating up-front, we should only run this routine only if our json.dumps(resp, plotly.utils.PlotlyJSONEncoder) call fails.

This would have the other advantage of being faster for the non-error case. If the user returns a huge object (e.g. some of my callbacks in apps return a 2MB nested component), doing this recursive validation might be slow.

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That makes sense. I am not sure how large of a speed up that would be since validating a large callback output is likely much faster than the network delay of sending that large output, but it definitely makes it easier than crafting a perfect validator (that would need to update every time we want to extend PlotlyJSONEncoder).


def _raise_invalid(bad_val, outer_val, bad_type, path, index=None,
toplevel=False):
outer_id = "(id={:s})".format(outer_val.id) \
if getattr(outer_val, 'id', False) else ''
outer_type = type(outer_val).__name__
raise exceptions.InvalidCallbackReturnValue('''
The callback for property `{property:s}` of component `{id:s}`
returned a {object:s} having type `{type:s}`
which is not JSON serializable.

{location_header:s}{location:s}
and has string representation
`{bad_val}`

In general, Dash properties can only be
dash components, strings, dictionaries, numbers, None,
or lists of those.
'''.format(
property=output.component_property,
id=output.component_id,
object='tree with one value' if not toplevel else 'value',
type=bad_type,
location_header=(
'The value in question is located at'
if not toplevel else
'''The value in question is either the only value returned,
or is in the top level of the returned list,'''
),
location=(
"\n" +
("[{:d}] {:s} {:s}".format(index, outer_type, outer_id)
if index is not None
else ('[*] ' + outer_type + ' ' + outer_id))
+ "\n" + path + "\n"
) if not toplevel else '',
bad_val=bad_val).replace(' ', ''))

def _value_is_valid(val):
return (
# pylint: disable=unused-variable
any([isinstance(val, x) for x in valid]) or
type(val).__name__ == 'unicode'
)

def _validate_value(val, index=None):
# val is a Component
if isinstance(val, Component):
for p, j in val.traverse_with_paths():
# check each component value in the tree
if not _value_is_valid(j):
_raise_invalid(
bad_val=j,
outer_val=val,
bad_type=type(j).__name__,
path=p,
index=index
)

# Children that are not of type Component or
# collections.MutableSequence not returned by traverse
child = getattr(j, 'children', None)
if not isinstance(child, collections.MutableSequence):
if child and not _value_is_valid(child):
_raise_invalid(
bad_val=child,
outer_val=val,
bad_type=type(child).__name__,
path=p + "\n" + "[*] " + type(child).__name__,
index=index
)

# Also check the child of val, as it will not be returned
child = getattr(val, 'children', None)
if not isinstance(child, collections.MutableSequence):
if child and not _value_is_valid(child):
_raise_invalid(
bad_val=child,
outer_val=val,
bad_type=type(child).__name__,
path=type(child).__name__,
index=index
)

# val is not a Component, but is at the top level of tree
else:
if not _value_is_valid(val):
_raise_invalid(
bad_val=val,
outer_val=type(val).__name__,
bad_type=type(val).__name__,
path='',
index=index,
toplevel=True
)

if isinstance(output_value, list):
for i, val in enumerate(output_value):
_validate_value(val, index=i)
else:
_validate_value(output_value)

# TODO - Update nomenclature.
# "Parents" and "Children" should refer to the DOM tree
# and not the dependency tree.
Expand DownExpand Up@@ -521,9 +625,26 @@ def add_context(*args, **kwargs):
}
}

try:
jsonResponse = json.dumps(
response,
cls=plotly.utils.PlotlyJSONEncoder
)
except TypeError:

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍 perfect

self._validate_callback_output(output_value, output)
raise exceptions.InvalidCallbackReturnValue('''
The callback for property `{property:s}`
of component `{id:s}` returned a value
which is not JSON serializable.

In general, Dash properties can only be
dash components, strings, dictionaries, numbers, None,
or lists of those.
'''.format(property=output.component_property,
id=output.component_id))

return flask.Response(
json.dumps(response,
cls=plotly.utils.PlotlyJSONEncoder),
jsonResponse,
mimetype='application/json'
)

Expand Down
28 changes: 21 additions & 7 deletions dash/development/base_component.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -151,22 +151,36 @@ def __delitem__(self, id): # pylint: disable=redefined-builtin

def traverse(self):
"""Yield each item in the tree."""
for t in self.traverse_with_paths():
yield t[1]

def traverse_with_paths(self):
"""Yield each item with its path in the tree."""
children = getattr(self, 'children', None)
children_type = type(children).__name__
children_id = "(id={:s})".format(children.id) \
if getattr(children, 'id', False) else ''
children_string = children_type + ' ' + children_id

# children is just a component
if isinstance(children, Component):
yield children
for t in children.traverse():
yield t
yield "[*] " + children_string, children
for p, t in children.traverse_with_paths():
yield "\n".join(["[*] " + children_string, p]), t

# children is a list of components
elif isinstance(children, collections.MutableSequence):
for i in children: # pylint: disable=not-an-iterable
yield i
for idx, i in enumerate(children):
list_path = "[{:d}] {:s} {}".format(
idx,
type(i).__name__,
"(id={:s})".format(i.id) if getattr(i, 'id', False) else ''
)
yield list_path, i

if isinstance(i, Component):
for t in i.traverse():
yield t
for p, t in i.traverse_with_paths():
yield "\n".join([list_path, p]), t

def __iter__(self):
"""Yield IDs in the tree of children."""
Expand Down
4 changes: 4 additions & 0 deletions dash/exceptions.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -44,3 +44,7 @@ class CantHaveMultipleOutputs(CallbackException):

class PreventUpdate(CallbackException):
pass


class InvalidCallbackReturnValue(CallbackException):
pass
2 changes: 1 addition & 1 deletion dev-requirements.txt
Original file line numberDiff line numberDiff line change
Expand Up@@ -12,4 +12,4 @@ six
plotly>=2.0.8
requests[security]
flake8
pylint
pylint==1.9.2
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Add copy buttons to all
 blocks\n(function() {\n function addCopyButtons() {\n document.querySelectorAll('pre code').forEach(function(codeBlock) {\n if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;\n codeBlock.parentElement.setAttribute('data-copy-added', 'true');\n \n var btn = document.createElement('button');\n btn.textContent = 'Copy';\n btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';\n btn.onmouseover = function() { this.style.opacity = '1'; };\n btn.onmouseout = function() { this.style.opacity = '0.7'; };\n btn.onclick = function() {\n navigator.clipboard.writeText(codeBlock.textContent).then(function() {\n btn.textContent = 'Copied!';\n setTimeout(function() { btn.textContent = 'Copy'; }, 1500);\n });\n };\n codeBlock.parentElement.style.position = 'relative';\n codeBlock.parentElement.appendChild(btn);\n });\n }\n \n addCopyButtons();\n \n // Re-run on dynamic content\n var observer = new MutationObserver(addCopyButtons);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Add Copy Buttons to Code Blocks");
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
Skip to content
Merged
125 changes: 123 additions & 2 deletions dash/dash.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -475,6 +475,110 @@ def _validate_callback(self, output, inputs, state, events):
output.component_id,
output.component_property).replace(' ', ''))

def _validate_callback_output(self, output_value, output):
valid = [str, dict, int, float, type(None), Component]

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Since we JSON serialize with the json.dumps(obj, cls=plotly.utils.PlotlyJSONEncoder), this list actually has a few other items: https://github.com/plotly/plotly.py/blob/6b3a0135977b92b3f7e0be2a1e8b418d995c70e3/plotly/utils.py#L137-L332

So, if there was a component property that accepted a list of numbers, then technically the user could return a numpy array or a dataframe.

The only example that immediately comes to mind is updating the figure property in a callback with the plotly.graph_objs. These objects get serialized because they have a to_plotly_json method.

So, I wonder if instead of validating up-front, we should only run this routine only if our json.dumps(resp, plotly.utils.PlotlyJSONEncoder) call fails.

This would have the other advantage of being faster for the non-error case. If the user returns a huge object (e.g. some of my callbacks in apps return a 2MB nested component), doing this recursive validation might be slow.

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That makes sense. I am not sure how large of a speed up that would be since validating a large callback output is likely much faster than the network delay of sending that large output, but it definitely makes it easier than crafting a perfect validator (that would need to update every time we want to extend PlotlyJSONEncoder).


def _raise_invalid(bad_val, outer_val, bad_type, path, index=None,
toplevel=False):
outer_id = "(id={:s})".format(outer_val.id) \
if getattr(outer_val, 'id', False) else ''
outer_type = type(outer_val).__name__
raise exceptions.InvalidCallbackReturnValue('''
The callback for property `{property:s}` of component `{id:s}`
returned a {object:s} having type `{type:s}`
which is not JSON serializable.

{location_header:s}{location:s}
and has string representation
`{bad_val}`

In general, Dash properties can only be
dash components, strings, dictionaries, numbers, None,
or lists of those.
'''.format(
property=output.component_property,
id=output.component_id,
object='tree with one value' if not toplevel else 'value',
type=bad_type,
location_header=(
'The value in question is located at'
if not toplevel else
'''The value in question is either the only value returned,
or is in the top level of the returned list,'''
),
location=(
"\n" +
("[{:d}] {:s} {:s}".format(index, outer_type, outer_id)
if index is not None
else ('[*] ' + outer_type + ' ' + outer_id))
+ "\n" + path + "\n"
) if not toplevel else '',
bad_val=bad_val).replace(' ', ''))

def _value_is_valid(val):
return (
# pylint: disable=unused-variable
any([isinstance(val, x) for x in valid]) or
type(val).__name__ == 'unicode'
)

def _validate_value(val, index=None):
# val is a Component
if isinstance(val, Component):
for p, j in val.traverse_with_paths():
# check each component value in the tree
if not _value_is_valid(j):
_raise_invalid(
bad_val=j,
outer_val=val,
bad_type=type(j).__name__,
path=p,
index=index
)

# Children that are not of type Component or
# collections.MutableSequence not returned by traverse
child = getattr(j, 'children', None)
if not isinstance(child, collections.MutableSequence):
if child and not _value_is_valid(child):
_raise_invalid(
bad_val=child,
outer_val=val,
bad_type=type(child).__name__,
path=p + "\n" + "[*] " + type(child).__name__,
index=index
)

# Also check the child of val, as it will not be returned
child = getattr(val, 'children', None)
if not isinstance(child, collections.MutableSequence):
if child and not _value_is_valid(child):
_raise_invalid(
bad_val=child,
outer_val=val,
bad_type=type(child).__name__,
path=type(child).__name__,
index=index
)

# val is not a Component, but is at the top level of tree
else:
if not _value_is_valid(val):
_raise_invalid(
bad_val=val,
outer_val=type(val).__name__,
bad_type=type(val).__name__,
path='',
index=index,
toplevel=True
)

if isinstance(output_value, list):
for i, val in enumerate(output_value):
_validate_value(val, index=i)
else:
_validate_value(output_value)

# TODO - Update nomenclature.
# "Parents" and "Children" should refer to the DOM tree
# and not the dependency tree.
Expand DownExpand Up@@ -521,9 +625,26 @@ def add_context(*args, **kwargs):
}
}

try:
jsonResponse = json.dumps(
response,
cls=plotly.utils.PlotlyJSONEncoder
)
except TypeError:

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍 perfect

self._validate_callback_output(output_value, output)
raise exceptions.InvalidCallbackReturnValue('''
The callback for property `{property:s}`
of component `{id:s}` returned a value
which is not JSON serializable.

In general, Dash properties can only be
dash components, strings, dictionaries, numbers, None,
or lists of those.
'''.format(property=output.component_property,
id=output.component_id))

return flask.Response(
json.dumps(response,
cls=plotly.utils.PlotlyJSONEncoder),
jsonResponse,
mimetype='application/json'
)

Expand Down
28 changes: 21 additions & 7 deletions dash/development/base_component.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -151,22 +151,36 @@ def __delitem__(self, id): # pylint: disable=redefined-builtin

def traverse(self):
"""Yield each item in the tree."""
for t in self.traverse_with_paths():
yield t[1]

def traverse_with_paths(self):
"""Yield each item with its path in the tree."""
children = getattr(self, 'children', None)
children_type = type(children).__name__
children_id = "(id={:s})".format(children.id) \
if getattr(children, 'id', False) else ''
children_string = children_type + ' ' + children_id

# children is just a component
if isinstance(children, Component):
yield children
for t in children.traverse():
yield t
yield "[*] " + children_string, children
for p, t in children.traverse_with_paths():
yield "\n".join(["[*] " + children_string, p]), t

# children is a list of components
elif isinstance(children, collections.MutableSequence):
for i in children: # pylint: disable=not-an-iterable
yield i
for idx, i in enumerate(children):
list_path = "[{:d}] {:s} {}".format(
idx,
type(i).__name__,
"(id={:s})".format(i.id) if getattr(i, 'id', False) else ''
)
yield list_path, i

if isinstance(i, Component):
for t in i.traverse():
yield t
for p, t in i.traverse_with_paths():
yield "\n".join([list_path, p]), t

def __iter__(self):
"""Yield IDs in the tree of children."""
Expand Down
4 changes: 4 additions & 0 deletions dash/exceptions.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -44,3 +44,7 @@ class CantHaveMultipleOutputs(CallbackException):

class PreventUpdate(CallbackException):
pass


class InvalidCallbackReturnValue(CallbackException):
pass
2 changes: 1 addition & 1 deletion dev-requirements.txt
Original file line numberDiff line numberDiff line change
Expand Up@@ -12,4 +12,4 @@ six
plotly>=2.0.8
requests[security]
flake8
pylint
pylint==1.9.2
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Force GitHub README to respect dark mode\n(function() {\n var style = document.createElement('style');\n style.textContent = '\n .markdown-body {\n color-scheme: dark light;\n }\n .markdown-body pre { background: #161b22 !important; }\n .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }\n .markdown-body table th, .markdown-body table td { border-color: #30363d !important; }\n .markdown-body img { background: #0d1117; }\n .markdown-body blockquote { border-left-color: #8b949e; }\n .markdown-body hr { border-color: #30363d; }\n ';\n document.head.appendChild(style);\n})();", "GitHub Dark Mode README Fix"); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
Merged
125 changes: 123 additions & 2 deletions dash/dash.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -475,6 +475,110 @@ def _validate_callback(self, output, inputs, state, events):
output.component_id,
output.component_property).replace(' ', ''))

def _validate_callback_output(self, output_value, output):
valid = [str, dict, int, float, type(None), Component]

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Since we JSON serialize with the json.dumps(obj, cls=plotly.utils.PlotlyJSONEncoder), this list actually has a few other items: https://github.com/plotly/plotly.py/blob/6b3a0135977b92b3f7e0be2a1e8b418d995c70e3/plotly/utils.py#L137-L332

So, if there was a component property that accepted a list of numbers, then technically the user could return a numpy array or a dataframe.

The only example that immediately comes to mind is updating the figure property in a callback with the plotly.graph_objs. These objects get serialized because they have a to_plotly_json method.

So, I wonder if instead of validating up-front, we should only run this routine only if our json.dumps(resp, plotly.utils.PlotlyJSONEncoder) call fails.

This would have the other advantage of being faster for the non-error case. If the user returns a huge object (e.g. some of my callbacks in apps return a 2MB nested component), doing this recursive validation might be slow.

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That makes sense. I am not sure how large of a speed up that would be since validating a large callback output is likely much faster than the network delay of sending that large output, but it definitely makes it easier than crafting a perfect validator (that would need to update every time we want to extend PlotlyJSONEncoder).


def _raise_invalid(bad_val, outer_val, bad_type, path, index=None,
toplevel=False):
outer_id = "(id={:s})".format(outer_val.id) \
if getattr(outer_val, 'id', False) else ''
outer_type = type(outer_val).__name__
raise exceptions.InvalidCallbackReturnValue('''
The callback for property `{property:s}` of component `{id:s}`
returned a {object:s} having type `{type:s}`
which is not JSON serializable.

{location_header:s}{location:s}
and has string representation
`{bad_val}`

In general, Dash properties can only be
dash components, strings, dictionaries, numbers, None,
or lists of those.
'''.format(
property=output.component_property,
id=output.component_id,
object='tree with one value' if not toplevel else 'value',
type=bad_type,
location_header=(
'The value in question is located at'
if not toplevel else
'''The value in question is either the only value returned,
or is in the top level of the returned list,'''
),
location=(
"\n" +
("[{:d}] {:s} {:s}".format(index, outer_type, outer_id)
if index is not None
else ('[*] ' + outer_type + ' ' + outer_id))
+ "\n" + path + "\n"
) if not toplevel else '',
bad_val=bad_val).replace(' ', ''))

def _value_is_valid(val):
return (
# pylint: disable=unused-variable
any([isinstance(val, x) for x in valid]) or
type(val).__name__ == 'unicode'
)

def _validate_value(val, index=None):
# val is a Component
if isinstance(val, Component):
for p, j in val.traverse_with_paths():
# check each component value in the tree
if not _value_is_valid(j):
_raise_invalid(
bad_val=j,
outer_val=val,
bad_type=type(j).__name__,
path=p,
index=index
)

# Children that are not of type Component or
# collections.MutableSequence not returned by traverse
child = getattr(j, 'children', None)
if not isinstance(child, collections.MutableSequence):
if child and not _value_is_valid(child):
_raise_invalid(
bad_val=child,
outer_val=val,
bad_type=type(child).__name__,
path=p + "\n" + "[*] " + type(child).__name__,
index=index
)

# Also check the child of val, as it will not be returned
child = getattr(val, 'children', None)
if not isinstance(child, collections.MutableSequence):
if child and not _value_is_valid(child):
_raise_invalid(
bad_val=child,
outer_val=val,
bad_type=type(child).__name__,
path=type(child).__name__,
index=index
)

# val is not a Component, but is at the top level of tree
else:
if not _value_is_valid(val):
_raise_invalid(
bad_val=val,
outer_val=type(val).__name__,
bad_type=type(val).__name__,
path='',
index=index,
toplevel=True
)

if isinstance(output_value, list):
for i, val in enumerate(output_value):
_validate_value(val, index=i)
else:
_validate_value(output_value)

# TODO - Update nomenclature.
# "Parents" and "Children" should refer to the DOM tree
# and not the dependency tree.
Expand DownExpand Up@@ -521,9 +625,26 @@ def add_context(*args, **kwargs):
}
}

try:
jsonResponse = json.dumps(
response,
cls=plotly.utils.PlotlyJSONEncoder
)
except TypeError:

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍 perfect

self._validate_callback_output(output_value, output)
raise exceptions.InvalidCallbackReturnValue('''
The callback for property `{property:s}`
of component `{id:s}` returned a value
which is not JSON serializable.

In general, Dash properties can only be
dash components, strings, dictionaries, numbers, None,
or lists of those.
'''.format(property=output.component_property,
id=output.component_id))

return flask.Response(
json.dumps(response,
cls=plotly.utils.PlotlyJSONEncoder),
jsonResponse,
mimetype='application/json'
)

Expand Down
28 changes: 21 additions & 7 deletions dash/development/base_component.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -151,22 +151,36 @@ def __delitem__(self, id): # pylint: disable=redefined-builtin

def traverse(self):
"""Yield each item in the tree."""
for t in self.traverse_with_paths():
yield t[1]

def traverse_with_paths(self):
"""Yield each item with its path in the tree."""
children = getattr(self, 'children', None)
children_type = type(children).__name__
children_id = "(id={:s})".format(children.id) \
if getattr(children, 'id', False) else ''
children_string = children_type + ' ' + children_id

# children is just a component
if isinstance(children, Component):
yield children
for t in children.traverse():
yield t
yield "[*] " + children_string, children
for p, t in children.traverse_with_paths():
yield "\n".join(["[*] " + children_string, p]), t

# children is a list of components
elif isinstance(children, collections.MutableSequence):
for i in children: # pylint: disable=not-an-iterable
yield i
for idx, i in enumerate(children):
list_path = "[{:d}] {:s} {}".format(
idx,
type(i).__name__,
"(id={:s})".format(i.id) if getattr(i, 'id', False) else ''
)
yield list_path, i

if isinstance(i, Component):
for t in i.traverse():
yield t
for p, t in i.traverse_with_paths():
yield "\n".join([list_path, p]), t

def __iter__(self):
"""Yield IDs in the tree of children."""
Expand Down
4 changes: 4 additions & 0 deletions dash/exceptions.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -44,3 +44,7 @@ class CantHaveMultipleOutputs(CallbackException):

class PreventUpdate(CallbackException):
pass


class InvalidCallbackReturnValue(CallbackException):
pass
2 changes: 1 addition & 1 deletion dev-requirements.txt
Original file line numberDiff line numberDiff line change
Expand Up@@ -12,4 +12,4 @@ six
plotly>=2.0.8
requests[security]
flake8
pylint
pylint==1.9.2
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Highlight search terms from Google/DuckDuckGo/Bing referrer\n(function() {\n var ref = document.referrer;\n var terms = [];\n \n if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {\n var url = new URL(ref);\n var q = url.searchParams.get('q') || url.searchParams.get('p');\n if (q) {\n terms = q.split(/\\s+/).filter(function(t) { return t.length > 2; });\n }\n }\n \n if (terms.length === 0) return;\n \n var style = document.createElement('style');\n style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';\n document.head.appendChild(style);\n \n function highlight(node) {\n if (node.nodeType === 3) { // text node\n var text = node.textContent;\n var found = false;\n terms.forEach(function(term) {\n var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\') + ')', 'gi');\n if (regex.test(text)) {\n found = true;\n var frag = document.createDocumentFragment();\n var parts = text.split(regex);\n parts.forEach(function(part, i) {\n if (i % 2 === 0) {\n frag.appendChild(document.createTextNode(part));\n } else {\n var span = document.createElement('span');\n span.className = 'userscript-highlight';\n span.textContent = part;\n frag.appendChild(span);\n }\n });\n node.parentNode.replaceChild(frag, node);\n }\n });\n } else if (node.nodeType === 1 && node.childNodes) { // element\n var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];\n if (!skipTags.includes(node.tagName)) {\n Array.from(node.childNodes).forEach(highlight);\n }\n }\n }\n \n highlight(document.body);\n \n // Re-highlight on dynamic content\n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1 || node.nodeType === 3) highlight(node);\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Highlight Search Terms"); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
Merged
125 changes: 123 additions & 2 deletions dash/dash.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -475,6 +475,110 @@ def _validate_callback(self, output, inputs, state, events):
output.component_id,
output.component_property).replace(' ', ''))

def _validate_callback_output(self, output_value, output):
valid = [str, dict, int, float, type(None), Component]

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Since we JSON serialize with the json.dumps(obj, cls=plotly.utils.PlotlyJSONEncoder), this list actually has a few other items: https://github.com/plotly/plotly.py/blob/6b3a0135977b92b3f7e0be2a1e8b418d995c70e3/plotly/utils.py#L137-L332

So, if there was a component property that accepted a list of numbers, then technically the user could return a numpy array or a dataframe.

The only example that immediately comes to mind is updating the figure property in a callback with the plotly.graph_objs. These objects get serialized because they have a to_plotly_json method.

So, I wonder if instead of validating up-front, we should only run this routine only if our json.dumps(resp, plotly.utils.PlotlyJSONEncoder) call fails.

This would have the other advantage of being faster for the non-error case. If the user returns a huge object (e.g. some of my callbacks in apps return a 2MB nested component), doing this recursive validation might be slow.

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That makes sense. I am not sure how large of a speed up that would be since validating a large callback output is likely much faster than the network delay of sending that large output, but it definitely makes it easier than crafting a perfect validator (that would need to update every time we want to extend PlotlyJSONEncoder).


def _raise_invalid(bad_val, outer_val, bad_type, path, index=None,
toplevel=False):
outer_id = "(id={:s})".format(outer_val.id) \
if getattr(outer_val, 'id', False) else ''
outer_type = type(outer_val).__name__
raise exceptions.InvalidCallbackReturnValue('''
The callback for property `{property:s}` of component `{id:s}`
returned a {object:s} having type `{type:s}`
which is not JSON serializable.

{location_header:s}{location:s}
and has string representation
`{bad_val}`

In general, Dash properties can only be
dash components, strings, dictionaries, numbers, None,
or lists of those.
'''.format(
property=output.component_property,
id=output.component_id,
object='tree with one value' if not toplevel else 'value',
type=bad_type,
location_header=(
'The value in question is located at'
if not toplevel else
'''The value in question is either the only value returned,
or is in the top level of the returned list,'''
),
location=(
"\n" +
("[{:d}] {:s} {:s}".format(index, outer_type, outer_id)
if index is not None
else ('[*] ' + outer_type + ' ' + outer_id))
+ "\n" + path + "\n"
) if not toplevel else '',
bad_val=bad_val).replace(' ', ''))

def _value_is_valid(val):
return (
# pylint: disable=unused-variable
any([isinstance(val, x) for x in valid]) or
type(val).__name__ == 'unicode'
)

def _validate_value(val, index=None):
# val is a Component
if isinstance(val, Component):
for p, j in val.traverse_with_paths():
# check each component value in the tree
if not _value_is_valid(j):
_raise_invalid(
bad_val=j,
outer_val=val,
bad_type=type(j).__name__,
path=p,
index=index
)

# Children that are not of type Component or
# collections.MutableSequence not returned by traverse
child = getattr(j, 'children', None)
if not isinstance(child, collections.MutableSequence):
if child and not _value_is_valid(child):
_raise_invalid(
bad_val=child,
outer_val=val,
bad_type=type(child).__name__,
path=p + "\n" + "[*] " + type(child).__name__,
index=index
)

# Also check the child of val, as it will not be returned
child = getattr(val, 'children', None)
if not isinstance(child, collections.MutableSequence):
if child and not _value_is_valid(child):
_raise_invalid(
bad_val=child,
outer_val=val,
bad_type=type(child).__name__,
path=type(child).__name__,
index=index
)

# val is not a Component, but is at the top level of tree
else:
if not _value_is_valid(val):
_raise_invalid(
bad_val=val,
outer_val=type(val).__name__,
bad_type=type(val).__name__,
path='',
index=index,
toplevel=True
)

if isinstance(output_value, list):
for i, val in enumerate(output_value):
_validate_value(val, index=i)
else:
_validate_value(output_value)

# TODO - Update nomenclature.
# "Parents" and "Children" should refer to the DOM tree
# and not the dependency tree.
Expand DownExpand Up@@ -521,9 +625,26 @@ def add_context(*args, **kwargs):
}
}

try:
jsonResponse = json.dumps(
response,
cls=plotly.utils.PlotlyJSONEncoder
)
except TypeError:

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍 perfect

self._validate_callback_output(output_value, output)
raise exceptions.InvalidCallbackReturnValue('''
The callback for property `{property:s}`
of component `{id:s}` returned a value
which is not JSON serializable.

In general, Dash properties can only be
dash components, strings, dictionaries, numbers, None,
or lists of those.
'''.format(property=output.component_property,
id=output.component_id))

return flask.Response(
json.dumps(response,
cls=plotly.utils.PlotlyJSONEncoder),
jsonResponse,
mimetype='application/json'
)

Expand Down
28 changes: 21 additions & 7 deletions dash/development/base_component.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -151,22 +151,36 @@ def __delitem__(self, id): # pylint: disable=redefined-builtin

def traverse(self):
"""Yield each item in the tree."""
for t in self.traverse_with_paths():
yield t[1]

def traverse_with_paths(self):
"""Yield each item with its path in the tree."""
children = getattr(self, 'children', None)
children_type = type(children).__name__
children_id = "(id={:s})".format(children.id) \
if getattr(children, 'id', False) else ''
children_string = children_type + ' ' + children_id

# children is just a component
if isinstance(children, Component):
yield children
for t in children.traverse():
yield t
yield "[*] " + children_string, children
for p, t in children.traverse_with_paths():
yield "\n".join(["[*] " + children_string, p]), t

# children is a list of components
elif isinstance(children, collections.MutableSequence):
for i in children: # pylint: disable=not-an-iterable
yield i
for idx, i in enumerate(children):
list_path = "[{:d}] {:s} {}".format(
idx,
type(i).__name__,
"(id={:s})".format(i.id) if getattr(i, 'id', False) else ''
)
yield list_path, i

if isinstance(i, Component):
for t in i.traverse():
yield t
for p, t in i.traverse_with_paths():
yield "\n".join([list_path, p]), t

def __iter__(self):
"""Yield IDs in the tree of children."""
Expand Down
4 changes: 4 additions & 0 deletions dash/exceptions.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -44,3 +44,7 @@ class CantHaveMultipleOutputs(CallbackException):

class PreventUpdate(CallbackException):
pass


class InvalidCallbackReturnValue(CallbackException):
pass
2 changes: 1 addition & 1 deletion dev-requirements.txt
Original file line numberDiff line numberDiff line change
Expand Up@@ -12,4 +12,4 @@ six
plotly>=2.0.8
requests[security]
flake8
pylint
pylint==1.9.2
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Strip utm_, fbclid, gclid, etc. from all links on page\n(function() {\n var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',\n 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',\n 'ref', 'ref_src', 'source', 'medium', 'campaign'];\n \n function cleanUrl(url) {\n try {\n var u = new URL(url, window.location.origin);\n var changed = false;\n trackingParams.forEach(function(p) {\n if (u.searchParams.has(p)) {\n u.searchParams.delete(p);\n changed = true;\n }\n });\n return changed ? u.toString() : url;\n } catch (e) {\n return url;\n }\n }\n \n function cleanLinks() {\n document.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n \n cleanLinks();\n \n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1) {\n if (node.tagName === 'A') cleanLinks();\n node.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Remove Tracking Parameters from Links"); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + '
Skip to content
Merged
125 changes: 123 additions & 2 deletions dash/dash.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -475,6 +475,110 @@ def _validate_callback(self, output, inputs, state, events):
output.component_id,
output.component_property).replace(' ', ''))

def _validate_callback_output(self, output_value, output):
valid = [str, dict, int, float, type(None), Component]

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Since we JSON serialize with the json.dumps(obj, cls=plotly.utils.PlotlyJSONEncoder), this list actually has a few other items: https://github.com/plotly/plotly.py/blob/6b3a0135977b92b3f7e0be2a1e8b418d995c70e3/plotly/utils.py#L137-L332

So, if there was a component property that accepted a list of numbers, then technically the user could return a numpy array or a dataframe.

The only example that immediately comes to mind is updating the figure property in a callback with the plotly.graph_objs. These objects get serialized because they have a to_plotly_json method.

So, I wonder if instead of validating up-front, we should only run this routine only if our json.dumps(resp, plotly.utils.PlotlyJSONEncoder) call fails.

This would have the other advantage of being faster for the non-error case. If the user returns a huge object (e.g. some of my callbacks in apps return a 2MB nested component), doing this recursive validation might be slow.

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That makes sense. I am not sure how large of a speed up that would be since validating a large callback output is likely much faster than the network delay of sending that large output, but it definitely makes it easier than crafting a perfect validator (that would need to update every time we want to extend PlotlyJSONEncoder).


def _raise_invalid(bad_val, outer_val, bad_type, path, index=None,
toplevel=False):
outer_id = "(id={:s})".format(outer_val.id) \
if getattr(outer_val, 'id', False) else ''
outer_type = type(outer_val).__name__
raise exceptions.InvalidCallbackReturnValue('''
The callback for property `{property:s}` of component `{id:s}`
returned a {object:s} having type `{type:s}`
which is not JSON serializable.

{location_header:s}{location:s}
and has string representation
`{bad_val}`

In general, Dash properties can only be
dash components, strings, dictionaries, numbers, None,
or lists of those.
'''.format(
property=output.component_property,
id=output.component_id,
object='tree with one value' if not toplevel else 'value',
type=bad_type,
location_header=(
'The value in question is located at'
if not toplevel else
'''The value in question is either the only value returned,
or is in the top level of the returned list,'''
),
location=(
"\n" +
("[{:d}] {:s} {:s}".format(index, outer_type, outer_id)
if index is not None
else ('[*] ' + outer_type + ' ' + outer_id))
+ "\n" + path + "\n"
) if not toplevel else '',
bad_val=bad_val).replace(' ', ''))

def _value_is_valid(val):
return (
# pylint: disable=unused-variable
any([isinstance(val, x) for x in valid]) or
type(val).__name__ == 'unicode'
)

def _validate_value(val, index=None):
# val is a Component
if isinstance(val, Component):
for p, j in val.traverse_with_paths():
# check each component value in the tree
if not _value_is_valid(j):
_raise_invalid(
bad_val=j,
outer_val=val,
bad_type=type(j).__name__,
path=p,
index=index
)

# Children that are not of type Component or
# collections.MutableSequence not returned by traverse
child = getattr(j, 'children', None)
if not isinstance(child, collections.MutableSequence):
if child and not _value_is_valid(child):
_raise_invalid(
bad_val=child,
outer_val=val,
bad_type=type(child).__name__,
path=p + "\n" + "[*] " + type(child).__name__,
index=index
)

# Also check the child of val, as it will not be returned
child = getattr(val, 'children', None)
if not isinstance(child, collections.MutableSequence):
if child and not _value_is_valid(child):
_raise_invalid(
bad_val=child,
outer_val=val,
bad_type=type(child).__name__,
path=type(child).__name__,
index=index
)

# val is not a Component, but is at the top level of tree
else:
if not _value_is_valid(val):
_raise_invalid(
bad_val=val,
outer_val=type(val).__name__,
bad_type=type(val).__name__,
path='',
index=index,
toplevel=True
)

if isinstance(output_value, list):
for i, val in enumerate(output_value):
_validate_value(val, index=i)
else:
_validate_value(output_value)

# TODO - Update nomenclature.
# "Parents" and "Children" should refer to the DOM tree
# and not the dependency tree.
Expand DownExpand Up@@ -521,9 +625,26 @@ def add_context(*args, **kwargs):
}
}

try:
jsonResponse = json.dumps(
response,
cls=plotly.utils.PlotlyJSONEncoder
)
except TypeError:

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍 perfect

self._validate_callback_output(output_value, output)
raise exceptions.InvalidCallbackReturnValue('''
The callback for property `{property:s}`
of component `{id:s}` returned a value
which is not JSON serializable.

In general, Dash properties can only be
dash components, strings, dictionaries, numbers, None,
or lists of those.
'''.format(property=output.component_property,
id=output.component_id))

return flask.Response(
json.dumps(response,
cls=plotly.utils.PlotlyJSONEncoder),
jsonResponse,
mimetype='application/json'
)

Expand Down
28 changes: 21 additions & 7 deletions dash/development/base_component.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -151,22 +151,36 @@ def __delitem__(self, id): # pylint: disable=redefined-builtin

def traverse(self):
"""Yield each item in the tree."""
for t in self.traverse_with_paths():
yield t[1]

def traverse_with_paths(self):
"""Yield each item with its path in the tree."""
children = getattr(self, 'children', None)
children_type = type(children).__name__
children_id = "(id={:s})".format(children.id) \
if getattr(children, 'id', False) else ''
children_string = children_type + ' ' + children_id

# children is just a component
if isinstance(children, Component):
yield children
for t in children.traverse():
yield t
yield "[*] " + children_string, children
for p, t in children.traverse_with_paths():
yield "\n".join(["[*] " + children_string, p]), t

# children is a list of components
elif isinstance(children, collections.MutableSequence):
for i in children: # pylint: disable=not-an-iterable
yield i
for idx, i in enumerate(children):
list_path = "[{:d}] {:s} {}".format(
idx,
type(i).__name__,
"(id={:s})".format(i.id) if getattr(i, 'id', False) else ''
)
yield list_path, i

if isinstance(i, Component):
for t in i.traverse():
yield t
for p, t in i.traverse_with_paths():
yield "\n".join([list_path, p]), t

def __iter__(self):
"""Yield IDs in the tree of children."""
Expand Down
4 changes: 4 additions & 0 deletions dash/exceptions.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -44,3 +44,7 @@ class CantHaveMultipleOutputs(CallbackException):

class PreventUpdate(CallbackException):
pass


class InvalidCallbackReturnValue(CallbackException):
pass
2 changes: 1 addition & 1 deletion dev-requirements.txt
Original file line numberDiff line numberDiff line change
Expand Up@@ -12,4 +12,4 @@ six
plotly>=2.0.8
requests[security]
flake8
pylint
pylint==1.9.2
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Auto-enable theater mode on YouTube\n(function() {\n function tryTheater() {\n var btn = document.querySelector('button[aria-label=\"Theater mode\"], ytd-player #player button[title=\"Theater mode\"]');\n if (btn && !btn.classList.contains('activated')) {\n btn.click();\n }\n }\n \n // Try immediately\n tryTheater();\n \n // Try after navigation (SPA)\n var lastUrl = location.href;\n setInterval(function() {\n if (location.href !== lastUrl) {\n lastUrl = location.href;\n setTimeout(tryTheater, 500);\n }\n }, 1000);\n \n // Also try on player load\n var observer = new MutationObserver(tryTheater);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "YouTube Theater Mode Default"); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
Merged
125 changes: 123 additions & 2 deletions dash/dash.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -475,6 +475,110 @@ def _validate_callback(self, output, inputs, state, events):
output.component_id,
output.component_property).replace(' ', ''))

def _validate_callback_output(self, output_value, output):
valid = [str, dict, int, float, type(None), Component]

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Since we JSON serialize with the json.dumps(obj, cls=plotly.utils.PlotlyJSONEncoder), this list actually has a few other items: https://github.com/plotly/plotly.py/blob/6b3a0135977b92b3f7e0be2a1e8b418d995c70e3/plotly/utils.py#L137-L332

So, if there was a component property that accepted a list of numbers, then technically the user could return a numpy array or a dataframe.

The only example that immediately comes to mind is updating the figure property in a callback with the plotly.graph_objs. These objects get serialized because they have a to_plotly_json method.

So, I wonder if instead of validating up-front, we should only run this routine only if our json.dumps(resp, plotly.utils.PlotlyJSONEncoder) call fails.

This would have the other advantage of being faster for the non-error case. If the user returns a huge object (e.g. some of my callbacks in apps return a 2MB nested component), doing this recursive validation might be slow.

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That makes sense. I am not sure how large of a speed up that would be since validating a large callback output is likely much faster than the network delay of sending that large output, but it definitely makes it easier than crafting a perfect validator (that would need to update every time we want to extend PlotlyJSONEncoder).


def _raise_invalid(bad_val, outer_val, bad_type, path, index=None,
toplevel=False):
outer_id = "(id={:s})".format(outer_val.id) \
if getattr(outer_val, 'id', False) else ''
outer_type = type(outer_val).__name__
raise exceptions.InvalidCallbackReturnValue('''
The callback for property `{property:s}` of component `{id:s}`
returned a {object:s} having type `{type:s}`
which is not JSON serializable.

{location_header:s}{location:s}
and has string representation
`{bad_val}`

In general, Dash properties can only be
dash components, strings, dictionaries, numbers, None,
or lists of those.
'''.format(
property=output.component_property,
id=output.component_id,
object='tree with one value' if not toplevel else 'value',
type=bad_type,
location_header=(
'The value in question is located at'
if not toplevel else
'''The value in question is either the only value returned,
or is in the top level of the returned list,'''
),
location=(
"\n" +
("[{:d}] {:s} {:s}".format(index, outer_type, outer_id)
if index is not None
else ('[*] ' + outer_type + ' ' + outer_id))
+ "\n" + path + "\n"
) if not toplevel else '',
bad_val=bad_val).replace(' ', ''))

def _value_is_valid(val):
return (
# pylint: disable=unused-variable
any([isinstance(val, x) for x in valid]) or
type(val).__name__ == 'unicode'
)

def _validate_value(val, index=None):
# val is a Component
if isinstance(val, Component):
for p, j in val.traverse_with_paths():
# check each component value in the tree
if not _value_is_valid(j):
_raise_invalid(
bad_val=j,
outer_val=val,
bad_type=type(j).__name__,
path=p,
index=index
)

# Children that are not of type Component or
# collections.MutableSequence not returned by traverse
child = getattr(j, 'children', None)
if not isinstance(child, collections.MutableSequence):
if child and not _value_is_valid(child):
_raise_invalid(
bad_val=child,
outer_val=val,
bad_type=type(child).__name__,
path=p + "\n" + "[*] " + type(child).__name__,
index=index
)

# Also check the child of val, as it will not be returned
child = getattr(val, 'children', None)
if not isinstance(child, collections.MutableSequence):
if child and not _value_is_valid(child):
_raise_invalid(
bad_val=child,
outer_val=val,
bad_type=type(child).__name__,
path=type(child).__name__,
index=index
)

# val is not a Component, but is at the top level of tree
else:
if not _value_is_valid(val):
_raise_invalid(
bad_val=val,
outer_val=type(val).__name__,
bad_type=type(val).__name__,
path='',
index=index,
toplevel=True
)

if isinstance(output_value, list):
for i, val in enumerate(output_value):
_validate_value(val, index=i)
else:
_validate_value(output_value)

# TODO - Update nomenclature.
# "Parents" and "Children" should refer to the DOM tree
# and not the dependency tree.
Expand DownExpand Up@@ -521,9 +625,26 @@ def add_context(*args, **kwargs):
}
}

try:
jsonResponse = json.dumps(
response,
cls=plotly.utils.PlotlyJSONEncoder
)
except TypeError:

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍 perfect

self._validate_callback_output(output_value, output)
raise exceptions.InvalidCallbackReturnValue('''
The callback for property `{property:s}`
of component `{id:s}` returned a value
which is not JSON serializable.

In general, Dash properties can only be
dash components, strings, dictionaries, numbers, None,
or lists of those.
'''.format(property=output.component_property,
id=output.component_id))

return flask.Response(
json.dumps(response,
cls=plotly.utils.PlotlyJSONEncoder),
jsonResponse,
mimetype='application/json'
)

Expand Down
28 changes: 21 additions & 7 deletions dash/development/base_component.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -151,22 +151,36 @@ def __delitem__(self, id): # pylint: disable=redefined-builtin

def traverse(self):
"""Yield each item in the tree."""
for t in self.traverse_with_paths():
yield t[1]

def traverse_with_paths(self):
"""Yield each item with its path in the tree."""
children = getattr(self, 'children', None)
children_type = type(children).__name__
children_id = "(id={:s})".format(children.id) \
if getattr(children, 'id', False) else ''
children_string = children_type + ' ' + children_id

# children is just a component
if isinstance(children, Component):
yield children
for t in children.traverse():
yield t
yield "[*] " + children_string, children
for p, t in children.traverse_with_paths():
yield "\n".join(["[*] " + children_string, p]), t

# children is a list of components
elif isinstance(children, collections.MutableSequence):
for i in children: # pylint: disable=not-an-iterable
yield i
for idx, i in enumerate(children):
list_path = "[{:d}] {:s} {}".format(
idx,
type(i).__name__,
"(id={:s})".format(i.id) if getattr(i, 'id', False) else ''
)
yield list_path, i

if isinstance(i, Component):
for t in i.traverse():
yield t
for p, t in i.traverse_with_paths():
yield "\n".join([list_path, p]), t

def __iter__(self):
"""Yield IDs in the tree of children."""
Expand Down
4 changes: 4 additions & 0 deletions dash/exceptions.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -44,3 +44,7 @@ class CantHaveMultipleOutputs(CallbackException):

class PreventUpdate(CallbackException):
pass


class InvalidCallbackReturnValue(CallbackException):
pass
2 changes: 1 addition & 1 deletion dev-requirements.txt
Original file line numberDiff line numberDiff line change
Expand Up@@ -12,4 +12,4 @@ six
plotly>=2.0.8
requests[security]
flake8
pylint
pylint==1.9.2
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Remove or un-stick sticky/fixed headers that block content\n(function() {\n function unstick() {\n document.querySelectorAll('header, nav, [role=\"banner\"], .header, .navbar, .sticky, .fixed-top, [style*=\"position: fixed\"], [style*=\"position:sticky\"]').forEach(function(el) {\n if (el.style.position === 'fixed' || el.style.position === 'sticky' || \n getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {\n el.style.position = 'static';\n el.style.top = 'auto';\n el.style.zIndex = 'auto';\n }\n });\n }\n \n unstick();\n \n var observer = new MutationObserver(unstick);\n observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });\n})();", "Kill Sticky Headers"); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
Merged
125 changes: 123 additions & 2 deletions dash/dash.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -475,6 +475,110 @@ def _validate_callback(self, output, inputs, state, events):
output.component_id,
output.component_property).replace(' ', ''))

def _validate_callback_output(self, output_value, output):
valid = [str, dict, int, float, type(None), Component]

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Since we JSON serialize with the json.dumps(obj, cls=plotly.utils.PlotlyJSONEncoder), this list actually has a few other items: https://github.com/plotly/plotly.py/blob/6b3a0135977b92b3f7e0be2a1e8b418d995c70e3/plotly/utils.py#L137-L332

So, if there was a component property that accepted a list of numbers, then technically the user could return a numpy array or a dataframe.

The only example that immediately comes to mind is updating the figure property in a callback with the plotly.graph_objs. These objects get serialized because they have a to_plotly_json method.

So, I wonder if instead of validating up-front, we should only run this routine only if our json.dumps(resp, plotly.utils.PlotlyJSONEncoder) call fails.

This would have the other advantage of being faster for the non-error case. If the user returns a huge object (e.g. some of my callbacks in apps return a 2MB nested component), doing this recursive validation might be slow.

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That makes sense. I am not sure how large of a speed up that would be since validating a large callback output is likely much faster than the network delay of sending that large output, but it definitely makes it easier than crafting a perfect validator (that would need to update every time we want to extend PlotlyJSONEncoder).


def _raise_invalid(bad_val, outer_val, bad_type, path, index=None,
toplevel=False):
outer_id = "(id={:s})".format(outer_val.id) \
if getattr(outer_val, 'id', False) else ''
outer_type = type(outer_val).__name__
raise exceptions.InvalidCallbackReturnValue('''
The callback for property `{property:s}` of component `{id:s}`
returned a {object:s} having type `{type:s}`
which is not JSON serializable.

{location_header:s}{location:s}
and has string representation
`{bad_val}`

In general, Dash properties can only be
dash components, strings, dictionaries, numbers, None,
or lists of those.
'''.format(
property=output.component_property,
id=output.component_id,
object='tree with one value' if not toplevel else 'value',
type=bad_type,
location_header=(
'The value in question is located at'
if not toplevel else
'''The value in question is either the only value returned,
or is in the top level of the returned list,'''
),
location=(
"\n" +
("[{:d}] {:s} {:s}".format(index, outer_type, outer_id)
if index is not None
else ('[*] ' + outer_type + ' ' + outer_id))
+ "\n" + path + "\n"
) if not toplevel else '',
bad_val=bad_val).replace(' ', ''))

def _value_is_valid(val):
return (
# pylint: disable=unused-variable
any([isinstance(val, x) for x in valid]) or
type(val).__name__ == 'unicode'
)

def _validate_value(val, index=None):
# val is a Component
if isinstance(val, Component):
for p, j in val.traverse_with_paths():
# check each component value in the tree
if not _value_is_valid(j):
_raise_invalid(
bad_val=j,
outer_val=val,
bad_type=type(j).__name__,
path=p,
index=index
)

# Children that are not of type Component or
# collections.MutableSequence not returned by traverse
child = getattr(j, 'children', None)
if not isinstance(child, collections.MutableSequence):
if child and not _value_is_valid(child):
_raise_invalid(
bad_val=child,
outer_val=val,
bad_type=type(child).__name__,
path=p + "\n" + "[*] " + type(child).__name__,
index=index
)

# Also check the child of val, as it will not be returned
child = getattr(val, 'children', None)
if not isinstance(child, collections.MutableSequence):
if child and not _value_is_valid(child):
_raise_invalid(
bad_val=child,
outer_val=val,
bad_type=type(child).__name__,
path=type(child).__name__,
index=index
)

# val is not a Component, but is at the top level of tree
else:
if not _value_is_valid(val):
_raise_invalid(
bad_val=val,
outer_val=type(val).__name__,
bad_type=type(val).__name__,
path='',
index=index,
toplevel=True
)

if isinstance(output_value, list):
for i, val in enumerate(output_value):
_validate_value(val, index=i)
else:
_validate_value(output_value)

# TODO - Update nomenclature.
# "Parents" and "Children" should refer to the DOM tree
# and not the dependency tree.
Expand DownExpand Up@@ -521,9 +625,26 @@ def add_context(*args, **kwargs):
}
}

try:
jsonResponse = json.dumps(
response,
cls=plotly.utils.PlotlyJSONEncoder
)
except TypeError:

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍 perfect

self._validate_callback_output(output_value, output)
raise exceptions.InvalidCallbackReturnValue('''
The callback for property `{property:s}`
of component `{id:s}` returned a value
which is not JSON serializable.

In general, Dash properties can only be
dash components, strings, dictionaries, numbers, None,
or lists of those.
'''.format(property=output.component_property,
id=output.component_id))

return flask.Response(
json.dumps(response,
cls=plotly.utils.PlotlyJSONEncoder),
jsonResponse,
mimetype='application/json'
)

Expand Down
28 changes: 21 additions & 7 deletions dash/development/base_component.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -151,22 +151,36 @@ def __delitem__(self, id): # pylint: disable=redefined-builtin

def traverse(self):
"""Yield each item in the tree."""
for t in self.traverse_with_paths():
yield t[1]

def traverse_with_paths(self):
"""Yield each item with its path in the tree."""
children = getattr(self, 'children', None)
children_type = type(children).__name__
children_id = "(id={:s})".format(children.id) \
if getattr(children, 'id', False) else ''
children_string = children_type + ' ' + children_id

# children is just a component
if isinstance(children, Component):
yield children
for t in children.traverse():
yield t
yield "[*] " + children_string, children
for p, t in children.traverse_with_paths():
yield "\n".join(["[*] " + children_string, p]), t

# children is a list of components
elif isinstance(children, collections.MutableSequence):
for i in children: # pylint: disable=not-an-iterable
yield i
for idx, i in enumerate(children):
list_path = "[{:d}] {:s} {}".format(
idx,
type(i).__name__,
"(id={:s})".format(i.id) if getattr(i, 'id', False) else ''
)
yield list_path, i

if isinstance(i, Component):
for t in i.traverse():
yield t
for p, t in i.traverse_with_paths():
yield "\n".join([list_path, p]), t

def __iter__(self):
"""Yield IDs in the tree of children."""
Expand Down
4 changes: 4 additions & 0 deletions dash/exceptions.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -44,3 +44,7 @@ class CantHaveMultipleOutputs(CallbackException):

class PreventUpdate(CallbackException):
pass


class InvalidCallbackReturnValue(CallbackException):
pass
2 changes: 1 addition & 1 deletion dev-requirements.txt
Original file line numberDiff line numberDiff line change
Expand Up@@ -12,4 +12,4 @@ six
plotly>=2.0.8
requests[security]
flake8
pylint
pylint==1.9.2
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Universal Dark Mode - works on any site\n(function() {\n var enabled = true;\n \n function applyDarkMode() {\n if (!enabled) return;\n \n // Create style element if it doesn't exist\n var style = document.getElementById('universal-dark-mode-style');\n if (!style) {\n style = document.createElement('style');\n style.id = 'universal-dark-mode-style';\n document.head.appendChild(style);\n }\n \n // Dark mode CSS - inverts colors but preserves images/video\n style.textContent = '\n /* Invert everything except media */\n html {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #1a1a2e !important;\n }\n \n /* Restore images, videos, iframes, canvas */\n img, video, iframe, canvas, svg, picture, [style*=\"background-image\"] {\n filter: invert(1) hue-rotate(180deg) !important;\n }\n \n /* Preserve specific elements that should not be inverted */\n .no-dark-mode, .no-dark-mode *,\n [data-theme=\"light\"], [data-theme=\"light\"],\n .ace_editor, .ace_editor *,\n .CodeMirror, .CodeMirror *,\n .monaco-editor, .monaco-editor *,\n .markdown-body pre, .markdown-body pre *,\n .highlight, .highlight *,\n pre code, pre code * {\n filter: none !important;\n }\n \n /* Fix common UI elements */\n .modal, .popup, .dropdown-menu, .tooltip, .popover {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #2d2d44 !important;\n border-color: #444 !important;\n }\n \n /* Scrollbars */\n ::-webkit-scrollbar { background: #1a1a2e !important; }\n ::-webkit-scrollbar-thumb { background: #444 !important; }\n ::-webkit-scrollbar-thumb:hover { background: #555 !important; }\n \n /* Selection */\n ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ';\n }\n \n function removeDarkMode() {\n var style = document.getElementById('universal-dark-mode-style');\n if (style) style.remove();\n }\n \n // Toggle with Alt+Shift+D\n document.addEventListener('keydown', function(e) {\n if (e.altKey && e.shiftKey && e.key === 'D') {\n e.preventDefault();\n enabled = !enabled;\n if (enabled) {\n applyDarkMode();\n console.log('[Universal Dark Mode] Enabled');\n } else {\n removeDarkMode();\n console.log('[Universal Dark Mode] Disabled');\n }\n }\n });\n \n // Apply on load\n applyDarkMode();\n \n // Re-apply on dynamic content\n var observer = new MutationObserver(function(mutations) {\n if (enabled && !document.getElementById('universal-dark-mode-style')) {\n applyDarkMode();\n }\n });\n observer.observe(document.head, { childList: true });\n \n console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle');\n})();", "Universal Dark Mode"); } } catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); } })(); })();
Skip to content
Merged
125 changes: 123 additions & 2 deletions dash/dash.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -475,6 +475,110 @@ def _validate_callback(self, output, inputs, state, events):
output.component_id,
output.component_property).replace(' ', ''))

def _validate_callback_output(self, output_value, output):
valid = [str, dict, int, float, type(None), Component]

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Since we JSON serialize with the json.dumps(obj, cls=plotly.utils.PlotlyJSONEncoder), this list actually has a few other items: https://github.com/plotly/plotly.py/blob/6b3a0135977b92b3f7e0be2a1e8b418d995c70e3/plotly/utils.py#L137-L332

So, if there was a component property that accepted a list of numbers, then technically the user could return a numpy array or a dataframe.

The only example that immediately comes to mind is updating the figure property in a callback with the plotly.graph_objs. These objects get serialized because they have a to_plotly_json method.

So, I wonder if instead of validating up-front, we should only run this routine only if our json.dumps(resp, plotly.utils.PlotlyJSONEncoder) call fails.

This would have the other advantage of being faster for the non-error case. If the user returns a huge object (e.g. some of my callbacks in apps return a 2MB nested component), doing this recursive validation might be slow.

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That makes sense. I am not sure how large of a speed up that would be since validating a large callback output is likely much faster than the network delay of sending that large output, but it definitely makes it easier than crafting a perfect validator (that would need to update every time we want to extend PlotlyJSONEncoder).


def _raise_invalid(bad_val, outer_val, bad_type, path, index=None,
toplevel=False):
outer_id = "(id={:s})".format(outer_val.id) \
if getattr(outer_val, 'id', False) else ''
outer_type = type(outer_val).__name__
raise exceptions.InvalidCallbackReturnValue('''
The callback for property `{property:s}` of component `{id:s}`
returned a {object:s} having type `{type:s}`
which is not JSON serializable.

{location_header:s}{location:s}
and has string representation
`{bad_val}`

In general, Dash properties can only be
dash components, strings, dictionaries, numbers, None,
or lists of those.
'''.format(
property=output.component_property,
id=output.component_id,
object='tree with one value' if not toplevel else 'value',
type=bad_type,
location_header=(
'The value in question is located at'
if not toplevel else
'''The value in question is either the only value returned,
or is in the top level of the returned list,'''
),
location=(
"\n" +
("[{:d}] {:s} {:s}".format(index, outer_type, outer_id)
if index is not None
else ('[*] ' + outer_type + ' ' + outer_id))
+ "\n" + path + "\n"
) if not toplevel else '',
bad_val=bad_val).replace(' ', ''))

def _value_is_valid(val):
return (
# pylint: disable=unused-variable
any([isinstance(val, x) for x in valid]) or
type(val).__name__ == 'unicode'
)

def _validate_value(val, index=None):
# val is a Component
if isinstance(val, Component):
for p, j in val.traverse_with_paths():
# check each component value in the tree
if not _value_is_valid(j):
_raise_invalid(
bad_val=j,
outer_val=val,
bad_type=type(j).__name__,
path=p,
index=index
)

# Children that are not of type Component or
# collections.MutableSequence not returned by traverse
child = getattr(j, 'children', None)
if not isinstance(child, collections.MutableSequence):
if child and not _value_is_valid(child):
_raise_invalid(
bad_val=child,
outer_val=val,
bad_type=type(child).__name__,
path=p + "\n" + "[*] " + type(child).__name__,
index=index
)

# Also check the child of val, as it will not be returned
child = getattr(val, 'children', None)
if not isinstance(child, collections.MutableSequence):
if child and not _value_is_valid(child):
_raise_invalid(
bad_val=child,
outer_val=val,
bad_type=type(child).__name__,
path=type(child).__name__,
index=index
)

# val is not a Component, but is at the top level of tree
else:
if not _value_is_valid(val):
_raise_invalid(
bad_val=val,
outer_val=type(val).__name__,
bad_type=type(val).__name__,
path='',
index=index,
toplevel=True
)

if isinstance(output_value, list):
for i, val in enumerate(output_value):
_validate_value(val, index=i)
else:
_validate_value(output_value)

# TODO - Update nomenclature.
# "Parents" and "Children" should refer to the DOM tree
# and not the dependency tree.
Expand DownExpand Up@@ -521,9 +625,26 @@ def add_context(*args, **kwargs):
}
}

try:
jsonResponse = json.dumps(
response,
cls=plotly.utils.PlotlyJSONEncoder
)
except TypeError:

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍 perfect

self._validate_callback_output(output_value, output)
raise exceptions.InvalidCallbackReturnValue('''
The callback for property `{property:s}`
of component `{id:s}` returned a value
which is not JSON serializable.

In general, Dash properties can only be
dash components, strings, dictionaries, numbers, None,
or lists of those.
'''.format(property=output.component_property,
id=output.component_id))

return flask.Response(
json.dumps(response,
cls=plotly.utils.PlotlyJSONEncoder),
jsonResponse,
mimetype='application/json'
)

Expand Down
28 changes: 21 additions & 7 deletions dash/development/base_component.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -151,22 +151,36 @@ def __delitem__(self, id): # pylint: disable=redefined-builtin

def traverse(self):
"""Yield each item in the tree."""
for t in self.traverse_with_paths():
yield t[1]

def traverse_with_paths(self):
"""Yield each item with its path in the tree."""
children = getattr(self, 'children', None)
children_type = type(children).__name__
children_id = "(id={:s})".format(children.id) \
if getattr(children, 'id', False) else ''
children_string = children_type + ' ' + children_id

# children is just a component
if isinstance(children, Component):
yield children
for t in children.traverse():
yield t
yield "[*] " + children_string, children
for p, t in children.traverse_with_paths():
yield "\n".join(["[*] " + children_string, p]), t

# children is a list of components
elif isinstance(children, collections.MutableSequence):
for i in children: # pylint: disable=not-an-iterable
yield i
for idx, i in enumerate(children):
list_path = "[{:d}] {:s} {}".format(
idx,
type(i).__name__,
"(id={:s})".format(i.id) if getattr(i, 'id', False) else ''
)
yield list_path, i

if isinstance(i, Component):
for t in i.traverse():
yield t
for p, t in i.traverse_with_paths():
yield "\n".join([list_path, p]), t

def __iter__(self):
"""Yield IDs in the tree of children."""
Expand Down
4 changes: 4 additions & 0 deletions dash/exceptions.py
Original file line numberDiff line numberDiff line change
Expand Up@@ -44,3 +44,7 @@ class CantHaveMultipleOutputs(CallbackException):

class PreventUpdate(CallbackException):
pass


class InvalidCallbackReturnValue(CallbackException):
pass
2 changes: 1 addition & 1 deletion dev-requirements.txt
Original file line numberDiff line numberDiff line change
Expand Up@@ -12,4 +12,4 @@ six
plotly>=2.0.8
requests[security]
flake8
pylint
pylint==1.9.2