diff --git a/core/misc/ajax.es6.js b/core/misc/ajax.es6.js index 4cb008ff03..6bded620ca 100644 --- a/core/misc/ajax.es6.js +++ b/core/misc/ajax.es6.js @@ -1011,16 +1011,16 @@ * A optional jQuery selector string. * @param {object} [response.settings] * An optional array of settings that will be used. - * @param {number} [status] - * The XMLHttpRequest status. */ - insert: function (ajax, response, status) { + insert: function (ajax, response) { // Get information from the response. If it is not there, default to // our presets. - var $wrapper = response.selector ? $(response.selector) : $(ajax.wrapper); - var method = response.method || ajax.method; - var effect = ajax.getEffect(response); - var settings; + const $wrapper = response.selector ? $(response.selector) : $(ajax.wrapper); + const method = response.method || ajax.method; + const effect = ajax.getEffect(response); + + // Apply any settings from the returned JSON if available. + const settings = response.settings || ajax.settings || drupalSettings; // We don't know what response.data contains: it might be a string of text // without HTML, so don't rely on jQuery correctly interpreting @@ -1031,35 +1031,35 @@ // context object that includes top-level text nodes. Therefore text nodes // will be wrapped with a element. This also gives themers the // possibility to style the response. - var $newContent; + let $newContent; // We use the trimmed data to be able to detect cases when the response // has only top-level elements or comment nodes with extra whitespace // around. In that case whitespaces are removed and the response // should not be wrapped. - // For exemple: + // For example: // '
content
' is equivalent to '
content
' and // no extra wrapper will be added. - var trimedData = response.data.trim(); + const trimmedData = response.data.trim(); // List of DOM nodes contained in the response for processing. - var responseDataNodes; + let responseDataNodes; // When 'data' is empty or is only whitespace, manually create the node // array because parseHTML would return null. - if (trimedData === '') { + if (trimmedData === '') { responseDataNodes = [document.createTextNode(response.data)]; } else { - responseDataNodes = $.parseHTML(trimedData, true); + responseDataNodes = $.parseHTML(trimmedData, true); } // Check every node for it's type to decide if wrapping is necessary. - var onlyElementNodes = responseDataNodes.every(function (element) { + const onlyElementNodes = responseDataNodes.every(function (element) { return element.nodeType === Node.ELEMENT_NODE || element.nodeType === Node.COMMENT_NODE; }); - // When there are only element and/or comment nodes in the reponse, no + // When there are only element and/or comment nodes in the response, no // extra wrapping necessary. if (onlyElementNodes) { - $newContent = $(trimedData); + $newContent = $(trimmedData); } // When there are other types of top-level nodes, the response need to be // wrapped. @@ -1072,7 +1072,7 @@ else { $newContent = $('
'); } - // Use reponse.data to keep whitespace as-is. + // Use response.data to keep whitespace as-is. $newContent.html(response.data); } @@ -1083,7 +1083,6 @@ case 'replaceAll': case 'empty': case 'remove': - settings = response.settings || ajax.settings || drupalSettings; Drupal.detachBehaviors($wrapper.get(0), settings); } @@ -1097,10 +1096,11 @@ // Determine which effect to use and what content will receive the // effect, then show the new content. - if ($newContent.find('.ajax-new-content').length > 0) { - $newContent.find('.ajax-new-content').hide(); + const $ajaxNewContent = $newContent.find('.ajax-new-content'); + if ($ajaxNewContent.length) { + $ajaxNewContent.hide(); $newContent.show(); - $newContent.find('.ajax-new-content')[effect.showEffect](effect.showSpeed); + $ajaxNewContent[effect.showEffect](effect.showSpeed); } else if (effect.showEffect !== 'show') { $newContent[effect.showEffect](effect.showSpeed); @@ -1109,9 +1109,7 @@ // Attach all JavaScript behaviors to the new content, if it was // successfully added to the page, this if statement allows // `#ajax['wrapper']` to be optional. - if ($newContent.parents('html').length > 0) { - // Apply any settings from the returned JSON if available. - settings = response.settings || ajax.settings || drupalSettings; + if ($newContent.parents('html').length) { // Attach behaviors to all element nodes. $newContent.each(function () { if (this.nodeType === Node.ELEMENT_NODE) { diff --git a/core/misc/ajax.js b/core/misc/ajax.js index 5f4b69f7e6..2177c7bc71 100644 --- a/core/misc/ajax.js +++ b/core/misc/ajax.js @@ -472,22 +472,23 @@ Drupal.AjaxCommands = function () {}; Drupal.AjaxCommands.prototype = { - insert: function insert(ajax, response, status) { + insert: function insert(ajax, response) { var $wrapper = response.selector ? $(response.selector) : $(ajax.wrapper); var method = response.method || ajax.method; var effect = ajax.getEffect(response); - var settings; - var $newContent; + var settings = response.settings || ajax.settings || drupalSettings; + + var $newContent = void 0; - var trimedData = response.data.trim(); + var trimmedData = response.data.trim(); - var responseDataNodes; + var responseDataNodes = void 0; - if (trimedData === '') { + if (trimmedData === '') { responseDataNodes = [document.createTextNode(response.data)]; } else { - responseDataNodes = $.parseHTML(trimedData, true); + responseDataNodes = $.parseHTML(trimmedData, true); } var onlyElementNodes = responseDataNodes.every(function (element) { @@ -495,7 +496,7 @@ }); if (onlyElementNodes) { - $newContent = $(trimedData); + $newContent = $(trimmedData); } else { if (responseDataNodes.length === 1 || $wrapper.css('display') !== 'block') { $newContent = $(''); @@ -512,7 +513,6 @@ case 'replaceAll': case 'empty': case 'remove': - settings = response.settings || ajax.settings || drupalSettings; Drupal.detachBehaviors($wrapper.get(0), settings); } @@ -522,17 +522,16 @@ $newContent.hide(); } - if ($newContent.find('.ajax-new-content').length > 0) { - $newContent.find('.ajax-new-content').hide(); + var $ajaxNewContent = $newContent.find('.ajax-new-content'); + if ($ajaxNewContent.length) { + $ajaxNewContent.hide(); $newContent.show(); - $newContent.find('.ajax-new-content')[effect.showEffect](effect.showSpeed); + $ajaxNewContent[effect.showEffect](effect.showSpeed); } else if (effect.showEffect !== 'show') { $newContent[effect.showEffect](effect.showSpeed); } - if ($newContent.parents('html').length > 0) { - settings = response.settings || ajax.settings || drupalSettings; - + if ($newContent.parents('html').length) { $newContent.each(function () { if (this.nodeType === Node.ELEMENT_NODE) { Drupal.attachBehaviors(this, settings); diff --git a/core/modules/system/tests/modules/ajax_test/js/insert-ajax.es6.js b/core/modules/system/tests/modules/ajax_test/js/insert-ajax.es6.js index 4c5bb61749..94da75c135 100644 --- a/core/modules/system/tests/modules/ajax_test/js/insert-ajax.es6.js +++ b/core/modules/system/tests/modules/ajax_test/js/insert-ajax.es6.js @@ -8,30 +8,30 @@ 'use strict'; Drupal.behaviors.insertTest = { - attach: function (context, settings) { + attach: function (context) { $('.ajax-insert').once('ajax-insert').on('click', function (event) { event.preventDefault(); - var ajaxSettings = { + const ajaxSettings = { url: event.currentTarget.getAttribute('href'), wrapper: 'ajax-target', base: false, element: false, method: event.currentTarget.getAttribute('data-method') }; - var myAjaxObject = Drupal.ajax(ajaxSettings); + const myAjaxObject = Drupal.ajax(ajaxSettings); myAjaxObject.execute(); }); $('.ajax-insert-inline').once('ajax-insert').on('click', function (event) { event.preventDefault(); - var ajaxSettings = { + const ajaxSettings = { url: event.currentTarget.getAttribute('href'), wrapper: 'ajax-target-inline', base: false, element: false, method: event.currentTarget.getAttribute('data-method') }; - var myAjaxObject = Drupal.ajax(ajaxSettings); + const myAjaxObject = Drupal.ajax(ajaxSettings); myAjaxObject.execute(); }); diff --git a/core/modules/system/tests/modules/ajax_test/js/insert-ajax.js b/core/modules/system/tests/modules/ajax_test/js/insert-ajax.js index 9bc9b8be0a..4f8dba29ab 100644 --- a/core/modules/system/tests/modules/ajax_test/js/insert-ajax.js +++ b/core/modules/system/tests/modules/ajax_test/js/insert-ajax.js @@ -1,8 +1,7 @@ /** * DO NOT EDIT THIS FILE. -* All changes should be applied to ./modules/system/tests/modules/ajax_test/js/insert-ajax.es6.js * See the following change record for more information, -* https://www.drupal.org/node/2873849 +* https://www.drupal.org/node/2815083 * @preserve **/ @@ -10,7 +9,7 @@ 'use strict'; Drupal.behaviors.insertTest = { - attach: function attach(context, settings) { + attach: function attach(context) { $('.ajax-insert').once('ajax-insert').on('click', function (event) { event.preventDefault(); var ajaxSettings = { diff --git a/core/tests/Drupal/FunctionalJavascriptTests/Ajax/AjaxFormPageCacheTest.php b/core/tests/Drupal/FunctionalJavascriptTests/Ajax/AjaxFormPageCacheTest.php index cf56c6241b..e3e9042b3a 100644 --- a/core/tests/Drupal/FunctionalJavascriptTests/Ajax/AjaxFormPageCacheTest.php +++ b/core/tests/Drupal/FunctionalJavascriptTests/Ajax/AjaxFormPageCacheTest.php @@ -67,8 +67,8 @@ public function testSimpleAJAXFormValue() { $session->getPage()->selectFieldOption('select', 'red'); // Wait for the DOM to update. - $red_div = $this->assertSession()->waitForElement('css', "#ajax_selected_color span:contains('red')"); - $this->assertNotNull($red_div, 'DOM update: The selected color DIV is red.'); + $red_span = $this->assertSession()->waitForElement('css', "#ajax_selected_color span:contains('red')"); + $this->assertNotNull($red_span, 'DOM update: The selected color SPAN is red.'); // Confirm the operation of the UpdateBuildIdCommand. $build_id_second_ajax = $this->getFormBuildId();