search

sycamore-rs / sycamore

A library for creating reactive web apps in Rust and WebAssembly
https://sycamore-rs.netlify.app
MIT License
2.79k stars 148 forks source link

Bootstrap scrollspy support #646

Closed gladion136 closed 10 months ago

gladion136 commented 10 months ago

Describe the bug Bootstrap Scrollspy don't works with sycamore. The links and design works but on scrolling the current section will not be selected. Inside a raw index.html it works with the same steps.

To Reproduce Steps to reproduce the behavior:

  1. Import Bootstrap css inside header (index.html)
  2. Create a with Scrollspy from the examples: https://getbootstrap.com/docs/5.2/components/scrollspy/
  3. Import jquery and bootstrap js at the bottom of the body.

Here is a example project with this bug: https://github.com/gladion136/sycamore-bootstrap-template/tree/feat/first-draft

Expected behavior On scrolling along the page the current section should be selected inside the menu.

Environment

lukechu10 commented 10 months ago

Seems to be working for me?

https://github.com/sycamore-rs/sycamore/assets/37006668/0b5eb41d-2cd8-4ad9-a7e3-368c4dc9c635

lukechu10 commented 10 months ago

Oh, it doesn't work on Firefox but works in chromium based browsers. Seems like it's a known issue with Bootstrap: https://github.com/twbs/bootstrap/issues/6484

In any case, this isn't a bug with Sycamore since all we are doing is just rendering markup.

gladion136 commented 10 months ago

Hmm.. it doesn't works for me inside Firefox and Chromium on Linux Mint with sycamore and perseus.. When I create just a raw index.html with Bootstrap and a scrollspy it works well.. Do you have any ideas why?

lukechu10 commented 10 months ago

Are you saying it doesn't work on Chrome either? If you open up devtools and compare the markup between the two, is there any difference? Hard to believe this issue has anything to do with Sycamore since we are just rendering standard HTML and Bootstrap doesn't make any requirement as to which framework we use.