Fix #170263, do not parse html for stream output. (#170264)

This commit is contained in:
Peng Lyu 2022-12-29 23:05:30 -08:00 committed by GitHub
parent 92df25dd8c
commit 90277d5c56
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 23 additions and 19 deletions

View file

@ -8,7 +8,7 @@ import { ansiColorIdentifiers } from './colorMap';
import { linkify } from './linkify';
export function handleANSIOutput(text: string): HTMLSpanElement {
export function handleANSIOutput(text: string, trustHtml: boolean): HTMLSpanElement {
const workspaceFolder = undefined;
const root: HTMLSpanElement = document.createElement('span');
@ -52,7 +52,7 @@ export function handleANSIOutput(text: string): HTMLSpanElement {
if (sequenceFound) {
// Flush buffer with previous styles.
appendStylizedStringToContainer(root, buffer, styleNames, workspaceFolder, customFgColor, customBgColor, customUnderlineColor);
appendStylizedStringToContainer(root, buffer, trustHtml, styleNames, workspaceFolder, customFgColor, customBgColor, customUnderlineColor);
buffer = '';
@ -98,7 +98,7 @@ export function handleANSIOutput(text: string): HTMLSpanElement {
// Flush remaining text buffer if not empty.
if (buffer) {
appendStylizedStringToContainer(root, buffer, styleNames, workspaceFolder, customFgColor, customBgColor, customUnderlineColor);
appendStylizedStringToContainer(root, buffer, trustHtml, styleNames, workspaceFolder, customFgColor, customBgColor, customUnderlineColor);
}
return root;
@ -384,9 +384,10 @@ const ttPolicy = window.trustedTypes?.createPolicy('notebookRenderer', {
createScript: value => value,
});
export function appendStylizedStringToContainer(
function appendStylizedStringToContainer(
root: HTMLElement,
stringContent: string,
trustHtml: boolean,
cssClasses: string[],
workspaceFolder: string | undefined,
customTextColor?: RGBA | string,
@ -398,8 +399,11 @@ export function appendStylizedStringToContainer(
}
let container = document.createElement('span');
const trustedHtml = ttPolicy?.createHTML(stringContent) ?? stringContent;
container.innerHTML = trustedHtml as string;
if (trustHtml) {
const trustedHtml = ttPolicy?.createHTML(stringContent) ?? stringContent;
container.innerHTML = trustedHtml as string;
}
if (container.childElementCount === 0) {
// plain text

View file

@ -143,7 +143,7 @@ function renderError(outputInfo: OutputItem, container: HTMLElement, ctx: Render
stack.classList.add('traceback');
stack.style.margin = '8px 0';
const element = document.createElement('span');
insertOutput(outputInfo.id, [err.stack ?? ''], ctx.settings.lineLimit, false, element);
insertOutput(outputInfo.id, [err.stack ?? ''], ctx.settings.lineLimit, false, element, true);
stack.appendChild(element);
container.appendChild(stack);
} else {
@ -183,7 +183,7 @@ function renderStream(outputInfo: OutputItem, container: HTMLElement, error: boo
const element = existing ?? document.createElement('span');
element.classList.add('output-stream');
element.setAttribute('output-item-id', outputInfo.id);
insertOutput(outputInfo.id, [text], ctx.settings.lineLimit, ctx.settings.outputScrolling, element);
insertOutput(outputInfo.id, [text], ctx.settings.lineLimit, ctx.settings.outputScrolling, element, false);
outputElement.appendChild(element);
return;
}
@ -194,7 +194,7 @@ function renderStream(outputInfo: OutputItem, container: HTMLElement, error: boo
element.setAttribute('output-item-id', outputInfo.id);
const text = outputInfo.text();
insertOutput(outputInfo.id, [text], ctx.settings.lineLimit, ctx.settings.outputScrolling, element);
insertOutput(outputInfo.id, [text], ctx.settings.lineLimit, ctx.settings.outputScrolling, element, false);
while (container.firstChild) {
container.removeChild(container.firstChild);
}
@ -210,7 +210,7 @@ function renderText(outputInfo: OutputItem, container: HTMLElement, ctx: Rendere
const contentNode = document.createElement('div');
contentNode.classList.add('output-plaintext');
const text = outputInfo.text();
insertOutput(outputInfo.id, [text], ctx.settings.lineLimit, ctx.settings.outputScrolling, contentNode);
insertOutput(outputInfo.id, [text], ctx.settings.lineLimit, ctx.settings.outputScrolling, contentNode, false);
container.appendChild(contentNode);
}

View file

@ -31,13 +31,13 @@ function generateViewMoreElement(outputId: string, adjustableSize: boolean) {
return container;
}
function truncatedArrayOfString(id: string, buffer: string[], linesLimit: number, container: HTMLElement) {
function truncatedArrayOfString(id: string, buffer: string[], linesLimit: number, container: HTMLElement, trustHtml: boolean) {
const lineCount = buffer.length;
container.appendChild(generateViewMoreElement(id, true));
const div = document.createElement('div');
container.appendChild(div);
div.appendChild(handleANSIOutput(buffer.slice(0, linesLimit - 5).join('\n')));
div.appendChild(handleANSIOutput(buffer.slice(0, linesLimit - 5).join('\n'), trustHtml));
// view more ...
const viewMoreSpan = document.createElement('span');
@ -46,10 +46,10 @@ function truncatedArrayOfString(id: string, buffer: string[], linesLimit: number
const div2 = document.createElement('div');
container.appendChild(div2);
div2.appendChild(handleANSIOutput(buffer.slice(lineCount - 5).join('\n')));
div2.appendChild(handleANSIOutput(buffer.slice(lineCount - 5).join('\n'), trustHtml));
}
function scrollableArrayOfString(id: string, buffer: string[], container: HTMLElement) {
function scrollableArrayOfString(id: string, buffer: string[], container: HTMLElement, trustHtml: boolean) {
container.classList.add('scrollable');
if (buffer.length > 5000) {
@ -57,22 +57,22 @@ function scrollableArrayOfString(id: string, buffer: string[], container: HTMLEl
}
const div = document.createElement('div');
container.appendChild(div);
div.appendChild(handleANSIOutput(buffer.slice(0, 5000).join('\n')));
div.appendChild(handleANSIOutput(buffer.slice(0, 5000).join('\n'), trustHtml));
}
export function insertOutput(id: string, outputs: string[], linesLimit: number, scrollable: boolean, container: HTMLElement) {
export function insertOutput(id: string, outputs: string[], linesLimit: number, scrollable: boolean, container: HTMLElement, trustHtml: boolean) {
const buffer = outputs.join('\n').split(/\r\n|\r|\n/g);
const lineCount = buffer.length;
if (lineCount < linesLimit) {
const spanElement = handleANSIOutput(buffer.join('\n'));
const spanElement = handleANSIOutput(buffer.join('\n'), trustHtml);
container.appendChild(spanElement);
return;
}
if (scrollable) {
scrollableArrayOfString(id, buffer, container);
scrollableArrayOfString(id, buffer, container, trustHtml);
} else {
truncatedArrayOfString(id, buffer, linesLimit, container);
truncatedArrayOfString(id, buffer, linesLimit, container, trustHtml);
}
}