Hookup trusted flag to both code cell and markdown preview (#3166)

* 1133: Notebook file registration changes

* File registration stuff

* Yarn files

* Outputview Changes

* Misc changes

* Changes to code component name space

* Output view changes

* notebook output view changes

* Latest changes

* Output view changes

* Code review changes on output view

* CSS file and misc changes

* Hookup trusted mode to code cell and markdown

* Return default sanitizer

* Misc changes - code review comments

src/sql/parts/notebook/cellViews/output.component.ts

@@ -22,9 +22,9 @@ export const OUTPUT_SELECTOR: string = 'output-component';
 export class OutputComponent extends AngularDisposable implements OnInit {
 	@ViewChild('output', { read: ElementRef }) private outputElement: ElementRef;
 	@Input() cellOutput: nb.ICellOutput;
+	@Input() trustedMode: boolean;
 	private readonly _minimumHeight = 30;
 	registry: RenderMimeRegistry;
-    trusted: boolean = false;
 
 
 	constructor(
@@ -37,7 +37,7 @@ export class OutputComponent extends AngularDisposable implements OnInit {
 	ngOnInit() {
 		let node = this.outputElement.nativeElement;
 		let output = this.cellOutput;
-        let options = outputProcessor.getBundleOptions({ value: output, trusted: this.trusted });
+		let options = outputProcessor.getBundleOptions({ value: output, trusted: this.trustedMode });
 		// TODO handle safe/unsafe mapping
 		this.createRenderedMimetype(options, node);
 	}

src/sql/parts/notebook/cellViews/outputArea.component.html

@@ -6,7 +6,7 @@
 -->
 <div style="overflow: hidden; width: 100%; height: 100%; display: flex; flex-flow: column">
 	<div class="notebook-output" style="flex: 0 0 auto;">
-		<output-component *ngFor="let output of cellModel.outputs" [cellOutput]="output">
+		<output-component *ngFor="let output of cellModel.outputs" [cellOutput]="output" [trustedMode] = "cellModel.trustedMode" >
 		</output-component>
 	</div>
 </div>

src/sql/parts/notebook/cellViews/textCell.component.ts

@@ -13,6 +13,7 @@ import { IColorTheme, IWorkbenchThemeService } from 'vs/workbench/services/theme
 import * as themeColors from 'vs/workbench/common/theme';
 import { ICommandService } from 'vs/platform/commands/common/commands';
 import { ICellModel } from 'sql/parts/notebook/models/modelInterfaces';
+import { ISanitizer, defaultSanitizer } from 'sql/parts/notebook/outputs/sanitizer';
 
 export const TEXT_SELECTOR: string = 'text-cell-component';
 
@@ -25,6 +26,8 @@ export class TextCellComponent extends CellView implements OnInit {
 	@Input() cellModel: ICellModel;
 	private _content: string;
 	private isEditMode: boolean;
+	private _sanitizer: ISanitizer;
+
 	constructor(
 		@Inject(forwardRef(() => CommonServiceInterface)) private _bootstrapService: CommonServiceInterface,
 		@Inject(forwardRef(() => ChangeDetectorRef)) private _changeRef: ChangeDetectorRef,
@@ -39,9 +42,17 @@ export class TextCellComponent extends CellView implements OnInit {
 		this.updatePreview();
 	}
 
+	//Gets sanitizer from ISanitizer interface
+	private get sanitizer(): ISanitizer {
+		if (this._sanitizer) {
+			return this._sanitizer;
+		}
+		return this._sanitizer = defaultSanitizer;
+	}
+
 	private updatePreview() {
-		if (this._content !== this.cellModel.source) {
+		if (this.cellModel.source && this._content !== this.cellModel.source) {
-			this._content = this.cellModel.source;
+			this._content = this.sanitizeContent(this.cellModel.source);
 			// todo: pass in the notebook filename instead of undefined value
 			this._commandService.executeCommand<string>('notebook.showPreview', undefined, this._content).then((htmlcontent) => {
 				let outputElement = <HTMLElement>this.output.nativeElement;
@@ -50,6 +61,14 @@ export class TextCellComponent extends CellView implements OnInit {
 		}
 	}
 
+	//Sanitizes the content based on trusted mode of Cell Model
+	private sanitizeContent(content: string): string {
+		if (this.cellModel && !this.cellModel.trustedMode) {
+			content = this.sanitizer.sanitize(content);
+		}
+		return content;
+	}
+
 	ngOnInit() {
 		this._register(this.themeService.onDidColorThemeChange(this.updateTheme, this));
 		this.updateTheme(this.themeService.getColorTheme());