[eric] fix: ablate codemirror to a textarea on windows-electron since editorview mounts the same contenteditable that segfaults the renderer

This commit is contained in:
Eric
2026-05-27 20:13:29 -07:00
parent c3d514bf1c
commit aeaa79d291
+28 -1
View File
@@ -26,6 +26,9 @@ const langExtension = (lang: Language) => {
}
};
// Windows-Electron: CodeMirror's EditorView mounts a contenteditable surface internally; same Chromium 144 TSF crash as EditorSurface. Skip CodeMirror entirely on Windows and render a plain <textarea> (no syntax highlighting, but no segfault).
const IS_WIN_ELECTRON = typeof navigator !== 'undefined' && navigator.userAgent.includes('Windows') && navigator.userAgent.includes('Electron');
const CodeEditor: React.FC<Props> = ({ value, onChange, language, placeholder }) => {
const containerRef = useRef<HTMLDivElement>(null);
const viewRef = useRef<EditorView | null>(null);
@@ -56,7 +59,7 @@ const CodeEditor: React.FC<Props> = ({ value, onChange, language, placeholder })
}, [language, mode, placeholder]);
useEffect(() => {
if (!containerRef.current) return;
if (IS_WIN_ELECTRON || !containerRef.current) return;
const state = EditorState.create({ doc: value, extensions });
const view = new EditorView({ state, parent: containerRef.current });
@@ -70,6 +73,7 @@ const CodeEditor: React.FC<Props> = ({ value, onChange, language, placeholder })
}, [extensions]);
useEffect(() => {
if (IS_WIN_ELECTRON) return;
const view = viewRef.current;
if (!view) return;
const current = view.state.doc.toString();
@@ -80,6 +84,29 @@ const CodeEditor: React.FC<Props> = ({ value, onChange, language, placeholder })
}
}, [value]);
if (IS_WIN_ELECTRON) {
return (
<textarea
value={value}
onChange={(e) => onChange(e.target.value)}
placeholder={placeholder}
spellCheck={false}
style={{
width: '100%',
height: '100%',
background: 'transparent',
border: 'none',
outline: 'none',
resize: 'none',
padding: '8px',
fontFamily: 'ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace',
fontSize: '13px',
color: mode === 'dark' ? '#fff' : '#000',
}}
/>
);
}
return <div ref={containerRef} style={{ height: '100%', width: '100%', overflow: 'hidden' }} />;
};