This commit is contained in:
Cory LaViska
2025-08-20 17:15:56 -04:00
parent fe31121c15
commit 1fa25dc4f0
2 changed files with 22 additions and 17 deletions

View File

@@ -7,9 +7,10 @@ import { WaAfterShowEvent } from '../../events/after-show.js';
import { WaHideEvent } from '../../events/hide.js';
import { WaShowEvent } from '../../events/show.js';
import { animate, parseDuration } from '../../internal/animate.js';
import { getTargetElement, waitForEvent } from '../../internal/event.js';
import { waitForEvent } from '../../internal/event.js';
import { watch } from '../../internal/watch.js';
import WebAwesomeElement from '../../internal/webawesome-element.js';
import { WebAwesomeFormAssociatedElement } from '../../internal/webawesome-form-associated-element.js';
import { LocalizeController } from '../../utilities/localize.js';
import '../icon/icon.js';
import styles from './details.css';
@@ -112,9 +113,27 @@ export default class WaDetails extends WebAwesomeElement {
}
private handleSummaryClick(event: MouseEvent) {
let targetElement = getTargetElement(event);
const eventPath = event.composedPath() as HTMLElement[];
if (targetElement?.closest('a, button, wa-button, input, wa-input, textarea, wa-textarea, select, wa-select')) {
// Check if any element in the path is interactive
const hasInteractiveElement = eventPath.some(element => {
if (!(element instanceof HTMLElement)) return false;
// Check native interactive elements
const tagName = element.tagName?.toLowerCase();
if (['a', 'button', 'input', 'textarea', 'select'].includes(tagName)) {
return true;
}
// Check for Web Awesome form controls
if (element instanceof WebAwesomeFormAssociatedElement) {
return !('disabled' in element) || !element.disabled;
}
return false;
});
if (hasInteractiveElement) {
// Let interactive elements handle their own clicks, fixes #309
return;
}

View File

@@ -11,17 +11,3 @@ export function waitForEvent(el: HTMLElement, eventName: string) {
el.addEventListener(eventName, done);
});
}
export function getTargetElement(event: Event) {
if (event.target instanceof Node) {
switch (event.target.nodeType) {
case Node.TEXT_NODE:
case Node.COMMENT_NODE:
return event.target.parentNode as Element;
case Node.ELEMENT_NODE:
return event.target as Element;
}
}
return null;
}