FEATURE: esbuild (#3200)

* wip

* wip

* TASK: ignore intelliJ project settings file

* WIP: ESbuild with functioning JS, only postcss 'composes' does not work

* WIP: correctly load svg files

* WIP: convert reset.css to normal css

* WIP: Fix Build
- Iframe Host Styles
- HostOnlyStyles
- fortawesome string replace

* WIP: use css standard css variables

* WIP: use standard css variables

* WIP: fix dropdown includes, add some docs

* WIP: STYLES WORK

* TASK: fix reset styles import mixin

* WIP: Replace Webpack with esbuild in Makefile

* WIP: ckeditor load svg as text

* TASK: remove unwanted duplication

* WIP: exlude regex for stylePlugin::cssModulesMatch

* TASK: correctly import .vanilla-css and codemirror highlight js

* BUGFIX: fix CKEditor table handle

* TASK: revert build-essentials

* TASK: remove old build setup stuff

* TASK: activate minify in production

* TASK: fix code style to make linter happy

* TASK: Cleanup NodeCreationDialog getDerivedStateFromProps

* Task: Esbuild improve excluding of CKEditor styles

* Wip: Define global as alias for window to make react-dnd work again

#3200 (comment)

we somehow have a dependency which uses global and because we where lazy we just defined in esbuild to insert for `global` an empty object `{}` like: we dont care.

i forgot about that line in the build script and dindt gave it much mlre attention - and considered it harmless

after playing debugging randomly and lately playing divide and conquer i found out that react-dnd uses either `global` (if defined) or `window` to store things - that broke it (as global was now everytime replaced with an empy object -> see esbuild 'define') :verschwitztes_lachen:

the hotfix is `global = window`

but ill try to narrow down the problem to fix it more accurately

* Wip: Fix helpmessages by upgrading `react-markdown` from 5 to 8

#3200 (comment)

* Wip: Better way to fix `react-codemirror2` global ussage

I find using `'global': 'window'` gives us not enough control about when it was accidentally used

#3200 (comment)

* Wip: `ClientEval:` use `new Function` instead of unsave `eval`

Removes the warning
Using direct eval with a bundler is not recommended and may cause problems

see https://esbuild.github.io/link/direct-eval

* WIP: Fix redux: yield [...effects] has been deprecated in favor of all([...effects])

* WIp: Fix EmailAddressValidator polyfill Buffer and remove utils

* Wip: Build the ui without make build-subpackages

it does produces a better bundle to use the source files

later we need to rethink the distribution of npm splits

* WIP: REVERT: use standard css variables

rollback css var rename (and not using postcss var replace) only for now so this pr becomes easier to review

reverts
- f586f46
- 7ca28b6

undos sugestion #3201

* TASK: Fix merge conflict

* TASK: Fix dependency clashes

* BUGFIX: Use @neos-project/eslint-config-neos in version 2.5

Resolve merge error

* TASK: Upgrade eslint and babel

Use babel 7 and eslint 8

* BUGFIX: Resolve linting issues

* BUGFIX: DiscardAll not found in e2e tests

* BUGFIX: Make TreeNode selector for e2e work again

* BUGFIX: Remove compiled assets from git again

* TASK: Ignore compiled assets again

* TASK: Remove babel config warning in PHPStorm

* TASK: Upgrade testcafe

* BUGFIX: Resolve more React selector issues

* BUGFIX: Try to fix more e2e tests

* WIP: Fix jest - Make it work with ESM and esbuild instead of babel

* TASK: Esbuild `keepNames: true` for react magic selector in e2e

We found out that this fixes the problem for unit snapshot testing, and most likely will fix also e2e

Watch out the option will increase the bundle size around 100 bytes.
3.9 -> 4.0

Once we have less time we might start a quick separate e2e build ;)

* Revert changes to ReactSelectors

These were now unnecessary as the problems were fixed via the esbuild config

* WIP: Fix jest: custom esbuild transform

- jest fix circular dependency
- fix jest module field package.json (requires at least jest 24)
- remove test script from neos-ui-constants (no tests)
- jest transform all files (except 2 js libs)
- fix snapshot tests by using keepNames true

* Task: update jest to v27

* Task: make linter happier

* Task: make sure esbuild transpiles tests also in strict mode

fixes:
```
FAIL src/index.spec.js
  ● should not be writable.

    expect(received).toThrow()

    Received function did not throw

      at Object.<anonymous> (src/<stdin>:82:16)
```

and

