Next 3.0.1-beta

.babelrc

@@ -1,7 +1,7 @@
 {
   "presets": [
     ["env", {
-       "modules": false
+      "modules": false
     }],
     [
       "babel-preset-env",
@@ -10,11 +10,10 @@
           "node": "current"
         }
       }
-    ], 
+    ],
     "stage-2"
   ],
-  
+
   "plugins": ["transform-runtime"],
   "comments": false
 }
-

.eslintrc.js

@@ -1,49 +1,196 @@
-// http://eslint.org/docs/user-guide/configuring
-
 module.exports = {
   root: true,
-  parser: 'babel-eslint',
   parserOptions: {
-    sourceType: 'module'
+    parser: 'babel-eslint',
+    sourceType: 'module',
   },
   env: {
     browser: true,
+    node: true,
+    es6: true,
   },
-  // https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style
-  extends: 'standard',
-  // required to lint *.vue files
-  plugins: [
-    'html'
-  ],
+  extends: ['plugin:vue/recommended', 'eslint:recommended'],
+
   // add your custom rules here
-  'rules': {
-    // allow paren-less arrow functions
-    'arrow-parens': 0,
-    // allow async-await
-    'generator-star-spacing': 0,
-    // allow debugger during development
-    'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
-    // 忽略;
-    'semi':0,
-    // 忽略缩进
-    'indent':0,
-    // camel case
-    'camelcase':0,
-    // 键值对:后强制空格
-    'key-spacing':0,
-    // ,前不允许空格
-    'comma-spacing':0,
-    // 函数空格
-    'space-before-function-paren':0,
-    //
-    'no-unused-vars':0,
-    // else 强制换行
-    'brace-style':0,
-    'no-unneeded-ternary': 0,
-    'quotes': 0,
+  // it is base on https://github.com/vuejs/eslint-config-vue
+  rules: {
+    'vue/max-attributes-per-line': [2, {
+      'singleline': 10,
+      'multiline': 1,
+    }],
+    'vue/singleline-html-element-content-newline': 'off',
+    'vue/multiline-html-element-content-newline': 'off',
+    'vue/component-definition-name-casing': ['error', 'PascalCase'],
+    'vue/no-v-html': 'off',
+    'accessor-pairs': 2,
+    'arrow-spacing': [2, {
+      'before': true,
+      'after': true,
+    }],
+    'block-spacing': [2, 'always'],
+    'brace-style': [2, '1tbs', {
+      'allowSingleLine': true,
+    }],
+    'camelcase': [0, {
+      'properties': 'always',
+    }],
+    'comma-dangle': [2, 'always-multiline'],
+    'comma-spacing': [2, {
+      'before': false,
+      'after': true,
+    }],
+    'comma-style': [2, 'last'],
+    'constructor-super': 2,
+    'curly': [2, 'multi-line'],
+    'dot-location': [2, 'property'],
+    'eol-last': 2,
+    'eqeqeq': ['error', 'always', { 'null': 'ignore' }],
+    'generator-star-spacing': [2, {
+      'before': true,
+      'after': true,
+    }],
+    'handle-callback-err': [2, '^(err|error)$'],
+    'indent': [2, 2, {
+      'SwitchCase': 1,
+      ignoredNodes: ['TemplateLiteral'],
+    }],
+    'jsx-quotes': [2, 'prefer-single'],
+    'key-spacing': [2, {
+      'beforeColon': false,
+      'afterColon': true,
+    }],
+    'keyword-spacing': [2, {
+      'before': true,
+      'after': true,
+    }],
+    'new-cap': [2, {
+      'newIsCap': true,
+      'capIsNew': false,
+    }],
+    'new-parens': 2,
+    'no-array-constructor': 2,
+    'no-caller': 2,
+    'no-console': 'off',
+    'no-class-assign': 2,
+    'no-cond-assign': 2,
+    'no-const-assign': 2,
+    'no-control-regex': 0,
+    'no-delete-var': 2,
+    'no-dupe-args': 2,
+    'no-dupe-class-members': 2,
+    'no-dupe-keys': 2,
+    'no-duplicate-case': 2,
+    'no-empty-character-class': 2,
+    'no-empty-pattern': 2,
+    'no-eval': 2,
+    'no-ex-assign': 2,
+    'no-extend-native': 2,
+    'no-extra-bind': 2,
+    'no-extra-boolean-cast': 2,
+    'no-extra-parens': [2, 'functions'],
+    'no-fallthrough': 2,
+    'no-floating-decimal': 2,
+    'no-func-assign': 2,
+    'no-implied-eval': 2,
+    'no-inner-declarations': [2, 'functions'],
+    'no-invalid-regexp': 2,
+    'no-irregular-whitespace': 2,
+    'no-iterator': 2,
+    'no-label-var': 2,
+    'no-labels': [2, {
+      'allowLoop': false,
+      'allowSwitch': false,
+    }],
+    'no-lone-blocks': 2,
+    'no-mixed-spaces-and-tabs': 2,
+    'no-multi-spaces': 2,
+    'no-multi-str': 2,
+    'no-multiple-empty-lines': [2, {
+      'max': 1,
+    }],
+    'no-native-reassign': 2,
+    'no-negated-in-lhs': 2,
+    'no-new-object': 2,
+    'no-new-require': 2,
+    'no-new-symbol': 2,
+    'no-new-wrappers': 2,
+    'no-obj-calls': 2,
+    'no-octal': 2,
+    'no-octal-escape': 2,
+    'no-path-concat': 2,
+    'no-proto': 2,
+    'no-redeclare': 2,
+    'no-regex-spaces': 2,
+    'no-return-assign': [2, 'except-parens'],
+    'no-self-assign': 2,
+    'no-self-compare': 2,
+    'no-sequences': 2,
+    'no-shadow-restricted-names': 2,
+    'no-spaced-func': 2,
+    'no-sparse-arrays': 2,
+    'no-this-before-super': 2,
+    'no-throw-literal': 2,
+    'no-trailing-spaces': 2,
+    'no-undef': 2,
+    'no-undef-init': 2,
+    'no-unexpected-multiline': 2,
+    'no-unmodified-loop-condition': 2,
+    'no-unneeded-ternary': [2, {
+      'defaultAssignment': false,
+    }],
+    'no-unreachable': 2,
+    'no-unsafe-finally': 2,
+    'no-unused-vars': [2, {
+      'vars': 'all',
+      'args': 'none',
+    }],
+    'no-useless-call': 2,
+    'no-useless-computed-key': 2,
+    'no-useless-constructor': 2,
     'no-useless-escape': 0,
-    'no-eval': 0,
-    // 允许多个空格
-    'no-multi-spaces': 0
-  }
+    'no-whitespace-before-property': 2,
+    'no-with': 2,
+    'one-var': [2, {
+      'initialized': 'never',
+    }],
+    'operator-linebreak': [2, 'after', {
+      'overrides': {
+        '?': 'before',
+        ':': 'before',
+      },
+    }],
+    'padded-blocks': [2, 'never'],
+    'quotes': [2, 'single', {
+      'avoidEscape': true,
+      'allowTemplateLiterals': true,
+    }],
+    'semi': [2, 'never'],
+    'semi-spacing': [2, {
+      'before': false,
+      'after': true,
+    }],
+    'space-before-blocks': [2, 'always'],
+    'space-before-function-paren': [2, 'never'],
+    'space-in-parens': [2, 'never'],
+    'space-infix-ops': 2,
+    'space-unary-ops': [2, {
+      'words': true,
+      'nonwords': false,
+    }],
+    'spaced-comment': [2, 'always', {
+      'markers': ['global', 'globals', 'eslint', 'eslint-disable', '*package', '!', ','],
+    }],
+    'template-curly-spacing': 'off',
+    'use-isnan': 2,
+    'valid-typeof': 2,
+    'wrap-iife': [2, 'any'],
+    'yield-star-spacing': [2, 'both'],
+    'yoda': [2, 'never'],
+    'prefer-const': 2,
+    'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
+    'object-curly-spacing': [2, 'always', {
+      objectsInObjects: false,
+    }],
+    'array-bracket-spacing': [2, 'never'],
+  },
 }

