function MediaTest::testDrupalMediaStyleWithClass

Same name and namespace in other branches
  1. 9 core/modules/ckeditor5/tests/src/FunctionalJavascript/MediaTest.php \Drupal\Tests\ckeditor5\FunctionalJavascript\MediaTest::testDrupalMediaStyleWithClass()
  2. 11.x 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 672

Class

MediaTest
@coversDefaultClass \Drupal\ckeditor5\Plugin\CKEditor5Plugin\Media[[api-linebreak]] @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 (ConstraintViolation $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.