```
FAIL src/createConsumerApi.spec.js (7.141 s)
  ● "createConsumerApi" should create a global, read-only object

    expect(received).toThrow()

    Received function did not throw

      at Object.<anonymous> (src/<stdin>:12:25)

  ● "createConsumerApi" should expose the passed api, with each key being read-only

    expect(received).toThrow()

    Received function did not throw

      at Object.<anonymous> (src/<stdin>:33:26)
```

* Task: Esbuild special e2e testing build

build is slightly bigger but works with the react magic selector

* Task: Unit test runner cleanup

* TAKS: Revert moving jest config into jest preset

This reverts commit 9462771.
and
This reverts commit ae99b80.

* Task: remove unused babel.rc and jsconfig.json

* Task: adjust Make

* Revert "Task: remove unused babel.rc and jsconfig.json"

This reverts commit 1ebce46.

* TASK: remove ignore pattern from eslint config

* TASK: Remove direct tslib dependency

* TASK: Resolve eslint warnings in eslintrc

* FEATURE: Include notosans from npm

Reduces font size by 50%

* TASK: Remove old files

* TASK: Lint esbuild.js

* TASK: Run typechecks during lint

* TASK: Lint issue in font styles

* Task: esbuild fix cssModulesMatch regex

* Feature: esbuild watch mode `make build-watch`

* Task: Use patch for lib "react-codemirror2" instead of esbuild hack

* Task: Move compiled assets to `Build` folder and fix jenkins

legal comments are now also separate

Co-authored-by: Robert Baruck <[email protected]>
Co-authored-by: mhsdesign <[email protected]>
Co-authored-by: Markus Günther <[email protected]>
Co-authored-by: Sebastian Helzle <[email protected]>

.circleci/config.yml

@@ -55,7 +55,7 @@ jobs:
       - run: chmod +x ~/.nvm/nvm.sh
       - run: ~/.nvm/nvm.sh install && ~/.nvm/nvm.sh use
       - run: sudo apt-get update --allow-releaseinfo-change && sudo apt-get install -y rsync
-      - run: make install && make build-production
+      - run: make install && make build-e2e-testing
 
       - save_cache: *store_yarn_package_cache
       - persist_to_workspace: *persist_to_workspace

.eslintrc.js

@@ -2,37 +2,40 @@ module.exports = {
     root: true,
     extends: [
         '@neos-project/eslint-config-neos',
-        'plugin:@typescript-eslint/eslint-recommended',
+        'plugin:@typescript-eslint/eslint-recommended'
     ],
     globals: {
         expect: true,
         sinon: false
     },
     env: {
-        node: true,
+        node: true
     },
     plugins: [
-        "@typescript-eslint",
+        '@typescript-eslint'
     ],
+    parserOptions: {
+        requireConfigFile: false
+    },
     rules: {
         // Fix for incorrect unused var detection
-        "no-unused-vars": "off",
-        "@typescript-eslint/no-unused-vars": ["error"],
+        'no-unused-vars': 'off',
+        '@typescript-eslint/no-unused-vars': ['error'],
 
         // The following rules should be fixed and enabled again
-        "no-use-before-define": "off",
-        "default-case": "off",
-        "no-mixed-operators": "off",
-        "no-negated-condition": "off",
-        "complexity": "off",
+        'no-use-before-define': 'off',
+        'default-case': 'off',
+        'no-mixed-operators': 'off',
+        'no-negated-condition': 'off',
+        'complexity': 'off'
     },
     overrides: [
         {
             files: [
-                "**/*.ts",
-                "**/*.tsx",
+                '**/*.ts',
+                '**/*.tsx'
             ],
-            parser: "@typescript-eslint/parser"
+            parser: '@typescript-eslint/parser'
         }
     ]
 }

.gitignore

@@ -27,18 +27,15 @@ packages/*/yarn.lock
 #
 # Compiled assets.
 #
-Resources/Public/JavaScript/**/*.js
-Resources/Public/JavaScript/**/*.map
-Resources/Public/Styles/**/*.css
-!Resources/Public/Styles/ReactCrop.css
-Resources/Public/Styles/**/*.map
-Resources/Public/Styles/Font*
+Resources/Public/Build/*
+!Resources/Public/Build/.gitkeep
 
 #
 # editors / IDEs
 #
 .vscode/
 .idea/
+*.iml
 
 #
 # Package Manager
@@ -50,3 +47,4 @@ Resources/Public/Styles/Font*
 !.yarn/releases
 !.yarn/sdks
 !.yarn/versions
+/packages/tsconfig.tsbuildinfo

.nvmrc

@@ -1 +1 @@
-16
+16.16