{"action":"created","issue":{"url":"https://api.github.com/repos/twbs/bootstrap/issues/21727","repository_url":"https://api.github.com/repos/twbs/bootstrap","labels_url":"https://api.github.com/repos/twbs/bootstrap/issues/21727/labels{/name}","comments_url":"https://api.github.com/repos/twbs/bootstrap/issues/21727/comments","events_url":"https://api.github.com/repos/twbs/bootstrap/issues/21727/events","html_url":"https://github.com/twbs/bootstrap/issues/21727","id":200834773,"number":21727,"title":"JS components throws console error \"Error: <Component> is transitioning\"","user":{"login":"vanduynslagerp","id":3250552,"avatar_url":"https://avatars.githubusercontent.com/u/3250552?v=3","gravatar_id":"","url":"https://api.github.com/users/vanduynslagerp","html_url":"https://github.com/vanduynslagerp","followers_url":"https://api.github.com/users/vanduynslagerp/followers","following_url":"https://api.github.com/users/vanduynslagerp/following{/other_user}","gists_url":"https://api.github.com/users/vanduynslagerp/gists{/gist_id}","starred_url":"https://api.github.com/users/vanduynslagerp/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/vanduynslagerp/subscriptions","organizations_url":"https://api.github.com/users/vanduynslagerp/orgs","repos_url":"https://api.github.com/users/vanduynslagerp/repos","events_url":"https://api.github.com/users/vanduynslagerp/events{/privacy}","received_events_url":"https://api.github.com/users/vanduynslagerp/received_events","type":"User","site_admin":false},"labels":[{"id":143643,"url":"https://api.github.com/repos/twbs/bootstrap/labels/js","name":"js","color":"ffc40d","default":false},{"id":250176882,"url":"https://api.github.com/repos/twbs/bootstrap/labels/v4","name":"v4","color":"563d7c","default":false}],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2017-01-14T22:48:08Z","updated_at":"2017-01-15T00:50:42Z","closed_at":null,"body":"Following the feature request #17800, the PR #17823 has been merged.\r\nIt prompted several issues with the error message `Error: <Component> is transitioning` in the browser console of the user.\r\n\r\n**This ticket aims at centralizing those issues, gather feedback and discuss a possible solution.**\r\n\r\nHere is the issues found so far:\r\n- Moving cursor over popover quickly (#21600)\r\n- Tooltip inside modals prevent to close the modal (#21607)\r\n- User quickly triggering a component (collapse, carousel, popover etc...) animation by clicking fast on a button fast (#21704)\r\n\r\nThe issue #21687 has also been reported but it's not directly related. See [comment](https://github.com/twbs/bootstrap/issues/21687#issuecomment-272657301)\r\n\r\nThe original feature request and PR attempt to warn the user when he call the component API repeatedly instead of waiting for and even before making the next call. \r\nEven though this behavior is expected and documented. See [comment](https://github.com/twbs/bootstrap/issues/17796#issuecomment-145944908)\r\nIt worth noting that the previous behavior (skip the call if it's transitioning) is quite common and most framework works this way and expect the developer to understand the notion of asynchronous.\r\n\r\nUnfortunately, with the current implementation (#17823) it seems we have inadvertently  created more problems than we solved... In addition we have added some complexity to the code, and it seems difficult to anticipate all the potential problem that will be found.\r\n\r\nHere is a few solutions I can think of.\r\n\r\n#### 1 - Revert #17823 and improve the documentation by adding a clear warning on each transition-capable module page and add more examples of events handling\r\n- (+) Remove the added complexity\r\n- (+) Work similarly to other framework that deal with asynchronous methods\r\n- (+) Avoid any future issues along the lines of (#21600, #21607, #21704)\r\n- (-) Even with a big warning on each module page in the docs, we might still have tickets like #17796\r\n\r\n#### 2 - Improve #17823 to throw an exception only when the call has been made from the API (and not from a trigger element)\r\n- (+) Solve #17800 and avoid tickets like #17796\r\n- (-) Keep the added complexity\r\n- (-) Might still create unexpected issues in cases where we mix API call and element trigger\r\n- (-) Might still create unexpected \"module interaction\" issues like in #21607\r\n\r\n**Feel free to propose and discuss other potential solutions.**\r\n\r\nMy hunch is that solution 1 (revert and document) might be better. The problem we try to solve is related to developers who do not read the docs or understand asynchronous functions. It feels like this issue is better solved by improved documentation, especially when the \"code solution\" create issues for the end user.\r\nAnd I think the doc can be improved in that regard.\r\nThe problem I see with the \"code solution\" is that it will either create a constant source of bugs or become extremely complicated in order to handle every possible case. Not mentioning that it would make adding new modules/feature more complicated.\r\n\r\nI'd love to hear the community and bootstrap team ideas/feedback/opinion."},"comment":{"url":"https://api.github.com/repos/twbs/bootstrap/issues/comments/272665124","html_url":"https://github.com/twbs/bootstrap/issues/21727#issuecomment-272665124","issue_url":"https://api.github.com/repos/twbs/bootstrap/issues/21727","id":272665124,"user":{"login":"METACEO","id":13586713,"avatar_url":"https://avatars.githubusercontent.com/u/13586713?v=3","gravatar_id":"","url":"https://api.github.com/users/METACEO","html_url":"https://github.com/METACEO","followers_url":"https://api.github.com/users/METACEO/followers","following_url":"https://api.github.com/users/METACEO/following{/other_user}","gists_url":"https://api.github.com/users/METACEO/gists{/gist_id}","starred_url":"https://api.github.com/users/METACEO/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/METACEO/subscriptions","organizations_url":"https://api.github.com/users/METACEO/orgs","repos_url":"https://api.github.com/users/METACEO/repos","events_url":"https://api.github.com/users/METACEO/events{/privacy}","received_events_url":"https://api.github.com/users/METACEO/received_events","type":"User","site_admin":false},"created_at":"2017-01-15T00:50:42Z","updated_at":"2017-01-15T00:50:42Z","body":"Thanks @vanduynslagerp - I've considered making such an issue as yours, as we've seem to have found a pattern of issues here.\r\n\r\nI've been absent in my issue (#21600) but I've been working towards a fix for myself (my approach is along your first solution - I'm reverting a lot of #17823 with good luck so far.) I believe this added complexity is preventing parent-stack execution and in some cases (#21600) is breaking the user interface - a critical problem for a UX/UI library.\r\n\r\nI don't think we need to put any warnings in the documentation because mid-transitions should be, and could be, handled by Bootstrap internally. If a developer calls code inefficiently (#17796) then they should still get what they expect. I'm still familiarizing myself with v4's current source code, but it will be possible to gracefully handle back-to-back transitions. Luckily we're in alpha, right?\r\n\r\nThanks again for consolidating all of our issues with yours!"}}
{"actor":{"display_login":"METACEO"}}