Ck/10812 document list editing

docs/_snippets/framework/tutorials/inline-widget.js

@@ -194,8 +194,6 @@ class PlaceholderEditing extends Plugin {
 
 			const placeholderView = viewWriter.createContainerElement( 'span', {
 				class: 'placeholder'
-			}, {
-				isAllowedInsideAttributeElement: true
 			} );
 
 			// Insert the placeholder name (as a text).

docs/framework/guides/tutorials/implementing-an-inline-widget.md

@@ -361,8 +361,6 @@ export default class PlaceholderEditing extends Plugin {
 
 			const placeholderView = viewWriter.createContainerElement( 'span', {
 				class: 'placeholder'
-			}, {
-				isAllowedInsideAttributeElement: true
 			} );
 
 			// Insert the placeholder name (as a text).
@@ -944,8 +942,6 @@ class PlaceholderEditing extends Plugin {
 
 			const placeholderView = viewWriter.createContainerElement( 'span', {
 				class: 'placeholder'
-			}, {
-				isAllowedInsideAttributeElement: true
 			} );
 
 			// Insert the placeholder name (as a text).

packages/ckeditor5-block-quote/src/blockquoteediting.js

@@ -45,8 +45,7 @@ export default class BlockQuoteEditing extends Plugin {
 		editor.commands.add( 'blockQuote', new BlockQuoteCommand( editor ) );
 
 		schema.register( 'blockQuote', {
-			allowWhere: '$block',
-			allowContentOf: '$root'
+			inheritAllFrom: '$container'
 		} );
 
 		editor.conversion.elementToElement( { model: 'blockQuote', view: 'blockquote' } );

packages/ckeditor5-block-quote/tests/blockquoteediting.js

@@ -56,6 +56,14 @@ describe( 'BlockQuoteEditing', () => {
 		expect( model.schema.checkChild( [ '$root', 'blockQuote' ], 'foo' ) ).to.be.false;
 	} );
 
+	it( 'inherits attributes from $container', () => {
+		model.schema.extend( '$container', {
+			allowAttributes: 'foo'
+		} );
+
+		expect( model.schema.checkAttribute( 'blockQuote', 'foo' ) ).to.be.true;
+	} );
+
 	it( 'adds converters to the data pipeline', () => {
 		const data = '<blockquote><p>x</p></blockquote>';
 

packages/ckeditor5-code-block/package.json

@@ -27,6 +27,7 @@
     "@ckeditor/ckeditor5-editor-classic": "^32.0.0",
     "@ckeditor/ckeditor5-image": "^32.0.0",
     "@ckeditor/ckeditor5-indent": "^32.0.0",
+    "@ckeditor/ckeditor5-list": "^32.0.0",
     "@ckeditor/ckeditor5-markdown-gfm": "^32.0.0",
     "@ckeditor/ckeditor5-paragraph": "^32.0.0",
     "@ckeditor/ckeditor5-theme-lark": "^32.0.0",

packages/ckeditor5-code-block/src/codeblockediting.js

@@ -87,6 +87,7 @@ export default class CodeBlockEditing extends Plugin {
 		const schema = editor.model.schema;
 		const model = editor.model;
 		const view = editor.editing.view;
+		const isDocumentListEditingLoaded = editor.plugins.has( 'DocumentListEditing' );
 
 		const normalizedLanguagesDefs = getNormalizedAndLocalizedLanguageDefinitions( editor );
 
@@ -97,19 +98,20 @@ export default class CodeBlockEditing extends Plugin {
 		editor.commands.add( 'indentCodeBlock', new IndentCodeBlockCommand( editor ) );
 		editor.commands.add( 'outdentCodeBlock', new OutdentCodeBlockCommand( editor ) );
 
-		const getCommandExecuter = commandName => {
-			return ( data, cancel ) => {
-				const command = this.editor.commands.get( commandName );
+		this.listenTo( view.document, 'tab', ( evt, data ) => {
+			const commandName = data.shiftKey ? 'outdentCodeBlock' : 'indentCodeBlock';
+			const command = editor.commands.get( commandName );
 
-				if ( command.isEnabled ) {
-					this.editor.execute( commandName );
-					cancel();
-				}
-			};
-		};
+			if ( !command.isEnabled ) {
+				return;
+			}
 
-		editor.keystrokes.set( 'Tab', getCommandExecuter( 'indentCodeBlock' ) );
-		editor.keystrokes.set( 'Shift+Tab', getCommandExecuter( 'outdentCodeBlock' ) );
+			editor.execute( commandName );
+
+			data.stopPropagation();
+			data.preventDefault();
+			evt.stop();
+		}, { context: 'pre' } );
 
 		schema.register( 'codeBlock', {
 			allowWhere: '$block',
@@ -118,8 +120,17 @@ export default class CodeBlockEditing extends Plugin {
 			allowAttributes: [ 'language' ]
 		} );
 
+		// Allow all list* attributes on `codeBlock` (integration with DocumentList).
 		// Disallow all attributes on $text inside `codeBlock`.
-		schema.addAttributeCheck( context => {
+		schema.addAttributeCheck( ( context, attributeName ) => {
+			const isDocumentListAttributeOnCodeBlock = context.endsWith( 'codeBlock' ) &&
+				attributeName.startsWith( 'list' ) &&
+				attributeName !== 'list';
+
+			if ( isDocumentListEditingLoaded && isDocumentListAttributeOnCodeBlock ) {
+				return true;
+			}
+
 			if ( context.endsWith( 'codeBlock $text' ) ) {
 				return false;
 			}
@@ -210,7 +221,11 @@ export default class CodeBlockEditing extends Plugin {
 		const outdent = commands.get( 'outdent' );
 
 		if ( indent ) {
-			indent.registerChildCommand( commands.get( 'indentCodeBlock' ) );
+			// Priority is highest due to integration with `IndentList` command of `List` plugin.
+			// If selection is in a code block we give priority to it. This way list item cannot be indented
+			// but if we would give priority to indenting list item then user would have to indent list item
+			// as much as possible and only then he could indent code block.
+			indent.registerChildCommand( commands.get( 'indentCodeBlock' ), { priority: 'highest' } );
 		}
 
 		if ( outdent ) {

packages/ckeditor5-code-block/tests/codeblock-integration.js

@@ -9,7 +9,8 @@ import Paragraph from '@ckeditor/ckeditor5-paragraph/src/paragraph';
 import GFMDataProcessor from '@ckeditor/ckeditor5-markdown-gfm/src/gfmdataprocessor';
 import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
 import ImageInlineEditing from '@ckeditor/ckeditor5-image/src/image/imageinlineediting';
-import { getData } from '@ckeditor/ckeditor5-engine/src/dev-utils/model';
+import DocumentListEditing from '@ckeditor/ckeditor5-list/src/documentlist/documentlistediting';
+import { setData, getData } from '@ckeditor/ckeditor5-engine/src/dev-utils/model';
 
 import CodeBlockUI from '../src/codeblockui';
 import CodeBlockEditing from '../src/codeblockediting';
@@ -154,4 +155,72 @@ describe( 'CodeBlock - integration', () => {
 			expect( getData( editor.model ) ).to.equal( '<codeBlock language="cs">[]</codeBlock>' );
 		} );
 	} );
+
+	describe( 'with DocumentListEditing', () => {
+		let editor, model;
+
+		describe( 'when DocumentListEditing is loaded', () => {
+			beforeEach( async () => {
+				editor = await ClassicTestEditor
+					.create( '', {
+						plugins: [ CodeBlockEditing, DocumentListEditing, Enter, Paragraph ]
+					} );
+
+				model = editor.model;
+			} );
+
+			afterEach( async () => {
+				await editor.destroy();
+			} );
+
+			it( 'should allow all attributes starting with list* in the schema', () => {
+				setData( model, '<codeBlock language="plaintext">[]foo</codeBlock>' );
+
+				const codeBlock = model.document.getRoot().getChild( 0 );
+
+				expect( model.schema.checkAttribute( codeBlock, 'listItemId' ), 'listItemId' ).to.be.true;
+				expect( model.schema.checkAttribute( codeBlock, 'listType' ), 'listType' ).to.be.true;
+				expect( model.schema.checkAttribute( codeBlock, 'listStart' ), 'listStart' ).to.be.true;
+				expect( model.schema.checkAttribute( codeBlock, 'listFoo' ), 'listFoo' ).to.be.true;
+			} );
+
+			it( 'should disallow attributes that do not start with "list" in the schema but include the sequence', () => {
+				setData( model, '<codeBlock language="plaintext">[]foo</codeBlock>' );
+
+				const codeBlock = model.document.getRoot().getChild( 0 );
+
+				expect( model.schema.checkAttribute( codeBlock, 'list' ), 'list' ).to.be.false;
+				expect( model.schema.checkAttribute( codeBlock, 'fooList' ), 'fooList' ).to.be.false;
+				expect( model.schema.checkAttribute( codeBlock, 'alist' ), 'alist' ).to.be.false;
+				expect( model.schema.checkAttribute( codeBlock, 'alistb' ), 'alistb' ).to.be.false;
+				expect( model.schema.checkAttribute( codeBlock, 'LISTbar' ), 'LISTbar' ).to.be.false;
+			} );
+		} );
+
+		describe( 'when DocumentListEditing is not loaded', () => {
+			beforeEach( async () => {
+				editor = await ClassicTestEditor
+					.create( '', {
+						plugins: [ CodeBlockEditing, Enter, Paragraph ]
+					} );
+
+				model = editor.model;
+			} );
+
+			afterEach( async () => {
+				await editor.destroy();
+			} );
+
+			it( 'should disallow all attributes starting with list* in the schema', () => {
+				setData( model, '<codeBlock language="plaintext">[]foo</codeBlock>' );
+
+				const codeBlock = model.document.getRoot().getChild( 0 );
+
+				expect( model.schema.checkAttribute( codeBlock, 'listItemId' ), 'listItemId' ).to.be.false;
+				expect( model.schema.checkAttribute( codeBlock, 'listType' ), 'listType' ).to.be.false;
+				expect( model.schema.checkAttribute( codeBlock, 'listStart' ), 'listStart' ).to.be.false;
+				expect( model.schema.checkAttribute( codeBlock, 'listFoo' ), 'listFoo' ).to.be.false;
+			} );
+		} );
+	} );
 } );