Closed dfmelicor closed 6 years ago
I cannot reproduce this in quasar play app, but often experience it in my project. Can't tell why this happens, maybe js errors.
Somehow, toggleInProgress
prop left with true
value and nothing happens then. Changing it to false
doesn't help.
It seems I've managed to reproduce bug in browser (chrome & ff).
After that modal becomes not closable.
Yes, that somehow related to history. Modal is not necessary to be maximized. I have one case that's 100% reproducible on dev server, but doesn't occur on production build. May be vue-devtool for chrome is connected to this issue
It also could be reproduced in the dev
server of the dev
branch:
I can reproduce something similar, dunno if it's intended.
And so on and so forth, seems like each time you do that you get +1 History and you need to click +1 times for a new modal to close.
@igorgo Same issue here
Interesting that, for me at least, refreshing the page (on Chrome, haven't tested ff) does not help. In other words, for me in the dev environment the following steps could be added:
I would also note that clicking the mysterious forward nav button after closing the modal has the same effect as refreshing the page (i.e. subsequent modals can't be closed).
Don't have time to dig into this further at the moment, but seems to me the issue arises where the modalId is checked in line 184 of QModal.vue. I think the flow goes like this:
I imagine something similar must be happening with browser refresh rather than clicking the forward nav button.
The same thing appears to also be happening with Dialogs and ActionSheets. They cannot be closed, either with the esc key or through code.
Actually, I've noticed the doco mentions this issue:
During development open/close might not be triggered because of HMR. Best would be before updating source files to close the Modal. This way HMR will correctly do its job. In production this scenario can’t happen, so no bugs for final product.
Having said that, I'm not sure what it means we should do to fix it in development. We should close the dialog on the destroy method?
Don’t think the entire issue is due to HMR since the quasar docs desktop examples have the same behavior (though maybe not after page refresh - need to check that).
@zagreusinoz have you found a development fix for this yet? Its really really annoying to constantly refresh the page to close a modal.
Fixed in future v0.15 already. Closing this. Please be patient. Sorry for the inconvenience.
I was able to work around this issue by setting the toggleInProgress to false on the nextTick. No idea if there are any side-effects or will work in all circumstances.
this.$refs.modal.close()
this.$nextTick(() => {
this.$refs.modal.toggleInProgress = false
})
@rettigd Thanks for that, it solved my modal close problem on Chrome!
[Update] Wait... nope. Not yet. It worked once. [Update] It seems to be intermittent, but still definitely better than it was
Just ran into this myself, found the same workaround except it was the active
property that needed deferred changing. Not sure if it's related however I saw this issue when emitting an event from within a custom component contained within the q-modal, the listener hook in the parent is doing the dialog toggling. Here is my workaround in the parent emit listener (just different prop than above)
this.$nextTick(() => {
this.$refs.theModal.active = false;
this.$refs.theModal.toggleInProgress = false;
});
I can reproduce something similar in production(Quasar: 0.14.4). Here is my work to fix this.
// in main.js
import { Platform } from 'quasar'
Platform.has.popstate = false
@Cheese-Yu Thanks for that,it works!
Software version
Quasar: 0.14.4 OS: Windows 7 Node: 4.2.4 NPM: 2.14.12 Browsers: Chrome 61.0.3163.91 64 Bit iOS: Android: Any other software related to your bug:
What did you get as the error?
There is an un-handled case where modal cannot be closed
What were you expecting?
Modal should be closed when one of the configured events are triggered
What steps did you take, to get the error?
This can be replicated in the quasar play app. http://quasar-framework.org/quasar-play/android/index.html#/showcase/popups/modal
Steps:
The modal opened in step 3 cannot be closed.