diff --git a/src/vs/base/browser/htmlContentRenderer.ts b/src/vs/base/browser/htmlContentRenderer.ts index 2b6cc38e2b0..c4991d77015 100644 --- a/src/vs/base/browser/htmlContentRenderer.ts +++ b/src/vs/base/browser/htmlContentRenderer.ts @@ -33,7 +33,7 @@ export function renderMarkedString(markedString: MarkedString, options: RenderOp */ export function renderHtml(content: RenderableContent, options: RenderOptions = {}): Node { if (typeof content === 'string') { - return _renderHtml({ isText: true, text: content }, options); + return document.createTextNode(content); } else if (Array.isArray(content)) { return _renderHtml({ children: content }, options); } else if (content) { @@ -46,11 +46,7 @@ function _renderHtml(content: IHTMLContentElement, options: RenderOptions = {}): let { codeBlockRenderer, actionCallback } = options; - if (content.isText) { - return document.createTextNode(content.text); - } - - var tagName = getSafeTagName(content.tagName) || 'div'; + var tagName = content.inline ? 'span' : 'div'; var element = document.createElement(tagName); if (content.className) { @@ -59,14 +55,6 @@ function _renderHtml(content: IHTMLContentElement, options: RenderOptions = {}): if (content.text) { element.textContent = content.text; } - if (content.style) { - element.setAttribute('style', content.style); - } - if (content.customStyle) { - Object.keys(content.customStyle).forEach((key) => { - element.style[key] = content.customStyle[key]; - }); - } if (content.children) { content.children.forEach((child) => { element.appendChild(renderHtml(child, options)); @@ -191,45 +179,6 @@ function _renderHtml(content: IHTMLContentElement, options: RenderOptions = {}): return element; } -var SAFE_TAG_NAMES = { - a: true, - b: true, - blockquote: true, - code: true, - del: true, - dd: true, - div: true, - dl: true, - dt: true, - em: true, - h1h2h3i: true, - img: true, - kbd: true, - li: true, - ol: true, - p: true, - pre: true, - s: true, - span: true, - sup: true, - sub: true, - strong: true, - strike: true, - ul: true, - br: true, - hr: true, -}; - -function getSafeTagName(tagName: string): string { - if (!tagName) { - return null; - } - if (SAFE_TAG_NAMES.hasOwnProperty(tagName)) { - return tagName; - } - return null; -} - // --- formatted string parsing class StringStream { diff --git a/src/vs/base/browser/ui/inputbox/inputBox.ts b/src/vs/base/browser/ui/inputbox/inputBox.ts index 87f6428e526..69ebed4e845 100644 --- a/src/vs/base/browser/ui/inputbox/inputBox.ts +++ b/src/vs/base/browser/ui/inputbox/inputBox.ts @@ -382,7 +382,7 @@ export class InputBox extends Widget { layout(); let renderOptions: IHTMLContentElement = { - tagName: 'span', + inline: true, className: 'monaco-inputbox-message', }; diff --git a/src/vs/base/common/htmlContent.ts b/src/vs/base/common/htmlContent.ts index 8dcc73fc332..da68a1f7719 100644 --- a/src/vs/base/common/htmlContent.ts +++ b/src/vs/base/common/htmlContent.ts @@ -85,12 +85,8 @@ export interface IHTMLContentElement { formattedText?: string; text?: string; className?: string; - style?: string; - customStyle?: any; - tagName?: string; + inline?: boolean; children?: IHTMLContentElement[]; - isText?: boolean; - role?: string; markdown?: string; code?: IHTMLContentElementCode; } @@ -113,11 +109,7 @@ function htmlContentElementEqual(a: IHTMLContentElement, b: IHTMLContentElement) a.formattedText === b.formattedText && a.text === b.text && a.className === b.className - && a.style === b.style - && a.customStyle === b.customStyle - && a.tagName === b.tagName - && a.isText === b.isText - && a.role === b.role + && a.inline === b.inline && a.markdown === b.markdown && htmlContentElementCodeEqual(a.code, b.code) && htmlContentElementArrEquals(a.children, b.children) diff --git a/src/vs/base/test/browser/htmlContent.test.ts b/src/vs/base/test/browser/htmlContent.test.ts index eaa12a6ba26..59caefa1d2e 100644 --- a/src/vs/base/test/browser/htmlContent.test.ts +++ b/src/vs/base/test/browser/htmlContent.test.ts @@ -10,25 +10,10 @@ import { renderHtml } from 'vs/base/browser/htmlContentRenderer'; suite('HtmlContent', () => { test('render text', () => { - var result = renderHtml({ - text: 'testing', - isText: true - }); + var result = renderHtml('testing'); assert.strictEqual(result.nodeType, document.TEXT_NODE); }); - test('cannot render script tag', function () { - var host = document.createElement('div'); - document.body.appendChild(host); - host.appendChild(renderHtml({ - tagName: 'script', - text: 'alert(\'owned -- injected script tag via htmlContent!\')' - })); - assert(true); - document.body.removeChild(host); - }); - - test('render simple element', () => { var result: HTMLElement = renderHtml({ text: 'testing' @@ -47,24 +32,6 @@ suite('HtmlContent', () => { assert.strictEqual(result.className, 'testClass'); }); - test('render element with style', () => { - var result: HTMLElement = renderHtml({ - text: 'testing', - style: 'width: 100px;' - }); - assert.strictEqual(result.getAttribute('style'), 'width: 100px;'); - }); - - test('render element with custom style', () => { - var result: HTMLElement = renderHtml({ - text: 'testing', - customStyle: { - 'width': '100px' - } - }); - assert.strictEqual(result.style.width, '100px'); - }); - test('render element with children', () => { var result: HTMLElement = renderHtml({ className: 'parent', diff --git a/src/vs/workbench/services/keybinding/test/keyboardMapperTestUtils.ts b/src/vs/workbench/services/keybinding/test/keyboardMapperTestUtils.ts index d79895b63f0..25b6f08b17d 100644 --- a/src/vs/workbench/services/keybinding/test/keyboardMapperTestUtils.ts +++ b/src/vs/workbench/services/keybinding/test/keyboardMapperTestUtils.ts @@ -56,16 +56,16 @@ function _htmlPieces(pieces: string[], OS: OperatingSystem): IHTMLContentElement let children: IHTMLContentElement[] = []; for (let i = 0, len = pieces.length; i < len; i++) { if (i !== 0 && OS !== OperatingSystem.Macintosh) { - children.push({ tagName: 'span', text: '+' }); + children.push({ inline: true, text: '+' }); } - children.push({ tagName: 'span', className: 'monaco-kbkey', text: pieces[i] }); + children.push({ inline: true, className: 'monaco-kbkey', text: pieces[i] }); } return children; } export function simpleHTMLLabel(pieces: string[], OS: OperatingSystem): IHTMLContentElement { return { - tagName: 'span', + inline: true, className: 'monaco-kb', children: _htmlPieces(pieces, OS) }; @@ -73,7 +73,7 @@ export function simpleHTMLLabel(pieces: string[], OS: OperatingSystem): IHTMLCon export function chordHTMLLabel(firstPart: string[], chordPart: string[], OS: OperatingSystem): IHTMLContentElement { return { - tagName: 'span', + inline: true, className: 'monaco-kb', children: [].concat( _htmlPieces(firstPart, OS), diff --git a/src/vs/workbench/services/message/browser/messageList.ts b/src/vs/workbench/services/message/browser/messageList.ts index 55e51942ce2..6379dbe8d2b 100644 --- a/src/vs/workbench/services/message/browser/messageList.ts +++ b/src/vs/workbench/services/message/browser/messageList.ts @@ -335,7 +335,7 @@ export class MessageList { // Error message const messageContentElement = htmlRenderer.renderHtml({ - tagName: 'span', + inline: true, className: 'message-left-side', formattedText: text });