Changeset 39075

Timestamp:

11/01/2016 08:05:48 PM (4 years ago)

Author:

iseulde

Message:

TinyMCE: wptextpattern: Handle unconverted inline patterns

Make sure the right text is matched when it already contains characters of the pattern.
Adds two more unit tests.

Fixes #37693.

Location:

trunk

Files:

• src/wp-includes/js/tinymce/plugins/wptextpattern/plugin.js (modified) (3 diffs)
• tests/qunit/index.html (modified) (1 diff)
• tests/qunit/wp-includes/js/tinymce/plugins/wptextpattern/plugin.js (modified) (5 diffs)

trunk/src/wp-includes/js/tinymce/plugins/wptextpattern/plugin.js

@@ -16 +16 @@
     }
 
+    /**
+     * Escapes characters for use in a Regular Expression.
+     *
+     * @param  {String} string Characters to escape
+     *
+     * @return {String}        Escaped characters
+     */
+    function escapeRegExp( string ) {
+        return string.replace( /[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, '\\$&' );
+    }
+
     tinymce.PluginManager.add( 'wptextpattern', function( editor ) {
         var VK = tinymce.util.VK;
-
-        var spacePatterns = [
+        var settings = editor.settings.wptextpattern || {};
+
+        var spacePatterns = settings.space || [
             { regExp: /^[*-]\s/, cmd: 'InsertUnorderedList' },
             { regExp: /^1[.)]\s/, cmd: 'InsertOrderedList' }
         ];
 
-        var enterPatterns = [
+        var enterPatterns = settings.enter || [
             { start: '##', format: 'h2' },
             { start: '###', format: 'h3' },
@@ -34 +46 @@
         ];
 
-        var inlinePatterns = [
+        var inlinePatterns = settings.inline || [
             { start: '`', end: '`', format: 'code' }
         ];
@@ -82 +94 @@
             var zero;
 
+            // We need a non empty text node with an offset greater than zero.
             if ( ! node || node.nodeType !== 3 || ! node.data.length || ! offset ) {
                 return;
             }
 
+            // The ending character should exist in the patterns registered.
             if ( tinymce.inArray( chars, node.data.charAt( offset - 1 ) ) === -1 ) {
                 return;
             }
 
-            function findStart( node ) {
-                var i = inlinePatterns.length;
-                var offset;
-
-                while ( i-- ) {
-                    pattern = inlinePatterns[ i ];
-                    offset = node.data.indexOf( pattern.end );
-
-                    if ( offset !== -1 ) {
-                        return offset;
-                    }
-                }
-            }
-
-            startOffset = findStart( node );
-            endOffset = node.data.lastIndexOf( pattern.end );
-
-            if ( startOffset === endOffset || endOffset === -1 ) {
-                return;
-            }
-
-            if ( endOffset - startOffset <= pattern.start.length ) {
-                return;
-            }
-
-            if ( node.data.slice( startOffset + pattern.start.length, endOffset ).indexOf( pattern.start.slice( 0, 1 ) ) !== -1 ) {
+            var string = node.data.slice( 0, offset );
+
+            tinymce.each( inlinePatterns, function( p ) {
+                var regExp = new RegExp( escapeRegExp( p.start ) + '\\S+' + escapeRegExp( p.end ) + '$' );
+                var match = string.match( regExp );
+
+                if ( ! match ) {
+                    return;
+                }
+
+                // Don't allow pattern characters in the text.
+                if ( node.data.slice( match.index + p.start.length, offset - p.end.length ).indexOf( p.start.slice( 0, 1 ) ) !== -1 ) {
+                    return;
+                }
+
+                startOffset = match.index;
+                endOffset = offset - p.end.length;
+                pattern = p;
+
+                return false;
+            } );
+
+            if ( ! pattern ) {
                 return;
             }

trunk/tests/qunit/index.html

@@ -492 +492 @@
         </div><!-- end widget templates -->
         <script src="../../src/wp-includes/js/tinymce/tinymce.js"></script>
+        <script src="../../src/wp-includes/js/tinymce/plugins/wptextpattern/plugin.js"></script>
         <script src="editor/js/utils.js"></script>
         <script src="wp-includes/js/tinymce/plugins/wptextpattern/plugin.js"></script>

trunk/tests/qunit/wp-includes/js/tinymce/plugins/wptextpattern/plugin.js

@@ -156 +156 @@
                     skin: false,
                     plugins: 'wptextpattern',
+                    wptextpattern: {
+                        inline: [
+                            { start: '`', end: '`', format: 'code' },
+                            { start: '``', end: '``', format: 'bold' }
+                        ]
+                    },
                     init_instance_callback: function() {
                         editor = arguments[0];
@@ -300 +306 @@
     } );
 
-    QUnit.test( 'Inline: single.', function( assert ) {
+    QUnit.test( 'Inline: single character.', function( assert ) {
         type( '`test`', function() {
             assert.equal( editor.getContent(), '<p><code>test</code></p>' );
@@ -307 +313 @@
     } );
 
+    QUnit.test( 'Inline: two characters.', function( assert ) {
+        type( '``test``', function() {
+            assert.equal( editor.getContent(), '<p><strong>test</strong></p>' );
+            assert.equal( editor.selection.getRng().startOffset, 1 );
+        }, assert.async() );
+    } );
+
     QUnit.test( 'Inline: after typing.', function( assert ) {
         editor.setContent( '<p>test test test</p>' );
@@ -312 +325 @@
 
         type( '`', function() {
-            editor.selection.setCursorLocation( editor.$( 'p' )[0].firstChild, 11 );
+            editor.selection.setCursorLocation( editor.$( 'p' )[0].firstChild, 10 );
         }, '`', function() {
             assert.equal( editor.getContent(), '<p>test <code>test</code> test</p>' );
@@ -324 +337 @@
         }, assert.async() );
     } );
+
+    QUnit.test( 'Convert with previously unconverted pattern', function( assert ) {
+        editor.setContent( '<p>`test` test&nbsp;</p>' );
+        editor.selection.setCursorLocation( editor.$( 'p' )[0].firstChild, 12 );
+
+        type( '`test`', function() {
+            assert.equal( editor.getContent(), '<p>`test` test&nbsp;<code>test</code></p>' );
+        }, assert.async() );
+    } );
 } )( window.jQuery, window.QUnit, window.tinymce, window.setTimeout );