Fix snippet that extends schema of img/table.

ckeditor · Oct 11, 2019 · 093aa9a · 093aa9a
1 parent 613bf3c
commit 093aa9a
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 19 deletions.
diff --git a/docs/_snippets/framework/extending-content-custom-figure-attributes.js b/docs/_snippets/framework/extending-content-custom-figure-attributes.js
@@ -11,15 +11,18 @@ import { CS_CONFIG } from '@ckeditor/ckeditor5-cloud-services/tests/_utils/cloud
  * Plugin that converts custom attributes for elements that are wrapped in <figure> in the view.
  */
 function CustomFigureAttributes( editor ) {
-	// Define on which elements the CSS classes should be preserved:
-	setupCustomClassConversion( 'img', 'image', editor );
-	setupCustomClassConversion( 'table', 'table', editor );
-
-	editor.conversion.for( 'upcast' ).add( upcastCustomClasses( 'figure' ), { priority: 'low' } );
-
-	// Define custom attributes that should be preserved.
-	setupCustomAttributeConversion( 'img', 'image', 'id', editor );
-	setupCustomAttributeConversion( 'table', 'table', 'id', editor );
+	// Schema extending must be done in the “afterInit()” call because plugins define their schema in “init()“.
+	this.afterInit = () => {
+		// Define on which elements the CSS classes should be preserved:
+		setupCustomClassConversion( 'img', 'image', editor );
+		setupCustomClassConversion( 'table', 'table', editor );
+
+		editor.conversion.for( 'upcast' ).add( upcastCustomClasses( 'figure' ), { priority: 'low' } );
+
+		// Define custom attributes that should be preserved.
+		setupCustomAttributeConversion( 'img', 'image', 'id', editor );
+		setupCustomAttributeConversion( 'table', 'table', 'id', editor );
+	};
 }
 
 /**

diff --git a/docs/framework/guides/deep-dive/conversion-preserving-custom-content.md b/docs/framework/guides/deep-dive/conversion-preserving-custom-content.md
@@ -291,15 +291,18 @@ The sample below is extensible. To add your own attributes to preserve, just add
  * Plugin that converts custom attributes for elements that are wrapped in <figure> in the view.
  */
 function CustomFigureAttributes( editor ) {
-	// Define on which elements the CSS classes should be preserved:
-	setupCustomClassConversion( 'img', 'image', editor );
-	setupCustomClassConversion( 'table', 'table', editor );
-
-	editor.conversion.for( 'upcast' ).add( upcastCustomClasses( 'figure' ), { priority: 'low' } );
-
-	// Define custom attributes that should be preserved.
-	setupCustomAttributeConversion( 'img', 'image', 'id', editor );
-	setupCustomAttributeConversion( 'table', 'table', 'id', editor );
+	// Schema extending must be done in the “afterInit()” call because plugins define their schema in “init()“.
+	this.afterInit = () => {
+		// Define on which elements the CSS classes should be preserved:
+		setupCustomClassConversion( 'img', 'image', editor );
+		setupCustomClassConversion( 'table', 'table', editor );
+
+		editor.conversion.for( 'upcast' ).add( upcastCustomClasses( 'figure' ), { priority: 'low' } );
+
+		// Define custom attributes that should be preserved.
+		setupCustomAttributeConversion( 'img', 'image', 'id', editor );
+		setupCustomAttributeConversion( 'table', 'table', 'id', editor );
+	};
 }
 
 /**
@@ -451,4 +454,4 @@ ClassicEditor
 
 ## What's next?
 
-If you would like to read more about how to extend the output of existing CKEditor 5 features, refer to the {@link framework/guides/deep-dive/conversion-extending-output Extending the editor output} guide.
+If you would like to read more about how to extend the output of existing CKEditor 5 features, refer to the {@link framework/guides/deep-dive/conversion-extending-output Extending the editor output} guide.