You are here

public function CKEditorIntegrationTest::testLinkability in Drupal 8

Same name and namespace in other branches
  1. 9 core/modules/media/tests/src/FunctionalJavascript/CKEditorIntegrationTest.php \Drupal\Tests\media\FunctionalJavascript\CKEditorIntegrationTest::testLinkability()

Tests linkability of the CKEditor widget.

@dataProvider linkabilityProvider

File

core/modules/media/tests/src/FunctionalJavascript/CKEditorIntegrationTest.php, line 841

Class

CKEditorIntegrationTest
@coversDefaultClass \Drupal\media\Plugin\CKEditorPlugin\DrupalMedia @group media

Namespace

Drupal\Tests\media\FunctionalJavascript

Code

public function testLinkability($drupalimage_is_enabled) {
  if (!$drupalimage_is_enabled) {

    // Remove the `drupalimage` plugin's `DrupalImage` button.
    $editor = Editor::load('test_format');
    $settings = $editor
      ->getSettings();
    $rows = $settings['toolbar']['rows'];
    foreach ($rows as $row_key => $row) {
      foreach ($row as $group_key => $group) {
        foreach ($group['items'] as $item_key => $item) {
          if ($item === 'DrupalImage') {
            unset($settings['toolbar']['rows'][$row_key][$group_key]['items'][$item_key]);
          }
        }
      }
    }
    $editor
      ->setSettings($settings);
    $editor
      ->save();
  }
  $this->host->body->value .= '<p>The pirate is irate.</p><p>';
  if ($drupalimage_is_enabled) {

    // Add an image with a link wrapped around it.
    $uri = $this->media->field_media_image->entity
      ->getFileUri();
    $src = file_url_transform_relative(file_create_url($uri));
    $this->host->body->value .= '<a href="http://www.drupal.org/association"><img alt="drupalimage test image" data-entity-type="" data-entity-uuid="" src="' . $src . '" /></a></p>';
  }
  $this->host
    ->save();
  $this
    ->drupalGet($this->host
    ->toUrl('edit-form'));
  $this
    ->waitForEditor();
  $this
    ->assignNameToCkeditorIframe();
  $this
    ->getSession()
    ->switchToIFrame('ckeditor');
  $assert_session = $this
    ->assertSession();

  // Select the CKEditor Widget.
  $drupalmedia = $assert_session
    ->waitForElementVisible('css', 'drupal-media');
  $this
    ->assertNotEmpty($drupalmedia);
  $drupalmedia
    ->click();

  // While the CKEditor Widget is selected, assert the context menu does not
  // contain link-related context menu items.
  $this
    ->openContextMenu();
  $this
    ->assignNameToCkeditorPanelIframe();
  $this
    ->getSession()
    ->switchToIFrame('panel');
  $this
    ->assertContextMenuItemNotExists('Edit Link');
  $this
    ->assertContextMenuItemNotExists('Unlink');
  $this
    ->closeContextMenu();

  // While the CKEditor Widget is selected, click the "link" button.
  $this
    ->pressEditorButton('drupallink');
  $assert_session
    ->waitForId('drupal-modal');

  // Enter a link in the link dialog and save.
  $field = $assert_session
    ->waitForElementVisible('xpath', '//input[@name="attributes[href]"]');
  $this
    ->assertNotEmpty($field);
  $field
    ->setValue('https://www.drupal.org');
  $assert_session
    ->elementExists('css', 'button.form-submit')
    ->press();
  $this
    ->getSession()
    ->switchToIFrame('ckeditor');
  $link = $assert_session
    ->waitForElementVisible('css', 'a[href="https://www.drupal.org"]');
  $this
    ->assertNotEmpty($link);

  // Select the CKEditor Widget again and assert the context menu now does
  // contain link-related context menu items.
  $drupalmedia = $assert_session
    ->waitForElementVisible('css', 'drupal-media');
  $this
    ->assertNotEmpty($drupalmedia);
  $drupalmedia
    ->click();
  $this
    ->openContextMenu();
  $this
    ->getSession()
    ->switchToIFrame('panel');
  $this
    ->assertContextMenuItemExists('Edit Link');
  $this
    ->assertContextMenuItemExists('Unlink');
  $this
    ->closeContextMenu();

  // Save the entity.
  $this
    ->getSession()
    ->switchToIFrame();
  $assert_session
    ->buttonExists('Save')
    ->press();

  // Verify the saved entity when viewed also contains the linked media.
  $assert_session
    ->elementExists('css', 'figure > a[href="https://www.drupal.org"] > .media--type-image > .field--type-image > img[src*="image-test.png"]');

  // Test that `drupallink` also still works independently: inserting a link
  // is possible.
  $this
    ->drupalGet($this->host
    ->toUrl('edit-form'));
  $this
    ->waitForEditor();
  $this
    ->pressEditorButton('drupallink');
  $assert_session
    ->waitForId('drupal-modal');
  $field = $assert_session
    ->waitForElementVisible('xpath', '//input[@name="attributes[href]"]');
  $this
    ->assertNotEmpty($field);
  $field
    ->setValue('https://wikipedia.org');
  $assert_session
    ->elementExists('css', 'button.form-submit')
    ->press();
  $this
    ->assignNameToCkeditorIframe();
  $this
    ->getSession()
    ->switchToIFrame('ckeditor');
  $link = $assert_session
    ->waitForElementVisible('css', 'body > a[href="https://wikipedia.org"]');
  $this
    ->assertNotEmpty($link);
  $assert_session
    ->elementExists('css', 'body > .cke_widget_drupalmedia > drupal-media > figure > a[href="https://www.drupal.org"]');

  // Select the CKEditor Widget again and assert the `drupalunlink` button is
  // enabled. Also assert the context menu again contains link-related context
  // menu items.
  $drupalmedia = $assert_session
    ->waitForElementVisible('css', 'drupal-media');
  $this
    ->assertNotEmpty($drupalmedia);
  $drupalmedia
    ->click();
  $this
    ->openContextMenu();
  $this
    ->getSession()
    ->switchToIFrame();
  $this
    ->assertEditorButtonEnabled('drupalunlink');
  $this
    ->assignNameToCkeditorPanelIframe();
  $this
    ->getSession()
    ->switchToIFrame('panel');
  $this
    ->assertContextMenuItemExists('Edit Link');
  $this
    ->assertContextMenuItemExists('Unlink');

  // Test that moving focus to another element causes the `drupalunlink`
  // button to become disabled and causes link-related context menu items to
  // disappear.
  $this
    ->getSession()
    ->switchToIFrame();
  $this
    ->getSession()
    ->switchToIFrame('ckeditor');
  $p = $assert_session
    ->waitForElementVisible('xpath', "//p[contains(text(), 'The pirate is irate')]");
  $this
    ->assertNotEmpty($p);
  $p
    ->click();
  $this
    ->assertEditorButtonDisabled('drupalunlink');
  $this
    ->getSession()
    ->switchToIFrame('panel');
  $this
    ->assertContextMenuItemExists('Edit Link');
  $this
    ->assertContextMenuItemExists('Unlink');

  // To switch from the context menu iframe ("panel") back to the CKEditor
  // iframe, we first have to reset to top frame.
  $this
    ->getSession()
    ->switchToIFrame();
  $this
    ->getSession()
    ->switchToIFrame('ckeditor');

  // Test that moving focus to the `drupalimage` CKEditor Widget enables the
  // `drupalunlink` button again, because it is a linked image.
  if ($drupalimage_is_enabled) {
    $drupalimage = $assert_session
      ->waitForElementVisible('xpath', '//img[@alt="drupalimage test image"]');
    $this
      ->assertNotEmpty($drupalimage);
    $drupalimage
      ->click();
    $this
      ->assertEditorButtonEnabled('drupalunlink');
    $this
      ->getSession()
      ->switchToIFrame('panel');
    $this
      ->assertContextMenuItemExists('Edit Link');
    $this
      ->assertContextMenuItemExists('Unlink');
    $this
      ->getSession()
      ->switchToIFrame();
    $this
      ->getSession()
      ->switchToIFrame('ckeditor');
  }

  // Tests the `drupalunlink` button for the `drupalmedia` CKEditor Widget.
  $drupalmedia
    ->click();
  $this
    ->assertEditorButtonEnabled('drupalunlink');
  $this
    ->getSession()
    ->switchToIFrame('panel');
  $this
    ->assertContextMenuItemExists('Edit Link');
  $this
    ->assertContextMenuItemExists('Unlink');
  $this
    ->pressEditorButton('drupalunlink');
  $this
    ->assertEditorButtonDisabled('drupalunlink');
  $this
    ->getSession()
    ->switchToIFrame('ckeditor');
  $assert_session
    ->elementNotExists('css', 'figure > a[href="https://www.drupal.org"] > .media--type-image > .field--type-image > img[src*="image-test.png"]');
  $assert_session
    ->elementExists('css', 'figure .media--type-image > .field--type-image > img[src*="image-test.png"]');
  if ($drupalimage_is_enabled) {

    // Tests the `drupalunlink` button for the `drupalimage` CKEditor Widget.
    $drupalimage
      ->click();
    $this
      ->assertEditorButtonEnabled('drupalunlink');
    $this
      ->pressEditorButton('drupalunlink');
    $this
      ->assertEditorButtonDisabled('drupalunlink');
    $this
      ->getSession()
      ->switchToIFrame('ckeditor');
    $assert_session
      ->elementNotExists('css', 'p > a[href="https://www.drupal.org/association"] > img[src*="image-test.png"]');
    $assert_session
      ->elementExists('css', 'p > img[src*="image-test.png"]');
  }
}