Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Stack traces do not render in the dev tools UI when using RStudio's viewer pane #994

Closed
rpkyle opened this issue Nov 2, 2019 · 0 comments · Fixed by #996
Closed

Stack traces do not render in the dev tools UI when using RStudio's viewer pane #994

rpkyle opened this issue Nov 2, 2019 · 0 comments · Fixed by #996
Assignees
@rpkyle

Comments

@rpkyle
Copy link
Contributor

rpkyle commented Nov 2, 2019 •
edited
Loading

RStudio's IDE does not allow embedding of iframe elements which include content from "external" URLs, as noted in rstudio/rstudioapi#2.

The way that dash-renderer currently handles stack traces places them into an iframe so that Werkzeug's CSS doesn't affect the display of the rest of the page:

dash/dash-renderer/src/components/error/FrontEnd/FrontEndError.react.js

Lines 111 to 143 in b3b9de9

{typeof error.html !== 'string' ? null : (
<div className="dash-be-error__st">
<div className="dash-backend-error">
{/* Embed werkzeug debugger in an iframe to prevent
CSS leaking - werkzeug HTML includes a bunch
of CSS on base html elements like `<body/>`
*/}
<iframe
srcDoc={error.html
.replace(
'</head>',
`<style type="text/css">${werkzeugCss}</style></head>`
)
.replace(
'="?__debugger__',
`="${base}?__debugger__`
)}
style={{
/*
* 67px of padding and margin between this
* iframe and the parent container.
* 67 was determined manually in the
* browser's dev tools.
*/
width: 'calc(600px - 67px)',
height: '75vh',
border: 'none',
}}
/>
</div>
</div>
)}

This has the unfortunate consequence of showing no stack trace within RStudio, though it appears properly in standalone browsers:

image

The plot_ly function gets around this problem by embedding source from localhost, which is allowed:

<iframe class="gwt-Frame ace_editor_theme" src="http://localhost:29325/session/viewhtml98b753d4ffc6/index.html?viewer_pane=1" style="width: 100%; height: 100%; position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px; background-color: rgb(255, 255, 255);"></iframe>

We can preserve the existing behaviour in the renderer for Python apps by implementing a condition which checks whether the content of the stack trace begins with <!DOCTYPE HTML>, then enclose in an iframe if true.

Dash for R would then be modified to send back a stack trace that is raw text, which the renderer will insert directly within <pre> tags (since the above condition would be false), and this should enable support for stack trace display in the RStudio viewer as well as standalone browsers.

@alexcjohnson
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@rpkyle rpkyle

Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Fix display of stack traces within RStudio's viewer pane plotly/dash
2 participants
@Marc-Andre-Rivet @rpkyle