livebook-dev/livebook
1
1
Fork 0
mirror of https://github.com/livebook-dev/livebook.git synced 2025-09-10 23:14:35 +08:00
Code Issues Projects Releases Packages Wiki Activity

JS output fixes (#991)

Browse source 
* Explicitly leave the JS channel before disconnecting the socket

* Reposition iframe when the sidebar is toggled and on window resize
This commit is contained in:
Jonatan Kłosko 2022-02-08 20:12:03 +01:00 • committed by GitHub
parent c972b195c5
commit 565f65d0fc
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 13 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
assets/js/js_output/index.js
View file

@ -146,11 +146,6 @@ const JSOutput = {
// Event handlers // Event handlers
channel.push("connect", {
session_token: this.props.sessionToken,
ref: this.props.ref,
});
const initRef = channel.on(`init:${this.props.ref}`, (raw) => { const initRef = channel.on(`init:${this.props.ref}`, (raw) => {
const [, payload] = transportDecode(raw); const [, payload] = transportDecode(raw);
@ -182,6 +177,11 @@ const JSOutput = {
channel.off(`event:${this.props.ref}`, eventRef); channel.off(`event:${this.props.ref}`, eventRef);
channel.off(`error:${this.props.ref}`, errorRef); channel.off(`error:${this.props.ref}`, errorRef);
}; };
channel.push("connect", {
session_token: this.props.sessionToken,
ref: this.props.ref,
});
}, },
updated() { updated() {
@ -241,8 +241,9 @@ function getChannel(sessionId, { create = true } = {}) {
* Leaves the JS outputs channel tied to the current session. * Leaves the JS outputs channel tied to the current session.
*/ */
export function leaveChannel() { export function leaveChannel() {
socket.disconnect(); channel.leave();
channel = null; channel = null;
socket.disconnect();
} }
/** /**
@ -267,10 +268,14 @@ function bindIframeSize(iframe, iframePlaceholder) {
} }
// Most output position changes are accompanied by changes to the // Most output position changes are accompanied by changes to the
// notebook content element (adding cells, inserting newlines in // notebook content element height (adding cells, inserting newlines
// the editor, etc) // in the editor, etc). On the other hand, toggling the sidebar or
// resizing the window changes the width, however the notebook
// content element doesn't span full width, so this change may not
// be detected, that's why we observe the full-width parent element
const resizeObserver = new ResizeObserver((entries) => repositionIframe()); const resizeObserver = new ResizeObserver((entries) => repositionIframe());
resizeObserver.observe(notebookContentEl); resizeObserver.observe(notebookContentEl);
resizeObserver.observe(notebookEl);
// On lower level cell/section reordering is applied as element // On lower level cell/section reordering is applied as element
// removal followed by insert, consequently the intersection // removal followed by insert, consequently the intersection