function MediaTest::testLinkability

Tests linkability of the CKEditor widget.

@dataProvider linkabilityProvider

File

core/modules/ckeditor/tests/src/FunctionalJavascript/MediaTest.php, line 857

Class

MediaTest

@coversDefaultClass \Drupal\ckeditor\Plugin\CKEditorPlugin\DrupalMedia[[api-linebreak]] @group ckeditor @group legacy

Namespace

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();
    /** @var \Drupal\Core\File\FileUrlGeneratorInterface $file_url_generator */
    $file_url_generator = \Drupal::service('file_url_generator');
    $src = $file_url_generator->generateString($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"]');
  }
}