function CKEditorIntegrationTest::testAlt

Tests the EditorMediaDialog can set the alt attribute.

File

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

Class

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

Namespace

Drupal\Tests\media\FunctionalJavascript

Code

public function testAlt() {
    $page = $this->getSession()
        ->getPage();
    $assert_session = $this->assertSession();
    $this->drupalGet($this->host
        ->toUrl('edit-form'));
    $this->waitForEditor();
    $this->assignNameToCkeditorIframe();
    $this->getSession()
        ->switchToIFrame('ckeditor');
    // Test that by default no alt attribute is present on the drupal-media
    // element.
    $this->pressEditorButton('source');
    $this->assertSourceAttributeSame('alt', NULL);
    $this->leaveSourceMode();
    // Test that the preview shows the alt value from the media field's
    // alt text.
    $this->assertNotEmpty($assert_session->waitForElementVisible('css', 'drupal-media img[alt*="default alt"]'));
    $this->openMetadataDialogWithKeyPress(static::RETURN_KEY);
    // Assert that the placeholder is set to the value of the media field's
    // alt text.
    $assert_session->elementAttributeContains('named', [
        'field',
        'attributes[alt]',
    ], 'placeholder', 'default alt');
    // Fill in the alt field, submit and return to CKEditor.
    $who_is_zartan = 'Zartan is the leader of the Dreadnoks.';
    $page->fillField('attributes[alt]', $who_is_zartan);
    $this->submitDialog();
    $this->getSession()
        ->switchToIFrame('ckeditor');
    // Assert that the img within the media embed within the CKEditor contains
    // the overridden alt text set in the dialog.
    $this->assertNotEmpty($assert_session->waitForElementVisible('css', 'drupal-media img[alt*="' . $who_is_zartan . '"]'));
    // Test `aria-label` attribute appears on the widget wrapper.
    $assert_session->elementExists('css', '.cke_widget_drupalmedia[aria-label="Screaming hairy armadillo"]');
    // Test that the downcast drupal-media element now has the alt attribute
    // entered in the dialog.
    $this->pressEditorButton('source');
    $this->assertSourceAttributeSame('alt', $who_is_zartan);
    // The alt field should now display the override instead of the default.
    $this->leaveSourceMode();
    $this->openMetadataDialog();
    $assert_session->fieldValueEquals('attributes[alt]', $who_is_zartan);
    // Test the process again with a different alt text to make sure it works
    // the second time around.
    $cobra_commander_bio = 'The supreme leader of the terrorist organization Cobra';
    // Set the alt field to the new alt text.
    $page->fillField('attributes[alt]', $cobra_commander_bio);
    $this->submitDialog();
    $this->getSession()
        ->switchToIFrame('ckeditor');
    // Assert that the img within the media embed preview
    // within the CKEditor contains the overridden alt text set in the dialog.
    $this->assertNotEmpty($assert_session->waitForElementVisible('css', 'drupal-media img[alt*="' . $cobra_commander_bio . '"]'));
    // Test that the downcast drupal-media element now has the alt attribute
    // entered in the dialog.
    $this->pressEditorButton('source');
    $this->assertSourceAttributeSame('alt', $cobra_commander_bio);
    // The default value of the alt field should now display the override
    // instead of the value on the media image field.
    $this->leaveSourceMode();
    $this->openMetadataDialogWithKeyPress(static::RETURN_KEY);
    $assert_session->fieldValueEquals('attributes[alt]', $cobra_commander_bio);
    // Test that setting alt value to two double quotes will signal to the
    // MediaEmbed filter to unset the attribute on the media image field.
    // We intentionally add a space space after the two double quotes to test
    // the string is trimmed to two quotes.
    $page->fillField('attributes[alt]', '"" ');
    $this->submitDialog();
    $this->getSession()
        ->switchToIFrame('ckeditor');
    // Verify that the two double quote empty alt indicator ('""') set in
    // the dialog has successfully resulted in a media image field with the
    // alt attribute present but without a value.
    $this->assertNotEmpty($assert_session->waitForElementVisible('css', 'drupal-media img[alt=""]'));
    // Test that the downcast drupal-media element's alt attribute now has the
    // empty string indicator.
    $this->pressEditorButton('source');
    $this->assertSourceAttributeSame('alt', '""');
    // Test that setting alt to back to an empty string within the dialog will
    // restore the default alt value saved in to the media image field of the
    // media item.
    $this->leaveSourceMode();
    $this->openMetadataDialog();
    $page->fillField('attributes[alt]', '');
    $this->submitDialog();
    $this->getSession()
        ->switchToIFrame('ckeditor');
    $this->assertNotEmpty($assert_session->waitForElementVisible('css', 'drupal-media img[alt*="default alt"]'));
    // Test that the downcast drupal-media element no longer has an alt
    // attribute.
    $this->pressEditorButton('source');
    $this->assertSourceAttributeSame('alt', NULL);
}

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