bug: breadcrumbs are not reactive

[tetkosimi]

Prerequisites

• I have read the Contributing Guidelines.
• I agree to follow the Code of Conduct.
• I have searched for existing issues that already report this problem, without success.

Ionic Framework Version

• v4.x
• v5.x
• v6.x

Current Behavior

ion-breadcrumbs properties are not updating when new ion-breadcrumb have been added or removed.

Expected Behavior

Watch for children changes to maintain expected active breadcrumb number and last property.

Steps to Reproduce

1. Add new ion-breadcrumb to ion-breadcrumbs.

Code Reproduction URL

No response

Ionic Info

No response

Additional Information

No response

[liamdebeasi]

Thanks for the issue. Could you please reproduce this issue in an Ionic app and provide a link to the repo?

[tetkosimi]

Hi, sure!
https://github.com/tetkosimi/bug-ionic-breadcrumbs

[liamdebeasi]

Thanks! Looks like ion-breadcrumbs is not reactive at the moment. I think we may go in a different direction for this fix as this should work without a MutationObserver, but I need to do some exploration on this.

[sean-perkins]

Looks like we could possibly use onSlotChange on the slot in ion-breadcrumbs to reset active breadcrumb/re-init breadcrumbs. I'm a little uncertain in the caniuse chart; as Chrome states not supported, but definitely is.

[ionitron-bot]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.