[Code] test colorize before actually loading file, trying to catch a exception throws when loading incomplete ruby code (#41093)
This commit is contained in:
parent
445e5bf3d5
commit
5d7e2c2544
1 changed files with 40 additions and 28 deletions
|
@ -28,33 +28,10 @@ export class CodeBlock extends React.PureComponent<Props> {
|
||||||
private resizeChecker?: ResizeChecker;
|
private resizeChecker?: ResizeChecker;
|
||||||
private currentHighlightDecorations: string[] = [];
|
private currentHighlightDecorations: string[] = [];
|
||||||
|
|
||||||
public componentDidMount(): void {
|
public async componentDidMount() {
|
||||||
if (this.el) {
|
if (this.el) {
|
||||||
this.ed = monaco.editor.create(this.el!, {
|
await this.tryLoadFile(this.props.code, this.props.language || 'text');
|
||||||
value: this.props.code,
|
this.ed!.onMouseDown((e: editor.IEditorMouseEvent) => {
|
||||||
language: this.props.language,
|
|
||||||
lineNumbers: this.lineNumbersFunc.bind(this),
|
|
||||||
readOnly: true,
|
|
||||||
folding: this.props.folding,
|
|
||||||
minimap: {
|
|
||||||
enabled: false,
|
|
||||||
},
|
|
||||||
scrollbar: {
|
|
||||||
vertical: 'hidden',
|
|
||||||
handleMouseWheel: false,
|
|
||||||
verticalScrollbarSize: 0,
|
|
||||||
},
|
|
||||||
hover: {
|
|
||||||
enabled: false, // disable default hover;
|
|
||||||
},
|
|
||||||
contextmenu: false,
|
|
||||||
selectOnLineNumbers: false,
|
|
||||||
selectionHighlight: false,
|
|
||||||
renderLineHighlight: 'none',
|
|
||||||
renderIndentGuides: false,
|
|
||||||
automaticLayout: false,
|
|
||||||
});
|
|
||||||
this.ed.onMouseDown((e: editor.IEditorMouseEvent) => {
|
|
||||||
if (
|
if (
|
||||||
this.props.onClick &&
|
this.props.onClick &&
|
||||||
(e.target.type === monaco.editor.MouseTargetType.GUTTER_LINE_NUMBERS ||
|
(e.target.type === monaco.editor.MouseTargetType.GUTTER_LINE_NUMBERS ||
|
||||||
|
@ -68,7 +45,7 @@ export class CodeBlock extends React.PureComponent<Props> {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
registerEditor(this.ed);
|
registerEditor(this.ed!);
|
||||||
if (this.props.highlightRanges) {
|
if (this.props.highlightRanges) {
|
||||||
const decorations = this.props.highlightRanges.map((range: IRange) => {
|
const decorations = this.props.highlightRanges.map((range: IRange) => {
|
||||||
return {
|
return {
|
||||||
|
@ -78,7 +55,7 @@ export class CodeBlock extends React.PureComponent<Props> {
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
this.currentHighlightDecorations = this.ed.deltaDecorations([], decorations);
|
this.currentHighlightDecorations = this.ed!.deltaDecorations([], decorations);
|
||||||
}
|
}
|
||||||
this.resizeChecker = new ResizeChecker(this.el!);
|
this.resizeChecker = new ResizeChecker(this.el!);
|
||||||
this.resizeChecker.on('resize', () => {
|
this.resizeChecker.on('resize', () => {
|
||||||
|
@ -88,6 +65,41 @@ export class CodeBlock extends React.PureComponent<Props> {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
private async tryLoadFile(code: string, language: string) {
|
||||||
|
try {
|
||||||
|
await monaco.editor.colorize(code, language, {});
|
||||||
|
this.loadFile(code, language);
|
||||||
|
} catch (e) {
|
||||||
|
this.loadFile(code);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private loadFile(code: string, language: string = 'text') {
|
||||||
|
this.ed = monaco.editor.create(this.el!, {
|
||||||
|
value: code,
|
||||||
|
language,
|
||||||
|
lineNumbers: this.lineNumbersFunc.bind(this),
|
||||||
|
readOnly: true,
|
||||||
|
folding: this.props.folding,
|
||||||
|
minimap: {
|
||||||
|
enabled: false,
|
||||||
|
},
|
||||||
|
scrollbar: {
|
||||||
|
vertical: 'hidden',
|
||||||
|
handleMouseWheel: false,
|
||||||
|
verticalScrollbarSize: 0,
|
||||||
|
},
|
||||||
|
hover: {
|
||||||
|
enabled: false, // disable default hover;
|
||||||
|
},
|
||||||
|
contextmenu: false,
|
||||||
|
selectOnLineNumbers: false,
|
||||||
|
selectionHighlight: false,
|
||||||
|
renderLineHighlight: 'none',
|
||||||
|
renderIndentGuides: false,
|
||||||
|
automaticLayout: false,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
public componentDidUpdate(prevProps: Readonly<Props>) {
|
public componentDidUpdate(prevProps: Readonly<Props>) {
|
||||||
if (
|
if (
|
||||||
|
|
Loading…
Reference in a new issue