Multi-line Stream Outputs are not rendered in separate lines (regression)

remarcmij commented 1 year ago

Applies To

[X] Notebooks (.ipynb files)
[ ] Interactive Window and\/or Cell Scripts (.py files with #%% markers)

What happened?

I've been using Jupyter Notebooks in the past to teach students async programming in JavaScript using the tslab kernel. This worked fine in earlier versions of the vscode-jupyter extension but more recently the async output became inconsistent between different runs. For instance:

console.log('starting');

setTimeout(() => {
  console.log('timeout 1');
}, 0);

setTimeout(() => {
  console.log('timeout 2');
}, 0);

console.log('ending');

Run 1:

starting
ending
timeout 1
timeout 2

Run 2:

starting
ending
timeout 1 timeout 1 timeout 2

Run 3:

starting
ending
timeout 1timeout 2

The same JavaScript code when used with jupyter-lab consistently produces correct output 1.

VS Code Version

Version: 1.73.0-insider (user setup) Commit: a8108049ab61b970f2ec1839dfb753054e07395e Date: 2022-10-13T05:19:31.002Z Electron: 19.0.17 Chromium: 102.0.5005.167 Node.js: 16.14.2 V8: 10.2.154.15-electron.0 OS: Windows_NT x64 10.0.22623 Sandboxed: Yes

Jupyter Extension Version

v2022.10.1102881143

Jupyter logs

Visual Studio Code - Insiders (1.73.0-insider, undefined, desktop)
Jupyter Extension Version: 2022.10.1102881143.
Python Extension Version: 2022.16.0.
Workspace folder c:\Users\jimcr\dev\hackyourfuture\usingapis-qanda
info 16:10:15.381: ZMQ install verified.
User belongs to experiment group 'jupyterTest'
User belongs to experiment group 'jupyterEnhancedDataViewer'
info 16:10:15.757: LSP Notebooks experiment is enabled
info 16:10:16.870: Preferred Remote kernel for c:\Users\jimcr\dev\hackyourfuture\usingapis-qanda\week1\eventloop.ipynb is undefined
info 16:10:16.870: Find preferred kernel for c:\Users\jimcr\dev\hackyourfuture\usingapis-qanda\week1\eventloop.ipynb with metadata {"kernelspec":{"display_name":"JavaScript","language":"javascript","name":"jslab"},"language_info":{"file_extension":".js","mimetype":"text/javascript","name":"javascript","version":""},"orig_nbformat":4} & preferred interpreter 
info 16:10:16.924: Preferred Remote kernel for c:\Users\jimcr\dev\hackyourfuture\usingapis-qanda\week1\eventloop.ipynb is undefined
info 16:10:17.175: Preferred Remote kernel for c:\Users\jimcr\dev\hackyourfuture\usingapis-qanda\week1\eventloop.ipynb is undefined
info 16:10:17.175: Preferred kernel .jslab.tslab.cmd.\.tslab.cmd#kernel#--config-path#{connection_file}#--js is exact match or top match for non python kernels, (false, undefined, true, true)
info 16:10:17.179: PreferredConnection: .jslab.tslab.cmd.\.tslab.cmd#kernel#--config-path#{connection_file}#--js found for NotebookDocument: c:\Users\jimcr\dev\hackyourfuture\usingapis-qanda\week1\eventloop.ipynb
info 16:10:18.210: Got empty env vars with python c:\Users\jimcr\.pyenv\pyenv-win\versions\3.10.8\python.exe in 2320ms
info 16:10:18.251: Process Execution: > ~\.pyenv\pyenv-win\versions\3.10.8\python.exe -m pip list
> ~\.pyenv\pyenv-win\versions\3.10.8\python.exe -m pip list
info 16:10:24.284: Starting Jupyter Session startUsingLocalKernelSpec, .jslab.tslab.cmd.\.tslab.cmd#kernel#--config-path#{connection_file}#--js for 'c:\Users\jimcr\dev\hackyourfuture\usingapis-qanda\week1\eventloop.ipynb' (disableUI=true)
info 16:10:24.285: Computing working directory for resource 'c:\Users\jimcr\dev\hackyourfuture\usingapis-qanda\week1\eventloop.ipynb'
info 16:10:25.845: Launching Raw Kernel & not daemon JavaScript # tslab.cmd
info 16:10:25.846: No custom variables nor do we have a conda environment
info 16:10:25.867: Process Execution: > tslab.cmd kernel --config-path ~\AppData\Roaming\jupyter\runtime\kernel-v2-17076lvCMIvGHQYLb.json --js
> tslab.cmd kernel --config-path ~\AppData\Roaming\jupyter\runtime\kernel-v2-17076lvCMIvGHQYLb.json --js
info 16:10:25.867: Process Execution: cwd: ~\dev\hackyourfuture\usingapis-qanda\week1
cwd: ~\dev\hackyourfuture\usingapis-qanda\week1
info 16:10:27.954: Started Kernel JavaScript (pid: 25064)

Coding Language and Runtime Version

JavaScript

Language Extension Version (if applicable)

tslab 1.015

Anaconda Version (if applicable)

No response

Running Jupyter locally or remotely?

Local

DonJayamanne commented 1 year ago

The problem lies with the rendering of the outputs in VS Code core.

Seems to be another issue related to https://github.com/microsoft/vscode-jupyter/issues/11443 I.e. its a problem with the CSS, and seems to be a regression.

See below for the HTML content and the Notebook Outputs

I know this is a regression because we have tests for this and now when we look at the outputs in the tests, we can see that the rendering is weird and not in multiple lines. The tests do not catch the rendering layout issues, but only focus on the Notebook Output Models. @rebornix @amunger /cc

amunger commented 1 year ago

duplicate of https://github.com/microsoft/vscode/issues/160745

microsoft / vscode-jupyter