Merge branch 'master' into header-return-fix

sugarshin · web-flow · commit 666e6181967b · 2018-05-21T13:09:40.000+09:00
diff --git a/.gitignore b/.gitignore
@@ -40,5 +40,3 @@ lib
 demo/public
 .deploy
 test-results.xml
-
-yarn.lock
diff --git a/.mocha.opts b/.mocha.opts
@@ -1,4 +1,5 @@
 --compilers js:babel-core/register
 --recursive
+--require raf/polyfill
 --require testHelper.js
 --reporter mocha-multi-reporters --reporter-options configFile=.mocha-multi-reporters.json
diff --git a/.node-version b/.node-version
@@ -0,0 +1 @@
+8.9.4
diff --git a/circle.yml b/circle.yml
@@ -1,14 +1,19 @@
 machine:
   timezone: UTC
   node:
-    version: 4.2.6
+    version: 8.9.4
   pre:
     - "git config --global user.name 'Circle CI'"
     - "git config --global user.email 'a+circleci@ngs.io'"
 general:
   branches:
     ignore:
       - gh-pages
+dependencies:
+  override:
+    - yarn
+  cache_directories:
+    - ~/.cache/yarn
 test:
   override:
     - npm test
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "draft-js-markdown-shortcuts-plugin",
-  "version": "0.3.0",
+  "version": "0.4.1",
   "description": "A DraftJS plugin for supporting Markdown syntax shortcuts",
   "main": "lib/index.js",
   "scripts": {
@@ -55,15 +55,16 @@
     "babel-preset-react-hmre": "^1.1.1",
     "babel-preset-stage-0": "^6.16.0",
     "chai": "^3.5.0",
-    "chai-enzyme": "^0.6.1",
+    "chai-enzyme": "^1.0.0-beta.0",
     "cheerio": "^0.22.0",
     "coveralls": "^2.11.15",
     "css-loader": "^0.26.0",
     "css-modules-require-hook": "^4.0.5",
     "dirty-chai": "^1.2.2",
-    "draft-js-plugins-editor": "2.0.0-rc2",
-    "draft-js-prism": "ngs/draft-js-prism#6edb31c3805dd1de3fb897cc27fced6bac1bafbb",
-    "enzyme": "^2.6.0",
+    "draft-js-plugins-editor": "2.0.4",
+    "draft-js-prism": "^1.0.5",
+    "enzyme": "^3.3.0",
+    "enzyme-adapter-react-16": "^1.1.1",
     "eslint": "^3.11.1",
     "eslint-config-airbnb": "^13.0.0",
     "eslint-plugin-import": "^2.2.0",
@@ -83,11 +84,12 @@
     "nyc": "^10.0.0",
     "postcss-loader": "^1.1.1",
     "prismjs": "^1.6.0",
-    "react": "^15.4.1",
+    "raf": "^3.4.0",
+    "react": "^16.2.0",
     "react-addons-pure-render-mixin": "^15.4.1",
     "react-addons-test-utils": "^15.4.1",
-    "react-dom": "^15.4.1",
-    "react-github-fork-ribbon": "^0.4.4",
+    "react-dom": "^16.2.0",
+    "react-github-fork-ribbon": "^0.5.1",
     "rimraf": "^2.5.4",
     "sinon": "^1.17.6",
     "sinon-chai": "^2.8.0",
@@ -99,17 +101,17 @@
     "webpack-hot-middleware": "^2.13.2"
   },
   "peerDependencies": {
-    "draft-js-plugins-editor": "~2.0.0-rc.1 || 2.0.0-rc2 || 2.0.0-rc1 || 2.0.0-beta12",
-    "react": "^15.0.0",
-    "react-dom": "^15.0.0"
+    "draft-js-plugins-editor": "^2.0.0 || ~2.0.0-rc.1 || 2.0.0-rc2 || 2.0.0-rc1 || 2.0.0-beta12",
+    "react": "^16.0.0 || ^15.0.0",
+    "react-dom": "^16.0.0 || ^15.0.0"
   },
   "contributors": [
     "Atsushi Nagase <a@ngs.io>"
   ],
   "dependencies": {
-    "decorate-component-with-props": "^1.0.2",
-    "draft-js": "~0.10.1",
-    "draft-js-checkable-list-item": "^2.0.5",
+    "decorate-component-with-props": "^1.1.0",
+    "draft-js": "~0.10.5",
+    "draft-js-checkable-list-item": "^3.0.1",
     "immutable": "~3.7.4"
   }
 }
