From 6c275e5e74750e6712c0a4d7d51056a0b51d5376 Mon Sep 17 00:00:00 2001 From: Kevin Brown Date: Wed, 24 Apr 2019 00:16:18 -0400 Subject: [PATCH] Force the data-* attributes to be parsed There was a change made that switched us from using `$.data` and `$.fn.data` internally to using an internal data store (managed through internal utilities). This had the unfortunate side effect of breaking the automatic loading of data-* options in versions of jQuery other than 1.x, which included anything that would be considered modern jQuery. While the change was made and approved in good faith, all of the tests passed and the docs pages appeared to be working, the tests really failed when running on newer versions of jQuery. This was confirmed when we started running automated tests against both versions, which confirmed the bug that others have been seeing for a while. The change was made becuase calling `$.fn.data` on an element which contains a reference to itself in the internal jQuery data cache would cause a stack overflow. This bug was well documented at the following GitHub ticket and was resolved by no longer using `$.fn.data`: https://github.com/select2/select2/issues/4014 Unfortunately because `$.fn.data` was no longer being called in a way such that all of the data attributes would be dumped out, we needed to find a replacement. The substitute that was given in the original bug fix worked when the data cache was fully primed, but we never primed it anywhere so it actually failed in the general case. That meant we needed to find a way to manually prime it, which is exactly what this change does. --- src/js/select2/options.js | 33 ++++++++++++++++++++++++++++----- 1 file changed, 28 insertions(+), 5 deletions(-) diff --git a/src/js/select2/options.js b/src/js/select2/options.js index d667c4f137..8e0dc07efe 100644 --- a/src/js/select2/options.js +++ b/src/js/select2/options.js @@ -79,20 +79,43 @@ define([ $e.attr('ajax--url', Utils.GetData($e[0], 'ajaxUrl')); Utils.StoreData($e[0], 'ajax-Url', Utils.GetData($e[0], 'ajaxUrl')); - } var dataset = {}; + function upperCaseLetter(_, letter) { + return letter.toUpperCase(); + } + + // Pre-load all of the attributes which are prefixed with `data-` + for (var attr = 0; attr < $e[0].attributes.length; attr++) { + var attributeName = $e[0].attributes[attr].name; + var prefix = 'data-'; + + if (attributeName.substr(0, prefix.length) == prefix) { + // Get the contents of the attribute after `data-` + var dataName = attributeName.substring(prefix.length); + + // Get the data contents from the consistent source + // This is more than likely the jQuery data helper + var dataValue = Utils.GetData($e[0], dataName); + + // camelCase the attribute name to match the spec + var camelDataName = dataName.replace(/-([a-z])/g, upperCaseLetter); + + // Store the data attribute contents into the dataset since + dataset[camelDataName] = dataValue; + } + } + // Prefer the element's `dataset` attribute if it exists // jQuery 1.x does not correctly handle data attributes with multiple dashes if ($.fn.jquery && $.fn.jquery.substr(0, 2) == '1.' && $e[0].dataset) { - dataset = $.extend(true, {}, $e[0].dataset, Utils.GetData($e[0])); - } else { - dataset = Utils.GetData($e[0]); + dataset = $.extend(true, {}, $e[0].dataset, dataset); } - var data = $.extend(true, {}, dataset); + // Prefer our internal data cache if it exists + var data = $.extend(true, {}, Utils.GetData($e[0]), dataset); data = Utils._convertData(data);