development environment upgrades (#6059)

* init work to upgrade node and linting

* feat: add jest-environment-jsdom

* test: refactor remove unused before

* fix: add option chain for frame

* test: use correct jest spy

* skip jsdom broken tests

* config: *

* config: ignore dist in linting

* format: apply transformations

* remove repeated config

Author: danstarns

.editorconfig

@@ -0,0 +1,56 @@
+module.exports = {
+  root: true, // Add this to indicate this is the root ESLint configuration
+  env: {
+    browser: true,
+    node: true,
+    'jest/globals': true,
+  },
+  globals: {
+    $: true,
+    grapesjs: true,
+  },
+  extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended', 'prettier'],
+  plugins: ['@typescript-eslint', 'jest'],
+  parserOptions: {
+    ecmaVersion: 2021,
+    sourceType: 'module',
+  },
+  rules: {
+    'no-var': 'off',
+    'prefer-const': 'off',
+    'no-prototype-builtins': 'off',
+    'no-useless-escape': 'off',
+    'prefer-rest-params': 'off',
+    'no-empty': 'off',
+    'prefer-spread': 'off',
+    'no-extra-boolean-cast': 'off',
+    'no-unsafe-optional-chaining': 'off',
+    'no-shadow-restricted-names': 'off',
+    'no-cond-assign': 'off',
+    'no-fallthrough': 'off',
+    'no-sparse-arrays': 'off',
+    'no-redeclare': 'off',
+    'no-control-regex': 'off',
+    'no-constant-condition': 'off',
+    'no-misleading-character-class': 'off',
+    'no-undef': 'off',
+    'no-func-assign': 'off',
+    'no-regex-spaces': 'off',
+    '@typescript-eslint/ban-ts-comment': 'off',
+    '@typescript-eslint/no-require-imports': 'off',
+    '@typescript-eslint/no-explicit-any': 'off',
+    '@typescript-eslint/no-unused-vars': 'off',
+    '@typescript-eslint/no-unused-expressions': 'off',
+    '@typescript-eslint/no-unnecessary-type-const': 'off',
+    '@typescript-eslint/no-empty-object-type': 'off',
+    '@typescript-eslint/no-unnecessary-type-constraint': 'off',
+    '@typescript-eslint/no-this-alias': 'off',
+    '@typescript-eslint/no-unsafe-function-type': 'off',
+    '@typescript-eslint/no-non-null-asserted-optional-chain': 'off',
+    '@typescript-eslint/no-wrapper-object-types': 'off',
+    'linebreak-style': ['error', 'unix'],
+    'max-len': ['error', { code: 300 }],
+    'no-multiple-empty-lines': ['error', { max: 1, maxEOF: 1 }],
+  },
+  ignorePatterns: ['docs/api/*', 'dist/*'],
+};

.eslintrc

@@ -1,6 +1,6 @@
 name: 🐞 Bug report
 description: Create a bug report for GrapesJS.
-title: "BUG: "
+title: 'BUG: '
 labels: []
 body:
   - type: markdown
@@ -61,4 +61,4 @@ body:
       description: By submitting this issue, you agree to follow our [Code of Conduct](https://github.com/artf/grapesjs/blob/dev/CODE_OF_CONDUCT.md)
       options:
         - label: I agree to follow this project's Code of Conduct
-          required: true
+          required: true

.eslintrc.js

@@ -8,4 +8,4 @@ contact_links:
     about: 'If you have a question or need help, ask a question on the discussion forums.'
   - name: 📢 Show and tell
     url: https://github.com/artf/grapesjs/discussions/new?category=show-and-tell
-    about: "Have something nice to say or share about GrapesJS? We'd love to hear it!"
+    about: "Have something nice to say or share about GrapesJS? We'd love to hear it!"

.github/ISSUE_TEMPLATE/1.bug_report.yml

@@ -23,7 +23,6 @@ lockComment: >
 
 # Assign `resolved` as the reason for locking. Set to `false` to disable
 setLockReason: true
-
 # Limit to only `issues` or `pulls`
 # only: issues
 
@@ -37,4 +36,4 @@ setLockReason: true
 #   daysUntilLock: 30
 
 # Repository to extend settings from
-# _extends: repo
+# _extends: repo

.github/ISSUE_TEMPLATE/config.yml

@@ -9,15 +9,14 @@ jobs:
     if: ${{ false }}
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
-      - uses: actions/setup-node@v3
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
         with:
-          node-version: '12.x'
+          node-version: '20.x'
           registry-url: 'https://registry.npmjs.org'
           cache: 'yarn'
       - run: yarn --frozen-lockfile
       - run: yarn build
-      - run: npm run lint
       - run: npm publish
         env:
-          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

.github/lock.yml

@@ -2,27 +2,29 @@ name: Tests
 
 on:
   push:
-    branches: [ dev ]
+    branches: [dev]
   pull_request:
-    branches: [ dev ]
+    branches: [dev]
 
 jobs:
-  build:
+  quailty:
     runs-on: ubuntu-latest
 
     strategy:
       matrix:
-        node-version: [14.17, 16.x]
+        node-version: [18.x, 20.x]
 
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
           cache: 'yarn'
       - run: yarn --frozen-lockfile
-      - run: yarn build
       - run: npm run lint
+      - run: npm run lint:ts
+      - run: npm run format:check
+      - run: yarn build
       - run: npm run ts:build:check
-      - run: npm test
+      - run: npm test

.github/workflows/publish.yml

@@ -0,0 +1,2 @@
+docs/api/*.md
+dist/

.github/workflows/build.yml .github/workflows/quailty.yml

@@ -0,0 +1,10 @@
+{
+  "endOfLine": "lf",
+  "insertPragma": false,
+  "requirePragma": false,
+  "trailingComma": "all",
+  "tabWidth": 2,
+  "useTabs": false,
+  "singleQuote": true,
+  "printWidth": 120
+}

.prettierignore

@@ -8,19 +8,19 @@ In the interest of fostering an open and welcoming environment, we as contributo
 
 Examples of behavior that contributes to creating a positive environment include:
 
-* Using welcoming and inclusive language
-* Being respectful of differing viewpoints and experiences
-* Gracefully accepting constructive criticism
-* Focusing on what is best for the community
-* Showing empathy towards other community members
+- Using welcoming and inclusive language
+- Being respectful of differing viewpoints and experiences
+- Gracefully accepting constructive criticism
+- Focusing on what is best for the community
+- Showing empathy towards other community members
 
 Examples of unacceptable behavior by participants include:
 
-* The use of sexualized language or imagery and unwelcome sexual attention or advances
-* Trolling, insulting/derogatory comments, and personal or political attacks
-* Public or private harassment
-* Publishing others' private information, such as a physical or electronic address, without explicit permission
-* Other conduct which could reasonably be considered inappropriate in a professional setting
+- The use of sexualized language or imagery and unwelcome sexual attention or advances
+- Trolling, insulting/derogatory comments, and personal or political attacks
+- Public or private harassment
+- Publishing others' private information, such as a physical or electronic address, without explicit permission
+- Other conduct which could reasonably be considered inappropriate in a professional setting
 
 ## Our Responsibilities
 

.prettierrc

@@ -5,12 +5,12 @@
 First of all, thank you for considering contributing to GrapesJS!
 
 We welcome any type of contribution, not only code. Like for example:
+
 - **QA**: file bug reports, the more details you can give the better (e.g. screenshots with the console open)
 - **Marketing**: writing blog posts, howto's, tutorials, etc.
 - **Community**: presenting the project at meetups, organizing a dedicated meetup for the local community, etc.
 - **Money**: We welcome financial contributions in full transparency on our [Open Collective].
 
-
 ## Setting up the repository
 
 This is a Node.js project and you need to have Node.js installed on your machine. You can download it from [here](https://nodejs.org/). We test versions 14 and 16 of Node in the CI, so it's recommended to use one of these versions, or the latest of: 16.20.2
@@ -45,7 +45,6 @@ Navigate to `http://localhost:8080/` to see the editor in action. The developmen
 
 Working on your first Pull Request? You can learn how from this **free** series, [How to Contribute to an Open Source Project on GitHub](https://app.egghead.io/playlists/how-to-contribute-to-an-open-source-project-on-github).
 
-
 ## Submitting code
 
 Any code change should be submitted as a pull request. Before start working on something make always a search in opened issues and pull requests, this might help you to avoid wasting time.
@@ -54,29 +53,23 @@ A pull request could be a bug fix, new feature and much more, but in all cases,
 
 The title should be brief but comprehensive, the description contains a link to the opened issue and the proposed solution. The pull request should contain tests whenever possible. Keep in mind that the bigger is the pull request, the longer it will take to review and merge. Try to break down large pull requests in smaller chunks that are easier to review and merge.
 
-
 ## Styleguide
 
 The code is auto formatted with [prettier](https://github.com/prettier/prettier) on any commit, therefore you can write in any style you prefer
 
-
 ## Expenses
 
 Anyone can file an expense (code, marketing, etc.) via our [Open Collective]. If the expense makes sense for the development of the community, it will be "merged" in the ledger of our open collective by the core contributors and the person who filed the expense will be reimbursed.
 
 Before submitting an expense contact core contributors via the current active chat room ([Discord](https://discord.gg/QAbgGXq)) and explain your intents
 
-
 ## Questions
 
 If you have any questions, create an [issue](https://github.com/GrapesJS/grapesjs/issues) (protip: do a quick search first to see if someone else didn't ask the same question before!).
 
-
-
 ## Credits
 
 Thank you to all the people who have already contributed to GrapesJS!
 <a href="/GrapesJS/grapesjs/graphs/contributors"><img src="https://opencollective.com/grapesjs/contributors.svg?width=890" /></a>
 
-
-[Open Collective]: <https://opencollective.com/grapesjs>
+[Open Collective]: https://opencollective.com/grapesjs