Add support for default <slot> children in elementChildren utility

[seperez-ncl]

Check that this is really a bug

• I confirm

Reproduction link

https://codesandbox.io/p/sandbox/swiper-default-forked-h9vftd

Bug description

Currently, the elementChildren function in swiper/shared/utils.mjs does not handle HTMLSlotElement children in a way that fetches their assignedElements() when the slot is default (no name). This can cause issues when using Swiper inside Web Components that rely on default slotted children.

Proposed Fix
Below is a suggested update to the elementChildren function so it checks:

If element itself is a slot, then use element.assignedElements() instead of element.children.
For any child that is a default slot (child instanceof HTMLSlotElement && !child.name), push its assigned elements into the array.

function elementChildren(element, selector = '') {
  // If the 'element' is a slot, take its assigned elements,
  // otherwise just get its children
  let children;
  if (element instanceof HTMLSlotElement) {
    children = [...element.assignedElements()];
  } else {
    children = [...element.children];
  }

  // If any of those children is a default slot, also push its assigned elements
  const processedChildren = children.reduce((acc, child) => {
    if (child instanceof HTMLSlotElement && !child.name) {
      acc.push(...child.assignedElements());
    } else {
      acc.push(child);
    }
    return acc;
  }, []);

  if (selector) {
    return processedChildren.filter(el => el.matches(selector));
  }

  return processedChildren;
}

Expected Behavior

When using Swiper inside a Web Component that projects its “slides” through a default (unnamed) slot, the internal function (e.g., elementChildren) is expected to detect and use the slotted nodes as valid slides. This would allow any .swiper-slide elements placed inside the default slot to appear and work correctly in the Swiper carousel.

Actual Behavior

Currently, if you place .swiper-slide elements in a default slot of a Web Component, Swiper does not detect them at all. As a result, the carousel either appears empty or fails to include those slotted slides.

Swiper version

11.2.1

Platform/Target and Browser Versions

macOs/Chrome

Validations

• Follow our Code of Conduct
• Read the docs.
• Check that there isn't already an issue that request the same feature to avoid creating a duplicate.
• Make sure this is a Swiper issue and not a framework-specific issue

Would you like to open a PR for this bug?

• I'm willing to open a PR