"I also want my url to reflect the state of the page... It would have been great if the toggle action was implemented as a simple attribute something like toggle='element name'"

Your wishlist (state in attributes, URLs reflecting page state, anything being toggleable via simple attributes) is basically describing an architecture I've been working on called DATAOS (DOM As The Authority On State).

The core idea: instead of JS owning state and syncing to DOM, flip it. State lives in HTML attributes. JS just listens for changes and reacts. Want toggle state in the URL? The DOM attribute is the state, so serializing to URL is trivial.

It won't fix <details> being weirdly designed, but it's a pattern for building the kind of declarative, attribute-driven interactivity you're describing.

Free book and open source libraries if you are curious: https://dataos.software/book