From a1029cb2cae973146759ff2d1458292e40a7a1fd Mon Sep 17 00:00:00 2001 From: Giteabot Date: Mon, 25 Sep 2023 06:10:38 +0800 Subject: [PATCH] Fix EOL handling in web editor (#27141) (#27234) Backport #27141 by @silverwind Fixes https://github.com/go-gitea/gitea/issues/27136. This does the following for Monaco's EOL setting: 1. Use editorconfig setting if present 2. Use the file's dominant line ending as detected by monaco, which uses LF for empty file Co-authored-by: silverwind --- routers/web/repo/editor.go | 2 +- templates/repo/editor/edit.tmpl | 7 ++++--- web_src/js/features/codeeditor.js | 19 +++++++++++++++++-- 3 files changed, 22 insertions(+), 6 deletions(-) diff --git a/routers/web/repo/editor.go b/routers/web/repo/editor.go index 0a606582e5..9d9fee3a77 100644 --- a/routers/web/repo/editor.go +++ b/routers/web/repo/editor.go @@ -287,7 +287,7 @@ func editFilePost(ctx *context.Context, form forms.EditRepoFileForm, isNewFile b Operation: operation, FromTreePath: ctx.Repo.TreePath, TreePath: form.TreePath, - ContentReader: strings.NewReader(strings.ReplaceAll(form.Content, "\r", "")), + ContentReader: strings.NewReader(form.Content), }, }, Signoff: form.Signoff, diff --git a/templates/repo/editor/edit.tmpl b/templates/repo/editor/edit.tmpl index 2b303be97c..abe2e345fc 100644 --- a/templates/repo/editor/edit.tmpl +++ b/templates/repo/editor/edit.tmpl @@ -34,12 +34,13 @@ {{end}}
- + data-line-wrap-extensions="{{.LineWrapExtensions}}" + data-initial-value="{{JsonUtils.EncodeToString .FileContent}}">
diff --git a/web_src/js/features/codeeditor.js b/web_src/js/features/codeeditor.js index 7dbbcd3dd6..5f924fd086 100644 --- a/web_src/js/features/codeeditor.js +++ b/web_src/js/features/codeeditor.js @@ -62,7 +62,7 @@ export async function createMonaco(textarea, filename, editorOpts) { const monaco = await import(/* webpackChunkName: "monaco" */'monaco-editor'); initLanguages(monaco); - let {language, ...other} = editorOpts; + let {language, eol, ...other} = editorOpts; if (!language) language = getLanguage(filename); const container = document.createElement('div'); @@ -105,14 +105,28 @@ export async function createMonaco(textarea, filename, editorOpts) { monaco.languages.register({id: 'vs.editor.nullLanguage'}); monaco.languages.setLanguageConfiguration('vs.editor.nullLanguage', {}); + // We encode the initial value in JSON on the backend to prevent browsers from + // discarding the \r during HTML parsing: + // https://html.spec.whatwg.org/multipage/parsing.html#preprocessing-the-input-stream + const value = JSON.parse(textarea.getAttribute('data-initial-value') || '""'); + textarea.value = value; + textarea.removeAttribute('data-initial-value'); + const editor = monaco.editor.create(container, { - value: textarea.value, + value, theme: 'gitea', language, ...other, }); const model = editor.getModel(); + + // Monaco performs auto-detection of dominant EOL in the file, biased towards LF for + // empty files. If there is an editorconfig value, override this detected value. + if (eol in monaco.editor.EndOfLineSequence) { + model.setEOL(monaco.editor.EndOfLineSequence[eol]); + } + model.onDidChangeContent(() => { textarea.value = editor.getValue(); textarea.dispatchEvent(new Event('change')); // seems to be needed for jquery-are-you-sure @@ -187,5 +201,6 @@ function getEditorConfigOptions(ec) { opts.trimAutoWhitespace = ec.trim_trailing_whitespace === true; opts.insertSpaces = ec.indent_style === 'space'; opts.useTabStops = ec.indent_style === 'tab'; + opts.eol = ec.end_of_line?.toUpperCase(); return opts; }