function CKEditor5AllowedTagsTest::testImgAddedViaUploadPlugin

Tests that the img tag is added after enabling image uploads.

File

core/modules/ckeditor5/tests/src/FunctionalJavascript/CKEditor5AllowedTagsTest.php, line 169

Class

CKEditor5AllowedTagsTest

Tests for CKEditor 5.

Namespace

Code

public function testImgAddedViaUploadPlugin() {
    $page = $this->getSession()
        ->getPage();
    $assert_session = $this->assertSession();
    $this->createNewTextFormat($page, $assert_session);
    $assert_session->assertWaitOnAjaxRequest();
    $allowed_html_field = $assert_session->fieldExists('filters[filter_html][settings][allowed_html]');
    $this->assertTrue($allowed_html_field->hasAttribute('readonly'));
    // Allowed tags are currently the default, with no <img>.
    $this->assertEquals($this->allowedElements, $allowed_html_field->getValue());
    // The image upload settings form should not be present.
    $assert_session->elementNotExists('css', '[data-drupal-selector="edit-editor-settings-plugins-ckeditor5-imageupload"]');
    $this->assertNotEmpty($assert_session->waitForElement('css', '.ckeditor5-toolbar-item-drupalInsertImage'));
    $this->triggerKeyUp('.ckeditor5-toolbar-item-drupalInsertImage', 'ArrowDown');
    $assert_session->assertWaitOnAjaxRequest();
    // The image upload settings form should now be present.
    $assert_session->elementExists('css', '[data-drupal-selector="edit-editor-settings-plugins-ckeditor5-image"]');
    $this->assertNotEmpty($assert_session->waitForElement('css', '.ckeditor5-toolbar-active .ckeditor5-toolbar-item-drupalInsertImage'));
    // The image insert plugin is enabled and inserting <img> is allowed.
    $this->assertEquals($this->allowedElements . ' <img src alt height width>', $allowed_html_field->getValue());
    $page->clickLink('Image');
    $assert_session->waitForText('Enable image uploads');
    $this->assertTrue($page->hasUncheckedField('editor[settings][plugins][ckeditor5_image][status]'));
    $page->checkField('editor[settings][plugins][ckeditor5_image][status]');
    $assert_session->assertWaitOnAjaxRequest();
    // Enabling image uploads adds <img> with several attributes to allowed
    // tags.
    $this->assertEquals($this->allowedElements . ' <img src alt height width data-entity-uuid data-entity-type>', $allowed_html_field->getValue());
    // Also enabling the caption filter will add the data-caption attribute to
    // <img>.
    $this->assertTrue($page->hasUncheckedField('filters[filter_caption][status]'));
    $page->checkField('filters[filter_caption][status]');
    $assert_session->assertWaitOnAjaxRequest();
    $this->assertEquals($this->allowedElements . ' <img src alt height width data-entity-uuid data-entity-type data-caption>', $allowed_html_field->getValue());
    // Also enabling the alignment filter will add the data-align attribute to
    // <img>.
    $this->assertTrue($page->hasUncheckedField('filters[filter_align][status]'));
    $page->checkField('filters[filter_align][status]');
    $assert_session->assertWaitOnAjaxRequest();
    $this->assertEquals($this->allowedElements . ' <img src alt height width data-entity-uuid data-entity-type data-caption data-align>', $allowed_html_field->getValue());
    // Disable image upload.
    $page->clickLink('Image');
    $assert_session->waitForText('Enable image uploads');
    $this->assertTrue($page->hasCheckedField('editor[settings][plugins][ckeditor5_image][status]'));
    $page->uncheckField('editor[settings][plugins][ckeditor5_image][status]');
    $assert_session->assertWaitOnAjaxRequest();
    // The image insert is still allowed when image uploads are disabled.
    $this->assertEquals($this->allowedElements . ' <img src alt height width data-caption data-align>', $allowed_html_field->getValue());
    $this->assertNotEmpty($assert_session->waitForElement('css', '.ckeditor5-toolbar-item-drupalInsertImage'));
    $this->triggerKeyUp('.ckeditor5-toolbar-item-drupalInsertImage', 'ArrowUp');
    $assert_session->assertWaitOnAjaxRequest();
    // Confirm <img> is no longer an allowed tag, once image insert is disabled.
    $this->assertEquals($this->allowedElements, $allowed_html_field->getValue());
}