ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-01-18 01:25:37 -05:00
Code Issues Packages Projects Releases Wiki Activity

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

Browse Source 
* 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
This commit is contained in:
Raj
2018-11-08 14:12:59 -08:00
committed by GitHub
parent 9765269d27
commit bbf6cbd8fb
3 changed files with 57 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
src/sql/parts/notebook/cellViews/output.component.ts
View File

@@ -17,61 +17,61 @@ export const OUTPUT_SELECTOR: string = 'output-component';
@Component({
selector: OUTPUT_SELECTOR,
templateUrl: decodeURI(require.toUrl('./output.component.html'))
templateUrl: decodeURI(require.toUrl('./output.component.html'))
})
export class OutputComponent extends AngularDisposable implements OnInit {
@ViewChild('output', { read: ElementRef }) private outputElement: ElementRef;
@Input() cellOutput: nb.ICellOutput;
@Input() cellOutput: nb.ICellOutput;
@Input() trustedMode: boolean;
private readonly _minimumHeight = 30;
registry: RenderMimeRegistry;
trusted: boolean = false;
constructor(
@Inject(INotebookService) private _notebookService: INotebookService
) {
super();
this.registry = _notebookService.getMimeRegistry();
this.registry = _notebookService.getMimeRegistry();
}
ngOnInit() {
let node = this.outputElement.nativeElement;
let output = this.cellOutput;
let options = outputProcessor.getBundleOptions({ value: output, trusted: this.trusted });
// TODO handle safe/unsafe mapping
this.createRenderedMimetype(options, node);
}
let output = this.cellOutput;
let options = outputProcessor.getBundleOptions({ value: output, trusted: this.trustedMode });
// TODO handle safe/unsafe mapping
this.createRenderedMimetype(options, node);
}
public layout(): void {
}
protected createRenderedMimetype(options: MimeModel.IOptions, node: HTMLElement): void {
let mimeType = this.registry.preferredMimeType(
options.data,
options.trusted ? 'any' : 'ensure'
);
if (mimeType) {
let mimeType = this.registry.preferredMimeType(
options.data,
options.trusted ? 'any' : 'ensure'
);
if (mimeType) {
let output = this.registry.createRenderer(mimeType);
output.node = node;
let model = new MimeModel(options);
output.renderModel(model).catch(error => {
// Manually append error message to output
output.node.innerHTML = `<pre>Javascript Error: ${error.message}</pre>`;
// Remove mime-type-specific CSS classes
output.node.className = 'p-Widget jp-RenderedText';
output.node.setAttribute(
'data-mime-type',
'application/vnd.jupyter.stderr'
);
});
output.node = node;
let model = new MimeModel(options);
output.renderModel(model).catch(error => {
// Manually append error message to output
output.node.innerHTML = `<pre>Javascript Error: ${error.message}</pre>`;
// Remove mime-type-specific CSS classes
output.node.className = 'p-Widget jp-RenderedText';
output.node.setAttribute(
'data-mime-type',
'application/vnd.jupyter.stderr'
);
});
//this.setState({ node: node });
} else {
// TODO Localize
node.innerHTML =
`No ${options.trusted ? '' : '(safe) '}renderer could be ` +
'found for output. It has the following MIME types: ' +
Object.keys(options.data).join(', ');
//this.setState({ node: node });
}
}
} else {
// TODO Localize
node.innerHTML =
`No ${options.trusted ? '' : '(safe) '}renderer could be ` +
'found for output. It has the following MIME types: ' +
Object.keys(options.data).join(', ');
//this.setState({ node: node });
}
}
}

2
src/sql/parts/notebook/cellViews/outputArea.component.html
View File

@@ -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>

23
src/sql/parts/notebook/cellViews/textCell.component.ts
View File

@@ -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) {
this._content = this.cellModel.source;
if (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());