Add warning logging to the invalid config pattern.

packages/ckeditor5-engine/src/view/matcher.js

@@ -7,6 +7,7 @@
  * @module engine/view/matcher
  */
 
+import { logWarning } from '@ckeditor/ckeditor5-utils/src/ckeditorerror';
 import { isPlainObject } from 'lodash-es';
 
 /**
@@ -338,7 +339,12 @@ function matchPatterns( patterns, items, valueGetter ) {
 function normalizePatterns( patterns ) {
 	if ( Array.isArray( patterns ) ) {
 		return patterns.map( pattern => {
-			if ( isPlainObject( pattern ) && pattern.key && pattern.value ) {
+			if ( isPlainObject( pattern ) ) {
+				if ( pattern.key === undefined || pattern.value === undefined ) {
+					// Documented at the end of matcher.js.
+					logWarning( 'matcher-patterns-pattern-missing-key-or-value', pattern );
+				}
+
 				return [ pattern.key, pattern.value ];
 			}
 
@@ -524,3 +530,11 @@ function matchStyles( patterns, element ) {
  * @property {Object} [attributes] Object with key-value pairs representing attributes to match.
  * Each object key represents attribute name. Value can be given as `String` or `RegExp`.
  */
+
+/**
+ * The key-value matcher pattern is missing key or value. Both must be present.
+ * Refer the documentation: {@link module:engine/view/matcher~MatcherPattern}.
+ *
+ * @param {Object} pattern Pattern with missing properties.
+ * @error matcher-patterns-pattern-missing-key-or-value
+ */

packages/ckeditor5-engine/tests/view/matcher.js

@@ -3,6 +3,8 @@
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
+/* global console */
+
 import Matcher from '../../src/view/matcher';
 import Element from '../../src/view/element';
 import Document from '../../src/view/document';
@@ -318,19 +320,20 @@ describe( 'Matcher', () => {
 		} );
 
 		it( 'should match element class names using an array', () => {
-			const pattern = { classes: [ 'foobar', 'foobaz' ] };
+			const pattern = { classes: [ 'foo', 'bar' ] };
 			const matcher = new Matcher( pattern );
-			const el1 = new Element( document, 'p', { class: 'foobar foobaz' } );
-
-			const el2 = new Element( document, 'p', { class: 'foobaz'	} );
+			const el1 = new Element( document, 'p', { class: 'foo bar' } );
+			const el2 = new Element( document, 'p', { class: 'bar'	} );
 			const el3 = new Element( document, 'p', { class: 'qux'	} );
 
 			const result = matcher.match( el1 );
 			expect( result ).to.be.an( 'object' );
 			expect( result ).to.have.property( 'element' ).that.equal( el1 );
 			expect( result ).to.have.property( 'pattern' ).that.equal( pattern );
 			expect( result ).to.have.property( 'match' ).that.has.property( 'classes' ).that.is.an( 'array' );
-			expect( result.match.classes[ 0 ] ).equal( 'foobar' );
+			expect( result.match.classes.length ).equal( 2 );
+			expect( result.match.classes[ 0 ] ).equal( 'foo' );
+			expect( result.match.classes[ 1 ] ).equal( 'bar' );
 
 			expect( matcher.match( el2 ) ).to.be.null;
 			expect( matcher.match( el3 ) ).to.be.null;
@@ -587,6 +590,25 @@ describe( 'Matcher', () => {
 			expect( matcher.match( el3 ) ).to.be.null;
 		} );
 
+		it( 'should display warning when key->value pattern is missing either key or value', () => {
+			const pattern = {
+				styles: [
+					{ key: /border-.*/ }
+				]
+			};
+			const warnStub = sinon.stub( console, 'warn' );
+			const matcher = new Matcher( pattern );
+			const el1 = new Element( document, 'p', { style: 'border-top: 1px solid blue' } );
+
+			matcher.match( el1 );
+
+			sinon.assert.calledOnceWithMatch(
+				warnStub,
+				'matcher-patterns-pattern-missing-key-or-value',
+				pattern.styles[ 0 ]
+			);
+		} );
+
 		it( 'should allow to use function as a pattern', () => {
 			const match = { name: true };
 			const pattern = element => {