function CKEditorIntegrationTest::testButton

Tests using DrupalMediaLibrary button to embed media into CKEditor.

File

core/modules/media_library/tests/src/FunctionalJavascript/CKEditorIntegrationTest.php, line 214

Class

CKEditorIntegrationTest

@coversDefaultClass <a href="/api/drupal/core%21modules%21media_library%21src%21Plugin%21CKEditorPlugin%21DrupalMediaLibrary.php/class/DrupalMediaLibrary/8.9.x" title="Defines the &quot;drupalmedialibrary&quot; plugin." class="local">\Drupal\media_library\Plugin\CKEditorPlugin\DrupalMediaLibrary</a> @group media_library

Namespace

Code

public function testButton() {
    $this->drupalGet('/node/add/blog');
    $this->waitForEditor();
    $this->pressEditorButton('drupalmedialibrary');
    $assert_session = $this->assertSession();
    $page = $this->getSession()
        ->getPage();
    $this->assertNotEmpty($assert_session->waitForId('drupal-modal'));
    // Test that the order is the order set in DrupalMediaLibrary::getConfig().
    $tabs = $page->findAll('css', '.media-library-menu__link');
    $expected_tab_order = [
        'Show Image media (selected)',
        'Show Arrakis media',
    ];
    foreach ($tabs as $key => $tab) {
        $this->assertSame($expected_tab_order[$key], $tab->getText());
    }
    $assert_session->pageTextContains('0 of 1 item selected');
    $assert_session->elementExists('css', '.js-media-library-item')
        ->click();
    $assert_session->pageTextContains('1 of 1 item selected');
    $assert_session->elementExists('css', '.ui-dialog-buttonpane')
        ->pressButton('Insert selected');
    $this->assignNameToCkeditorIframe();
    $this->getSession()
        ->switchToIFrame('ckeditor');
    $this->assertNotEmpty($assert_session->waitForElementVisible('css', '.cke_widget_drupalmedia drupal-media .media'));
    // @todo Inserting media embed should enable undo.
    // @see https://www.drupal.org/project/drupal/issues/3073294
    $this->pressEditorButton('source');
    $value = $assert_session->elementExists('css', 'textarea.cke_source')
        ->getValue();
    $dom = Html::load($value);
    $xpath = new \DOMXPath($dom);
    $drupal_media = $xpath->query('//drupal-media')[0];
    $expected_attributes = [
        'data-entity-type' => 'media',
        'data-entity-uuid' => $this->media
            ->uuid(),
        'data-align' => 'center',
    ];
    foreach ($expected_attributes as $name => $expected) {
        $this->assertSame($expected, $drupal_media->getAttribute($name));
    }
    $this->pressEditorButton('source');
    // Why do we keep switching to the 'ckeditor' iframe? Because the buttons
    // are in a separate iframe from the markup, so after calling
    // ::pressEditorButton() (which switches to the button iframe), we'll need
    // to switch back to the CKEditor iframe.
    $this->assignNameToCkeditorIframe();
    $this->getSession()
        ->switchToIFrame('ckeditor');
    $this->assertNotEmpty($assert_session->waitForElementVisible('css', '.cke_widget_drupalmedia drupal-media .media'));
    $this->assertEditorButtonEnabled('undo');
    $this->pressEditorButton('undo');
    $this->getSession()
        ->switchToIFrame('ckeditor');
    $this->assertEmpty($assert_session->waitForElementVisible('css', '.cke_widget_drupalmedia drupal-media .media'));
    $this->assertEditorButtonDisabled('undo');
    $this->pressEditorButton('redo');
    $this->getSession()
        ->switchToIFrame('ckeditor');
    $this->assertNotEmpty($assert_session->waitForElementVisible('css', '.cke_widget_drupalmedia drupal-media .media'));
    $this->assertEditorButtonEnabled('undo');
}