diff --git a/core/modules/ckeditor/js/plugins/drupalimage/plugin.es6.js b/core/modules/ckeditor/js/plugins/drupalimage/plugin.es6.js index ac4fba4..17c361f 100644 --- a/core/modules/ckeditor/js/plugins/drupalimage/plugin.es6.js +++ b/core/modules/ckeditor/js/plugins/drupalimage/plugin.es6.js @@ -282,12 +282,14 @@ // Override image2's integration with the official CKEditor link plugin: // integrate with the drupallink plugin instead. - CKEDITOR.plugins.image2.getLinkAttributesParser = function () { - return CKEDITOR.plugins.drupallink.parseLinkAttributes; - }; - CKEDITOR.plugins.image2.getLinkAttributesGetter = function () { - return CKEDITOR.plugins.drupallink.getLinkAttributes; - }; + if (CKEDITOR.plugins.drupallink) { + CKEDITOR.plugins.image2.getLinkAttributesParser = function () { + return CKEDITOR.plugins.drupallink.parseLinkAttributes; + }; + CKEDITOR.plugins.image2.getLinkAttributesGetter = function () { + return CKEDITOR.plugins.drupallink.getLinkAttributes; + }; + } /** * Integrates the drupalimage widget with the drupallink plugin. diff --git a/core/modules/ckeditor/js/plugins/drupalimage/plugin.js b/core/modules/ckeditor/js/plugins/drupalimage/plugin.js index b1751c2..2d2be1b 100644 --- a/core/modules/ckeditor/js/plugins/drupalimage/plugin.js +++ b/core/modules/ckeditor/js/plugins/drupalimage/plugin.js @@ -197,12 +197,14 @@ } }); - CKEDITOR.plugins.image2.getLinkAttributesParser = function () { - return CKEDITOR.plugins.drupallink.parseLinkAttributes; - }; - CKEDITOR.plugins.image2.getLinkAttributesGetter = function () { - return CKEDITOR.plugins.drupallink.getLinkAttributes; - }; + if (CKEDITOR.plugins.drupallink) { + CKEDITOR.plugins.image2.getLinkAttributesParser = function () { + return CKEDITOR.plugins.drupallink.parseLinkAttributes; + }; + CKEDITOR.plugins.image2.getLinkAttributesGetter = function () { + return CKEDITOR.plugins.drupallink.getLinkAttributes; + }; + } function linkCommandIntegrator(editor) { if (!editor.plugins.drupallink) { diff --git a/core/modules/ckeditor/tests/src/FunctionalJavascript/DrupalLinkImageTest.php b/core/modules/ckeditor/tests/src/FunctionalJavascript/DrupalLinkImageTest.php new file mode 100644 index 0000000..4381c82 --- /dev/null +++ b/core/modules/ckeditor/tests/src/FunctionalJavascript/DrupalLinkImageTest.php @@ -0,0 +1,139 @@ + 'basic_html', + 'name' => 'Basic HTML', + 'weight' => 0, + ]); + $basic_html_format->save(); + + // Create the editor + $editor = Editor::create([ + 'format' => 'basic_html', + 'editor' => 'ckeditor', + 'image_upload' => [ + 'status' => TRUE, + 'scheme' => 'public', + 'directory' => 'inline-images', + 'max_size' => '', + 'max_dimensions' => [ + 'width' => NULL, + 'height' => NULL + ], + ] + ]); + $editor->save(); + + // Create a node type for testing. + $type = NodeType::create(['type' => 'page', 'name' => 'page']); + $type->save(); + node_add_body_field($type); + + $this->account = $this->drupalCreateUser([ + 'administer nodes', + 'create page content', + 'use text format basic_html', + ]); + $this->drupalLogin($this->account); + } + + /** + * Tests that a link can be applied to an inline uploaded image. + */ + public function testCreateLinkOnImage() { + $session = $this->getSession(); + $page = $session->getPage(); + $web_assert = $this->assertSession(); + + // Find a test image to upload. + $valid_images = []; + foreach ($this->getTestFiles('image') as $image) { + $regex = '/\.(' . preg_replace('/ +/', '|', 'png') . ')$/i'; + if (preg_match($regex, $image->filename)) { + $valid_images[] = $image; + } + } + + // Ensure we have at least one valid image. + $this->assertGreaterThanOrEqual(1, count($valid_images)); + + // Go to a node creation page. + $this->drupalGet('node/add/page'); + // Add the Title + $page->fillField('edit-title-0-value', 'Sample Title'); + + // Make sure any ckeditor ajax has finished. + $web_assert->assertWaitOnAjaxRequest(); + + // Press the DrupalImage button. + $this->click('.cke_button__drupalimage'); + $page->waitFor(5, function () use ($page) { + return $page->find('css', '.editor-image-dialog'); + }); + + // Attach the file and alt tag. + $file_system = $this->container->get('file_system'); + $image_path = $file_system->realpath($valid_images[0]->uri); + $page->attachFileToField('files[fid]', $image_path); + $web_assert->assertWaitOnAjaxRequest(); + $page->fillField('attributes[alt]', 'Alt text'); + $this->click('.ui-dialog-buttonset .form-submit'); + + // Make sure any ajax has finished saving the file. + $web_assert->assertWaitOnAjaxRequest(); + + // Press the Link button to wrap the image in a link + $this->click('.cke_button__drupallink'); + $page->waitFor(5, function () use ($page) { + return $page->find('css', '.editor-link-dialog'); + }); + $link = 'https://drupal.org'; + $page->fillField('attributes[href]', $link); + $this->click('.ui-dialog-buttonset .form-submit'); + + // Make sure any ajax is finished + $web_assert->assertWaitOnAjaxRequest(); + + $page->pressButton('Save'); + + $web_assert->pageTextContains('Sample Title'); + $web_assert->elementContains('css', 'a[href="' . $link . '"]', $valid_images[0]->filename); + } + +}