Merge pull request #3810 from zyhfish/task/fix-bug-3807

Fix #3807: parsing the data attributes.
oqtane · Feb 21, 2024 · 838c299 · 838c299
2 parents 9974095 + 740b892
commit 838c299
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 13 deletions.
diff --git a/Oqtane.Client/UI/ThemeBuilder.razor b/Oqtane.Client/UI/ThemeBuilder.razor
@@ -144,6 +144,7 @@
             string integrity = "";
             string crossorigin = "";
             string type = "";
+            var dataAttributes = new Dictionary<string, string>();
             foreach (var attribute in attributes)
             {
                 if (attribute.Contains("="))
@@ -166,14 +167,20 @@
                         case "type":
                             type = value[1];
                             break;
+                        default:
+                            if(!string.IsNullOrWhiteSpace(value[0]) && value[0].StartsWith("data-"))
+                            {
+                                dataAttributes.Add(value[0], value[1]);
+                            }
+                            break;
                     }
                 }
             }
             // inject script
             if (!string.IsNullOrEmpty(src))
             {
                 src = (src.Contains("://")) ? src : PageState.Alias.BaseUrl + src;
-                scripts.Add(new { href = src, bundle = "", integrity = integrity, crossorigin = crossorigin, es6module = (type == "module"), location = location.ToString().ToLower() });
+                scripts.Add(new { href = src, bundle = "", integrity = integrity, crossorigin = crossorigin, es6module = (type == "module"), location = location.ToString().ToLower(), dataAttributes = dataAttributes });
             }
             else
             {

diff --git a/Oqtane.Server/wwwroot/js/interop.js b/Oqtane.Server/wwwroot/js/interop.js
@@ -206,18 +206,25 @@ Oqtane.Interop = {
                         returnPromise: true,
                         before: function (path, element) {
                             for (let s = 0; s < scripts.length; s++) {
-                                if (path === scripts[s].href && scripts[s].integrity !== '') {
-                                    element.integrity = scripts[s].integrity;
-                                }
-                                if (path === scripts[s].href && scripts[s].crossorigin !== '') {
-                                    element.crossOrigin = scripts[s].crossorigin;
-                                }
-                                if (path === scripts[s].href && scripts[s].es6module === true) {
-                                    element.type = "module";
-                                }
-                                if (path === scripts[s].href && scripts[s].location === 'body') {
-                                    document.body.appendChild(element);
-                                    return false;  // return false to bypass default DOM insertion mechanism
+                                if (path === scripts[s].href) {
+                                    if (scripts[s].integrity !== '') {
+                                        element.integrity = scripts[s].integrity;
+                                    }
+                                    if (scripts[s].crossorigin !== '') {
+                                        element.crossOrigin = scripts[s].crossorigin;
+                                    }
+                                    if (scripts[s].es6module === true) {
+                                        element.type = "module";
+                                    }
+                                    if (typeof scripts[s].dataAttributes !== "undefined" && scripts[s].dataAttributes !== null) {
+                                        for (var key in scripts[s].dataAttributes) {
+                                            element.setAttribute(key, scripts[s].dataAttributes[key]);
+                                        }
+                                    }
+                                    if (scripts[s].location === 'body') {
+                                        document.body.appendChild(element);
+                                        return false;  // return false to bypass default DOM insertion mechanism
+                                    }
                                 }
                             }
                         }