README-EN.md

@@ -68,7 +68,8 @@ $ npm install mavon-editor@next --save
 | imageFilter | Function |     null     | Image file filter Function, params is a `File Object`, you should return `Boolean` about the test result |
 | imageClick | function |     null     |  Image Click Function |
 | tabSize | Number |     null     |  How many spaces equals one tab, default \t |
-| xssOptions     | Object  |     null     | xss options: [https://github.com/leizongmin/js-xss](https://github.com/leizongmin/js-xss)                    |
+| html    | Boolean  |     true     |  Enable HTML tags in source, for historical reasons this tag has always been true by default, but it is recommended to turn it off if you don't need this feature, as doing so it eliminates the security vulnerabilities altogether. |
+| xssOptions     | Object  |     {}     | xss rules configuration, enabled by default, set to false to turn off, enabled will filter HTML tags, the default filter all HTML tag attributes, it is recommended to configure the whitelist on demand to reduce the possibility of being attacked.<br/> - custom rule reference: [https://jsxss.com/zh/options.html](https://jsxss.com/zh/options.html)<br/>- Demo: [dev-demo](./src/dev/editor.vue)                    |
 | toolbars   | Object      |   As in the following example  | toolbars |
 
 ```javascript

README.md

@@ -70,7 +70,8 @@ $ npm install mavon-editor@next --save
 | imageFilter | function |     null     |  图片过滤函数，参数为一个`File Object`，要求返回一个`Boolean`, `true`表示文件合法，`false`表示文件不合法 |
 | imageClick | function |     null     |  图片点击事件，默认为预览，可覆盖 |
 | tabSize     | Number  |     \t     | tab转化为几个空格，默认为\t                      |
-| xssOptions     | Object  |     null     | xss规则配置，参考 [https://github.com/leizongmin/js-xss](https://github.com/leizongmin/js-xss)                    |
+| html     | Boolean  |     true     | 启用HTML标签，因为历史原因这个标记一直默认为true，但建议不使用HTML标签就关闭它，它能彻底杜绝安全问题。                      |
+| xssOptions     | Object  |     {}     | xss规则配置, 默认开启，设置false可以关闭，开启后会对HTML标签进行过滤，默认过滤所有HTML标签属性，建议按需配置白名单减少被攻击的可能。<br/>- 自定义规则参考: [https://jsxss.com/zh/options.html](https://jsxss.com/zh/options.html)<br/>- 参考DEMO: [dev-demo](./src/dev/editor.vue)                  |
 | toolbars     | Object  |     如下例     | 工具栏                      |
 
 ```javascript

doc/cn/markdown.md

@@ -4,25 +4,23 @@
 
 #### 方法1 通过全局引入的mavonEditor获取
 ```javascript
-  import mavonEditor from 'mavon-editor'
-  Vue.use(mavonEditor)
+  import MavonEditor from 'mavon-editor'
+  Vue.use(MavonEditor)
   ...
-  mavonEditor.markdownIt
+  const markdownIt = MavonEditor.mavonEditor.getMarkdownIt()
 ```
 
 #### 方法2 通过局部引入的mavonEditor获取
 ```javascript
-  import {mavonEditor} from 'mavon-editor'
-  mavonEditor.getMarkdownIt()
-  或者
-  mavonEditor.mixins[0].data().markdownIt
+  import { mavonEditor } from 'mavon-editor'
+  const markdownIt = mavonEditor.getMarkdownIt()
 ```
 
 #### 方法3 通过mavonEditor的实例获取
 ```javascript
    <mavonEditor ref=md></mavonEditor>
    ...
-   this.refs.md.markdownIt
+   const markdownIt = this.refs.md.getMarkdownIt()
 ```
 
 ### 使用markdown-it对象
@@ -34,4 +32,4 @@
     markdownIt.set({ breaks: false });
 ```
 
-> [更多设置参考markdown-it...](https://github.com/markdown-it/markdown-it)
+> [更多设置参考markdown-it...](https://github.com/markdown-it/markdown-it)

doc/en/markdown.md

@@ -4,25 +4,23 @@
 
 #### method 1:  Global Registration
 ```javascript
-  import mavonEditor from 'mavon-editor'
-  Vue.use(mavonEditor)
+  import MavonEditor from 'mavon-editor'
+  Vue.use(MavonEditor)
   ...
-  mavonEditor.markdownIt
+  const markdownIt = MavonEditor.mavonEditor.getMarkdownIt()
 ```
 
 #### method 2: Local Registration
 ```javascript
   import {mavonEditor} from 'mavon-editor'
-  mavonEditor.getMarkdownIt()
-  or
-  mavonEditor.mixins[0].data().s_markdown
+  const markdownIt = mavonEditor.getMarkdownIt()
 ```
 
 #### method 3: Use mavonEditor ref
 ```javascript
    <mavonEditor ref=md></mavonEditor>
    ...
-   this.refs.md.markdownIt
+   const markdownIt = this.refs.md.getMarkdownIt()
 ```
 
 ### Use markdown-it object
@@ -34,4 +32,4 @@
     markdownIt.set({ breaks: false });
 ```
 
-> [markdown-it API](https://github.com/markdown-it/markdown-it)
+> [markdown-it API](https://github.com/markdown-it/markdown-it)

jest.config.js

@@ -1,28 +1,28 @@
 module.exports = {
-  transformIgnorePatterns: ["<rootDir>/node_modules/(?!auto-textarea|@vue|src)"],
+  transformIgnorePatterns: ['<rootDir>/node_modules/(?!auto-textarea|@vue|src)'],
   testMatch: [
-    "**/tests/unit/*.spec.js"
+    '**/tests/unit/*.spec.js',
   ],
   verbose: true,
   moduleFileExtensions: ['js', 'vue', 'md', 'html'],
   moduleNameMapper: {
     '\\.(css|scss)$': 'identity-obj-proxy',
-    '^@/(.*)$': '<rootDir>/src/$1'
+    '^@/(.*)$': '<rootDir>/src/$1',
   },
   transform: {
-    "^.+\\.js$": "<rootDir>/node_modules/babel-jest",
-    "^.+\\.vue$": "<rootDir>/node_modules/vue-jest",
-    '.*\\.(yml|html|md)$': 'jest-raw-loader'
+    '^.+\\.js$': '<rootDir>/node_modules/babel-jest',
+    '^.+\\.vue$': '<rootDir>/node_modules/@vue/vue3-jest',
+    '.*\\.(yml|html|md)$': 'jest-raw-loader',
   },
   // setupFiles: ['<rootDir>/tests/unit/setup.js'],
   coverageDirectory: '<rootDir>/tests/unit/coverage',
   collectCoverageFrom: [
     'src/**/*.{js,vue}',
     '!src/main.js',
     '!src/dev/**',
-    '!**/node_modules/**'
+    '!**/node_modules/**',
   ],
   snapshotSerializers: [
-    "jest-serializer-vue"
-  ]
+    'jest-serializer-vue',
+  ],
 }