8000 [WebProfilerBundle] Fix event delegation on links inside toggles · symfony/symfony@241597d · GitHub
[go: up one dir, main page]

Skip to content

Commit 241597d

Browse files
committed
[WebProfilerBundle] Fix event delegation on links inside toggles
1 parent c2cc75d commit 241597d

File tree

2 files changed

+12
-35
lines changed

2 files changed

+12
-35
lines changed

src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/base_js.html.twig

+6-11
Original file line numberDiff line numberDiff line change
@@ -122,16 +122,19 @@
122122
}
123123
124124
toggle.addEventListener('click', (e) => {
125+
const toggle = e.currentTarget;
126+
127+
if (e.target.closest('a, .sf-toggle') !== toggle) {
128+
return;
129+
}
130+
125131
e.preventDefault();
126132
127133
if ('' !== window.getSelection().toString()) {
128134
/* Don't do anything on text selection */
129135
return;
130136
}
131137
132-
/* needed because when the toggle contains HTML contents, user can click */
133-
/* on any of those elements instead of their parent '.sf-toggle' element */
134-
const toggle = e.target.closest('.sf-toggle');
135138
const element = document.querySelector(toggle.getAttribute('data-toggle-selector'));
136139
137140
toggle.classList.toggle('sf-toggle-on');
@@ -154,14 +157,6 @@
154157
toggle.innerHTML = currentContent !== altContent ? altContent : originalContent;
155158
});
156159
157-
/* Prevents from disallowing clicks on links inside toggles */
158-
const toggleLinks = toggle.querySelectorAll('a');
159-
toggleLinks.forEach((toggleLink) => {
160-
toggleLink.addEventListener('click', (e) => {
161-
e.stopPropagation();
162-
});
163-
});
164-
165160
toggle.setAttribute('data-processed', 'true');
166161
});
167162
}

src/Symfony/Component/ErrorHandler/Resources/assets/js/exception.js

+6-24
Original file line numberDiff line numberDiff line change
@@ -145,19 +145,17 @@
145145
}
146146

147147
addEventListener(toggles[i], 'click', function(e) {
148-
e.preventDefault();
148+
var toggle = e.currentTarget;
149149

150-
if ('' !== window.getSelection().toString()) {
151-
/* Don't do anything on text selection */
150+
if (e.target.closest('a, span[data-clipboard-text], .sf-toggle') !== toggle) {
152151
return;
153152
}
154153

155-
var toggle = e.target || e.srcElement;
154+
e.preventDefault();
156155

157-
/* needed because when the toggle contains HTML contents, user can click */
158-
/* on any of those elements instead of their parent '.sf-toggle' element */
159-
while (!hasClass(toggle, 'sf-toggle')) {
160-
toggle = toggle.parentNode;
156+
if ('' !== window.getSelection().toString()) {
157+
/* Don't do anything on text selection */
158+
return;
161159
}
162160

163161
var element = document.querySelector(toggle.getAttribute('data-toggle-selector'));
@@ -182,22 +180,6 @@
182180
toggle.innerHTML = currentContent !== altContent ? altContent : originalContent;
183181
});
184182

185-
/* Prevents from disallowing clicks on links inside toggles */
186-
var toggleLinks = toggles[i].querySelectorAll('a');
187-
for (var j = 0; j < toggleLinks.length; j++) {
188-
addEventListener(toggleLinks[j], 'click', function(e) {
189-
e.stopPropagation();
190-
});
191-
}
192-
193-
/* Prevents from disallowing clicks on "copy to clipboard" elements inside toggles */
194-
var copyToClipboardElements = toggles[i].querySelectorAll('span[data-clipboard-text]');
195-
for (var k = 0; k < copyToClipboardElements.length; k++) {
196-
addEventListener(copyToClipboardElements[k], 'click', function(e) {
197-
e.stopPropagation();
198-
});
199-
}
200-
201183
toggles[i].setAttribute('data-processed', 'true');
202184
}
203185
})();

0 commit comments

Comments
 (0)
0