function MediaTest::testDrupalMediaStyleWithClass

Same name in other branches
  1. 9 core/modules/ckeditor5/tests/src/FunctionalJavascript/MediaTest.php \Drupal\Tests\ckeditor5\FunctionalJavascript\MediaTest::testDrupalMediaStyleWithClass()
  2. 10 core/modules/ckeditor5/tests/src/FunctionalJavascript/MediaTest.php \Drupal\Tests\ckeditor5\FunctionalJavascript\MediaTest::testDrupalMediaStyleWithClass()

Tests Drupal Media Style with a CSS class.

File

core/modules/ckeditor5/tests/src/FunctionalJavascript/MediaTest.php, line 675

Class

MediaTest
@coversDefaultClass \Drupal\ckeditor5\Plugin\CKEditor5Plugin\Media @group ckeditor5 @group #slow @internal

Namespace

Drupal\Tests\ckeditor5\FunctionalJavascript

Code

public function testDrupalMediaStyleWithClass() : void {
    $editor = Editor::load('test_format');
    $editor->setSettings([
        'toolbar' => [
            'items' => [
                'heading',
                'sourceEditing',
                'simpleBox',
            ],
        ],
        'plugins' => [
            'ckeditor5_heading' => [
                'enabled_headings' => [
                    'heading1',
                ],
            ],
            'ckeditor5_sourceEditing' => [
                'allowed_tags' => [
                    '<div>',
                    '<section>',
                ],
            ],
            'media_media' => [
                'allow_view_mode_override' => TRUE,
            ],
        ],
    ]);
    $filter_format = $editor->getFilterFormat();
    $filter_format->setFilterConfig('filter_html', [
        'status' => TRUE,
        'settings' => [
            'allowed_html' => '<p> <br> <h1 class> <div class> <section class> <drupal-media data-entity-type data-entity-uuid data-align data-caption data-view-mode alt class="layercake-side">',
        ],
    ]);
    $filter_format->save();
    $editor->save();
    $this->assertSame([], array_map(function (ConstraintViolationInterface $v) {
        return (string) $v->getMessage();
    }, iterator_to_array(CKEditor5::validatePair(Editor::load('test_format'), FilterFormat::load('test_format')))));
    $assert_session = $this->assertSession();
    $page = $this->getSession()
        ->getPage();
    $this->drupalGet($this->host
        ->toUrl('edit-form'));
    $this->waitForEditor();
    $page->pressButton('Source');
    $editor_dom = $this->getEditorDataAsDom();
    $drupal_media_element = $editor_dom->getElementsByTagName('drupal-media')
        ->item(0);
    // Add `layercake-side` class which is used in `ckeditor5_test_layercake`,
    // as well as an arbitrary class to compare behavior between these.
    $drupal_media_element->setAttribute('class', 'layercake-side arbitrary-class');
    $textarea = $page->find('css', '.ck-source-editing-area > textarea');
    $textarea->setValue($editor_dom->C14N());
    $page->pressButton('Source');
    // Ensure that the `layercake-side` class is retained.
    $this->assertNotEmpty($assert_session->waitForElement('css', '.ck-widget.drupal-media.layercake-side'));
    // Ensure that the `arbitrary-class` class is removed.
    $assert_session->elementNotExists('css', '.ck-widget.drupal-media.arbitrary-class');
    $page->pressButton('Save');
    // Check that the 'content has been updated' message status appears to confirm we left the editor.
    $assert_session->waitForElementVisible('css', 'messages messages--status');
    // Ensure that the class is correct in the front end.
    $assert_session->elementExists('css', 'figure.layercake-side');
    $assert_session->elementNotExists('css', 'figure.arbitrary-class');
}

Buggy or inaccurate documentation? Please file an issue. Need support? Need help programming? Connect with the Drupal community.