- Replace the [Monaco Editor](https://microsoft.github.io/monaco-editor/)
with [CodeMirror 6](https://codemirror.net/). This editor is used to
facilitate the 'Add file' and 'Edit file' functionality.
- Rationale:
- Monaco editor is a great and powerful editor, however for Forgejo's
purpose it acts more like a small IDE than a code editor and is doing
too much. In my limited user research the usage of editing files via
the web UI is largely for small changes that does not need the
features that Monaco editor provides.
- Monaco editor has no mobile support, Codemirror is very usable on mobile.
- Monaco editor pulls in large dependencies (for language support) and
by replacing it with Codemirror the amount of time that webpack needs
to build the frontend is reduced by 50% (~30s -> ~15s).
- The binary of Forgejo (build with `bindata` tag) is reduced by 2MiB.
- Codemirror is much more lightweight and should be more usable on
less powerful hardware, most notably the lazy loading is much faster
as codemirror uses less javascript.
- Because Codemirror is modular it is much easier to change the
behavior of the code editor if we wish to.
- Drawbacks:
- Codemirror is quite modular and as seen in `package.json` and in
`codeeditor.ts` we have to supply a lot more of its features to have
feature parity with Monaco editor.
- Monaco editor has great integrated language support (features that
an lsp would provide), Codemirror only has such language support to an
extend.
- Monaco editor has its famous command palette (known by many as its
also available in VSCode), this is not available in code mirror.
- Good to note:
- All features that was added on top of the monaco editor (such as
dynamically changing language support depending on the filename)
still works and the theme is based on the VSCode colors which largely
resembles the monaco editor.
- The code editor is still lazy-loaded (this is painfully clear by
reading how imports are passed around in `codeeditor.ts`).
- This change was privately tested by a few people, a few bugs were
found (and fixed) but no major drawbacks were noted for their usage of
the web editor.
- There's a "search" button in the top bar, so that search can be used
on mobile. It is otherwise only accessible via
<kbd>Ctrl</kbd>+<kbd>f</kbd>.
Co-authored-by: Beowulf <beowulf@beocode.eu>
Co-authored-by: Gusted <postmaster@gusted.xyz>
Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/10559
Reviewed-by: Gusted <gusted@noreply.codeberg.org>
Reviewed-by: 0ko <0ko@noreply.codeberg.org>
Co-committed-by: Beowulf <beowulf@beocode.eu>
Before
```
$ make lint-frontend
npx eslint --color --max-warnings=0
[@stylistic/eslint-plugin]: You are using deprecated value(boolean) for "allowTemplateLiterals" in "quotes", please use "always"/"never" instead.
```
After
```
$ make lint-frontend
npx eslint --color --max-warnings=0
```
Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/8953
Reviewed-by: Gusted <gusted@noreply.codeberg.org>
Co-authored-by: dawe <dawe@noreply.codeberg.org>
Co-committed-by: dawe <dawe@noreply.codeberg.org>
- The JS variant is deprecated, move to the unified package.
`[@stylistic/eslint-plugin-js] This package is deprecated in favor of
the unified @stylistic/eslint-plugin, please consider migrating to the
main package` is logged when running `make lint-frontend`.
Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/8216
Reviewed-by: floss4good <floss4good@noreply.codeberg.org>
Reviewed-by: Otto <otto@codeberg.org>
Co-authored-by: Gusted <postmaster@gusted.xyz>
Co-committed-by: Gusted <postmaster@gusted.xyz>
- adds the `toml` plugin to the `eslint` linting → expect to have `options/setting/config.toml` by #6862
- fixes `make lint-codespell` commands
- related concerning `codespell`: #3270
- info: codespell check is and was not activated in the workflows (could maybe, runs only few seconds on my system)
Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/7007
Reviewed-by: Earl Warren <earl-warren@noreply.codeberg.org>
Co-authored-by: Robert Wolff <mahlzahn@posteo.de>
Co-committed-by: Robert Wolff <mahlzahn@posteo.de>
Goals:
- speedup
- less flakiness
- best practices and more use
- documentation
config:
- sync ports in Makefile and playwright config
(otherwise, some tests fail locally because they assert the full URL including the (wrong) port)
- even more generous timeouts
- limit workers to one again (because I finally understand how
Playwright works)
- allow nested functions to group them together with the related test
all:
- deprecate waitForLoadState('networkidle')
- it is discouraged as per https://playwright.dev/docs/api/class-page#page-wait-for-load-state
- I could not find a usage that seems to require it actually (see
added documentation in README)
- adding an exception should be made explicitly
- it does not do what you might expect anyway in most cases
- only log in when necessary
webauthn:
- verify that login is possible after disabling key
- otherwise, the cleanup was not necessary after the previous refactor to create a fresh user each
issue-sidebar / WIP toggle:
- split into smaller chunks
- restore original state first
- add missed assertion to fix race condition (not waiting
before state was reached)
- explicitly toggle the state to detect mismatch earlier
issue-sidebar / labels:
- restore original state first
- better waiting for background request
Make the big move to Eslint flat config format. The outcome of Eslint
still should be the same, but some things has changed:
- `eslint-plugin-github` is dropped, flat configs have been out for a
while and most eslint plugins support it, but for no reason and no
activity in sight this plugin is likely not going to support flat config
for a while and to avoid other plugins not being able to update (as they
are requiring flat configs) drop the github rules.
- Nested configs don't work properly and are unified into the root
eslint config, this unification did cause some conflicts and thats why
the `import-x` is in a seperate 'group' to exclude targeting Vue files.
- The `eslint-plugin-i` is deprecated and `esplint-plugin-import-x` is
its succesor which has better support for flat configs, the same rules
are still applied.
The majority of the flat config was generated by
`@eslint/migrate-config` tool.
