Search for the custom navigation control buttons in the swiper-container

[Ashkanph]

Check that this is really a bug

• I confirm

Reproduction link

https://codesandbox.io/p/sandbox/sn7mfn

Bug description

If there are more than one Swiper custom element with custom navigation buttons (for example in the container-end slot), if they use the same CSS selectors for their navigation buttons, clicking on one of the buttons swipes both sliders.

This can be solved by using different CSS selectors for the buttons, but in version 9 there was no need to have different CSS selectors; because the custom buttons were part of swiper.el, but in versions >= 10 the custom buttons are no longer descendants of swiper.el, they are descendants of swiper.hostEl.

Expected Behavior

There is no need to have different CSS selectors for the custom navigation buttons of the Swiper custom elements on a page.

Actual Behavior

No response

Swiper version

11.1.12

Platform/Target and Browser Versions

All of the platforms

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

[Ashkanph]

Is the following change acceptable to the maintainers as a solution?

master...Ashkanph:swiper:fix_navigation_getel

[nolimits4web]

Is the following change acceptable to the maintainers as a solution?

master...Ashkanph:swiper:fix_navigation_getel

Yes, PR is welcome

[nolimits4web]

Fixed by #7716