Comments (4)
Hi @oleh-selivanov, I can definitely look into it but I would kindly need you to create a reproduction on Stackblitz.
from vue-collapsed.
No problem, gonna share it today
from vue-collapsed.
So here is the demo cc @smastrom
https://stackblitz.com/edit/vitejs-vite-ehwszu?file=src%2FApp.vue
from vue-collapsed.
Hi @oleh-selivanov, sorry for getting back now but I've been a bit more busy than usual and thank you for providing the reproduction.
I played a bit with it and yeah, overflow: hidden
on a direct child causes the scrollHeight
property of the parent (Collapse) to always be equal to 0 even multiple frames after removing display: none
from it. That's why the collapse is not expanding nor collapsing as its "expanded" height is expected to be 0.
While I'm still not sure why those DOM APIs acts like this when this occurs, I figured that since this is a very edge case caused by the content (and not by the package) and that it can easily be worked-around (by setting a specific height on the direct child and then overflow: hidden
on the next child, for example), I won't implement any hacky solution in vue-collapsed itself that takes care of this. This won't be fair for all the people that uses this package daily and would also push a bit too far its scope.
However, what I can do and will do in the PR I'm merging is that everytime this occurs, vue-collapsed will force the expansion of the collapse container (without playing any transition) so that nobody will ever get stuck in a situation like yours and will actually be able to see the content, edit and test it.
Thank you again for raising the issue and I'll hope you'll keep enjoying this package! Cheers!
from vue-collapsed.
Related Issues (15)
- Horizontal Collapse HOT 1
- Error when build with vue-tsc HOT 6
- Does not work for iOS HOT 7
- [BUG] Sometimes it stays in mode "expanding" HOT 2
- SSR problem: layout shift HOT 1
- Not animations in Firefox 124 HOT 3
- When section is expanded, overflow: hidden (among other differences) is added in Firefox but not Chrome HOT 2
- Collapse transition never finishing for custom zoom of the page HOT 4
- Initial Collapse stuck on 'expanding' HOT 7
- Default collapse animation not working anymore on chrome HOT 1
- Is it possible to only half-collapse an element? HOT 1
- Named export 'Collapse' not found. HOT 5
- Suggest changing `.collapse` to `.v-collapse` in the exemple HOT 1
- use vue's events instead of binding callbacks HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from vue-collapsed.