fix: #3578477 CKEditor 5 should respect <textarea disabled> dynamically (58b9d70d) · Commits · project / drupal

core/modules/ckeditor5/js/ckeditor5.js

+12 −3

Original line number	Diff line number	Diff line
		@@ -428,9 +428,18 @@
		}

		// If the textarea is disabled, enable CKEditor's read-only mode.
		if (element.hasAttribute('disabled')) {
		const readOnlyIfDisabled = () => {
		if (element.disabled) {
		editor.enableReadOnlyMode('ckeditor5_disabled');
		} else {
		editor.disableReadOnlyMode('ckeditor5_disabled');
		}
		};
		const disabledMutationObserver = new MutationObserver(() => {
		readOnlyIfDisabled();
		});
		disabledMutationObserver.observe(element, { attributes: true });
		readOnlyIfDisabled();

		// Integrate CKEditor 5 viewport offset with Drupal displace.
		// @see \Drupal\Tests\ckeditor5\FunctionalJavascript\CKEditor5ToolbarTest

core/modules/ckeditor5/tests/modules/ckeditor5_read_only_mode/src/Hook/Ckeditor5ReadOnlyModeHooks.php

+11 −0

Original line number	Diff line number	Diff line
		@@ -19,6 +19,17 @@ class Ckeditor5ReadOnlyModeHooks {
		public function formNodePageFormAlter(array &$form, FormStateInterface $form_state, string $form_id) : void {
		$form['body']['#disabled'] = \Drupal::state()->get('ckeditor5_read_only_mode_body_enabled', FALSE);
		$form['field_second_ckeditor5_field']['#disabled'] = \Drupal::state()->get('ckeditor5_read_only_mode_second_ckeditor5_field_enabled', FALSE);
		$form['field_ckeditor5_disable']['#states'] = [
		'disabled' => [
		':input[name="field_ckeditor5_toggle[value]"]' => ['checked' => TRUE],
		],
		];
		$form['field_ckeditor5_enable']['#disabled'] = TRUE;
		$form['field_ckeditor5_enable']['#states'] = [
		'enabled' => [
		':input[name="field_ckeditor5_toggle[value]"]' => ['checked' => TRUE],
		],
		];
		}

		}

core/modules/ckeditor5/tests/src/FunctionalJavascript/CKEditor5ReadOnlyModeTest.php

+57 −6

Original line number	Diff line number	Diff line
		@@ -30,10 +30,42 @@ class CKEditor5ReadOnlyModeTest extends CKEditor5TestBase {
		*/
		protected function setUp(): void {
		parent::setUp();
		$this->createCkeditorField('field_second_ckeditor5_field', 'Second CKEditor5 field');
		$this->createCkeditorField('field_ckeditor5_disable', 'CKEditor5 field which is disabled on toggle');
		$this->createCkeditorField('field_ckeditor5_enable', 'CKEditor5 field which is enabled on toggle');
		$this->createField('field_ckeditor5_toggle', 'CKEditor5 Toggle', 'boolean', 'boolean_checkbox');
		$this->addNewTextFormat();
		}

		/**
		* Create a CKEditor 5 field on the page node.
		*
		* @param string $field_name
		* The name of the field.
		* @param string $field_label
		* The label for the field.
		*/
		protected function createCkeditorField(string $field_name, string $field_label): void {
		$this->createField($field_name, $field_label, 'text_long', 'text_textarea');
		}

		/**
		* Create a field on the page node.
		*
		* @param string $field_name
		* The name of the field.
		* @param string $field_label
		* The label for the field.
		* @param string $field_type
		* The type of the field.
		* @param string $field_widget
		* The widget for the field.
		*/
		protected function createField(string $field_name, string $field_label, string $field_type, string $field_widget): void {
		$field_storage = FieldStorageConfig::create([
		'field_name' => 'field_second_ckeditor5_field',
		'field_name' => $field_name,
		'entity_type' => 'node',
		'type' => 'text_long',
		'type' => $field_type,
		'cardinality' => 1,
		]);
		$field_storage->save();
		@@ -42,12 +74,12 @@ protected function setUp(): void {
		FieldConfig::create([
		'field_storage' => $field_storage,
		'bundle' => 'page',
		'label' => 'Second CKEditor5 field',
		'label' => $field_label,
		])->save();
		$this->container->get('entity_display.repository')
		->getFormDisplay('node', 'page')
		->setComponent('field_second_ckeditor5_field', [
		'type' => 'text_textarea',
		->setComponent($field_name, [
		'type' => $field_widget,
		])
		->save();
		}
		@@ -57,7 +89,6 @@ protected function setUp(): void {
		*/
		public function testReadOnlyMode(): void {
		$assert_session = $this->assertSession();
		$this->addNewTextFormat();

		// Check that both CKEditor 5 fields are editable.
		$this->drupalGet('node/add');
		@@ -79,4 +110,24 @@ public function testReadOnlyMode(): void {
		$assert_session->elementAttributeContains('css', '.field--name-field-second-ckeditor5-field .ck-editor .ck-content', 'contenteditable', 'false');
		}

		/**
		* Test that the CKEditor 5 read-only mode is set dynamically.
		*/
		public function testReadOnlyModeDynamic(): void {
		$this->drupalGet('node/add');

		$this->assertSession()->elementAttributeContains('css', '.field--name-field-ckeditor5-disable .ck-editor .ck-content', 'contenteditable', 'true');
		$this->assertSession()->elementAttributeContains('css', '.field--name-field-ckeditor5-enable .ck-editor .ck-content', 'contenteditable', 'false');

		$this->getSession()->getPage()->checkField('field_ckeditor5_toggle[value]');

		$this->assertSession()->elementAttributeContains('css', '.field--name-field-ckeditor5-disable .ck-editor .ck-content', 'contenteditable', 'false');
		$this->assertSession()->elementAttributeContains('css', '.field--name-field-ckeditor5-enable .ck-editor .ck-content', 'contenteditable', 'true');

		$this->getSession()->getPage()->uncheckField('field_ckeditor5_toggle[value]');

		$this->assertSession()->elementAttributeContains('css', '.field--name-field-ckeditor5-disable .ck-editor .ck-content', 'contenteditable', 'true');
		$this->assertSession()->elementAttributeContains('css', '.field--name-field-ckeditor5-enable .ck-editor .ck-content', 'contenteditable', 'false');
		}

		}

core/profiles/demo_umami/tests/src/FunctionalJavascript/AssetAggregationAcrossPagesTest.php

+1 −1

Original line number	Diff line number	Diff line
		@@ -109,7 +109,7 @@ protected function doTestNodeAddPagesAuthor(): void {
		}, 'umamiNodeAddEditor');
		$expected = [
		'ScriptCount' => 15,
		'ScriptBytes' => 3804493,
		'ScriptBytes' => 3805189,
		'StylesheetCount' => 8,
		'StylesheetBytes' => 619086,
		];