diff --git a/src/__test__/plugin-test.js b/src/__test__/plugin-test.js
@@ -349,7 +349,6 @@ describe('draft-js-markdown-shortcuts-plugin', () => {
         });
         [
           'replaceText',
-          'insertEmptyBlock',
           'handleBlockType',
           'handleImage',
           'handleLink',
diff --git a/src/index.js b/src/index.js
@@ -19,17 +19,20 @@ import createLinkDecorator from './decorators/link';
 import createImageDecorator from './decorators/image';
 import { replaceText } from './utils';
 
-const INLINE_STYLE_CHARACTERS = [' ', '*', '_'];
-
 function checkCharacterForState(editorState, character) {
   let newEditorState = handleBlockType(editorState, character);
+  const contentState = editorState.getCurrentContent();
+  const selection = editorState.getSelection();
+  const key = selection.getStartKey();
+  const currentBlock = contentState.getBlockForKey(key);
+  const type = currentBlock.getType();
   if (editorState === newEditorState) {
     newEditorState = handleImage(editorState, character);
   }
   if (editorState === newEditorState) {
     newEditorState = handleLink(editorState, character);
   }
-  if (editorState === newEditorState) {
+  if (editorState === newEditorState && type !== 'code-block') {
     newEditorState = handleInlineStyle(editorState, character);
   }
   return newEditorState;
@@ -62,7 +65,9 @@ function checkReturnForState(editorState, ev) {
       newEditorState = insertText(editorState, '\n');
     }
   }
-
+  if (editorState === newEditorState) {
+    newEditorState = handleInlineStyle(editorState, '\n');
+  }
   return newEditorState;
 }
 
@@ -129,7 +134,7 @@ const createMarkdownShortcutsPlugin = (config = {}) => {
       return 'not-handled';
     },
     handleBeforeInput(character, editorState, { setEditorState }) {
-      if (character !== ' ') {
+      if (character.match(/[A-z0-9_*~`]/)) {
         return 'not-handled';
       }
       const newEditorState = checkCharacterForState(editorState, character);
@@ -146,7 +151,7 @@ const createMarkdownShortcutsPlugin = (config = {}) => {
       let newEditorState = editorState;
       let buffer = [];
       for (let i = 0; i < text.length; i++) { // eslint-disable-line no-plusplus
-        if (INLINE_STYLE_CHARACTERS.indexOf(text[i]) >= 0) {
+        if (text[i].match(/[^A-z0-9_*~`]/)) {
           newEditorState = replaceText(newEditorState, buffer.join('') + text[i]);
           newEditorState = checkCharacterForState(newEditorState, text[i]);
           buffer = [];
diff --git a/src/modifiers/__test__/changeCurrentInlineStyle-test.js b/src/modifiers/__test__/changeCurrentInlineStyle-test.js
@@ -32,7 +32,7 @@ describe('changeCurrentInlineStyle', () => {
   it('changes block type', () => {
     const text = 'foo `bar` baz';
     const editorState = createEditorState(text, []);
-    const matchArr = ['`bar`', 'bar'];
+    const matchArr = ['`bar` ', '`', 'bar', '`', ' '];
     matchArr.index = 4;
     matchArr.input = text;
     const newEditorState = changeCurrentInlineStyle(
@@ -41,7 +41,7 @@ describe('changeCurrentInlineStyle', () => {
     expect(
       Draft.convertToRaw(newEditorState.getCurrentContent())
     ).to.deep.equal(
-      rawContentState('foo bar  baz', [{
+      rawContentState('foo bar baz', [{
         length: 3,
         offset: 4,
         style: 'CODE'
diff --git a/src/modifiers/__test__/handleInlineStyle-test.js b/src/modifiers/__test__/handleInlineStyle-test.js
@@ -58,7 +58,7 @@ describe('handleInlineStyle', () => {
         entityMap: {},
         blocks: [{
           key: 'item1',
-          text: 'hello inline  style',
+          text: 'hello inline style',
           type: 'unstyled',
           depth: 0,
           inlineStyleRanges: [{
@@ -96,7 +96,7 @@ describe('handleInlineStyle', () => {
         entityMap: {},
         blocks: [{
           key: 'item1',
-          text: 'hello inline  style',
+          text: 'hello inline style',
           type: 'unstyled',
           depth: 0,
           inlineStyleRanges: [{
@@ -134,7 +134,7 @@ describe('handleInlineStyle', () => {
         entityMap: {},
         blocks: [{
           key: 'item1',
-          text: 'hello inline  style',
+          text: 'hello inline style',
           type: 'unstyled',
           depth: 0,
           inlineStyleRanges: [{
@@ -172,7 +172,7 @@ describe('handleInlineStyle', () => {
         entityMap: {},
         blocks: [{
           key: 'item1',
-          text: 'hello inline  style',
+          text: 'hello inline style',
           type: 'unstyled',
           depth: 0,
           inlineStyleRanges: [{
@@ -214,7 +214,7 @@ describe('handleInlineStyle', () => {
         entityMap: {},
         blocks: [{
           key: 'item1',
-          text: 'hello inline  style',
+          text: 'hello inline style',
           type: 'unstyled',
           depth: 0,
           inlineStyleRanges: [{
@@ -256,7 +256,7 @@ describe('handleInlineStyle', () => {
         entityMap: {},
         blocks: [{
           key: 'item1',
-          text: 'hello inline  style',
+          text: 'hello inline style',
           type: 'unstyled',
           depth: 0,
           inlineStyleRanges: [{
@@ -294,7 +294,7 @@ describe('handleInlineStyle', () => {
         entityMap: {},
         blocks: [{
           key: 'item1',
-          text: 'hello inline  style',
+          text: 'hello inline style',
           type: 'unstyled',
           depth: 0,
           inlineStyleRanges: [{
@@ -339,7 +339,7 @@ describe('handleInlineStyle', () => {
         entityMap: {},
         blocks: [{
           key: 'item1',
-          text: 'hello inline  style',
+          text: 'hello inline style',
           type: 'unstyled',
           depth: 0,
           inlineStyleRanges: [{
@@ -386,7 +386,7 @@ describe('handleInlineStyle', () => {
         entityMap: {},
         blocks: [{
           key: 'item1',
-          text: 'hello inline  style',
+          text: 'hello inline style',
           type: 'unstyled',
           depth: 0,
           inlineStyleRanges: [{
diff --git a/src/modifiers/changeCurrentInlineStyle.js b/src/modifiers/changeCurrentInlineStyle.js
@@ -11,19 +11,19 @@ const changeCurrentInlineStyle = (editorState, matchArr, style) => {
   const newStyle = currentInlineStyle.merge([style]);
   const focusOffset = index + matchArr[0].length;
   const wordSelection = SelectionState.createEmpty(key).merge({
-    anchorOffset: index,
+    anchorOffset: index + matchArr[0].indexOf(matchArr[1]),
     focusOffset
   });
   let newContentState = Modifier.replaceText(
     currentContent,
     wordSelection,
-    matchArr[1],
+    matchArr[2],
     newStyle
   );
   newContentState = Modifier.insertText(
     newContentState,
     newContentState.getSelectionAfter(),
-    ' '
+    matchArr[4]
   );
   const newEditorState = EditorState.push(
     editorState,
diff --git a/src/modifiers/handleInlineStyle.js b/src/modifiers/handleInlineStyle.js
@@ -1,20 +1,10 @@
 import changeCurrentInlineStyle from './changeCurrentInlineStyle';
 
 const inlineMatchers = {
-  BOLD: [
-    /\*\*([^(?:**)]+)\*\*/g,
-    /__([^(?:__)]+)__/g
-  ],
-  ITALIC: [
-    /\*([^*]+)\*/g,
-    /_([^_]+)_/g
-  ],
-  CODE: [
-    /`([^`]+)`/g
-  ],
-  STRIKETHROUGH: [
-    /~~([^(?:~~)]+)~~/g
-  ]
+  BOLD: /(?:^|\s|\n|[^A-z0-9_*~`])(\*{2}|_{2})((?!\1).*?)(\1)($|\s|\n|[^A-z0-9_*~`])/g,
+  ITALIC: /(?:^|\s|\n|[^A-z0-9_*~`])(\*{1}|_{1})((?!\1).*?)(\1)($|\s|\n|[^A-z0-9_*~`])/g,
+  CODE: /(?:^|\s|\n|[^A-z0-9_*~`])(`)((?!\1).*?)(\1)($|\s|\n|[^A-z0-9_*~`])/g,
+  STRIKETHROUGH: /(?:^|\s|\n|[^A-z0-9_*~`])(~{2})((?!\1).*?)(\1)($|\s|\n|[^A-z0-9_*~`])/g
 };
 
 const handleInlineStyle = (editorState, character) => {
@@ -23,16 +13,14 @@ const handleInlineStyle = (editorState, character) => {
   const line = `${text}${character}`;
   let newEditorState = editorState;
   Object.keys(inlineMatchers).some((k) => {
-    inlineMatchers[k].some((re) => {
-      let matchArr;
-      do {
-        matchArr = re.exec(line);
-        if (matchArr) {
-          newEditorState = changeCurrentInlineStyle(newEditorState, matchArr, k);
-        }
-      } while (matchArr);
-      return newEditorState !== editorState;
-    });
+    const re = inlineMatchers[k];
+    let matchArr;
+    do {
+      matchArr = re.exec(line);
+      if (matchArr) {
+        newEditorState = changeCurrentInlineStyle(newEditorState, matchArr, k);
+      }
+    } while (matchArr);
     return newEditorState !== editorState;
   });
   return newEditorState;
diff --git a/testHelper.js b/testHelper.js
@@ -2,6 +2,8 @@ import chai from 'chai';
 import dirtyChai from 'dirty-chai';
 import hook from 'css-modules-require-hook';
 import { jsdom } from 'jsdom';
+import Enzyme from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
 
 process.env.NODE_ENV = 'test';
 
@@ -20,6 +22,8 @@ Object.keys(document.defaultView).forEach((property) => {
   }
 });
 
+Enzyme.configure({ adapter: new Adapter() });
+
 // chaiEnzyme needs to be initialised here, so that canUseDOM is set
 // to true when react-dom initialises (which chai-enzyme depends upon)
 const chaiEnzyme = require('chai-enzyme');
diff --git a/yarn.lock b/yarn.lock

Original file line number	Diff line number	Diff line change
`@@ -349,7 +349,6 @@ describe('draft-js-markdown-shortcuts-plugin', () => {`
`349`	`349`	`});`
`350`	`350`	`[`
`351`	`351`	`'replaceText',`
`352`		`- 'insertEmptyBlock',`
`353`	`352`	`'handleBlockType',`
`354`	`353`	`'handleImage',`
`355`	`354`	`'handleLink',`