Skip to content

Commit

Permalink
Revert workaround for popper glitch, fix regression
Browse files Browse the repository at this point in the history
Revert the workaround that existed to dodge popper.js glitch where the
popover appeared in the wrong position first and a few milliseconds
later in the right place.

This fixes a regression where the regular Popover wasn't working any
more.

Signed-off-by: Vincent Petry <[email protected]>
  • Loading branch information
PVince81 committed Jan 26, 2021
1 parent d077b9b commit 57584fd
Showing 1 changed file with 1 addition and 38 deletions.
39 changes: 1 addition & 38 deletions src/components/Popover/Popover.vue
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,7 @@ With a `<button>` as a trigger:
<template>
<VPopover
v-bind="$attrs"
:popover-base-class="doShowMenu ? 'popover' : 'popover popover__hidden'"
popover-base-class="popover"
popover-wrapper-class="popover__wrapper"
popover-arrow-class="popover__arrow"
popover-inner-class="popover__inner"
Expand All @@ -74,34 +74,6 @@ export default {
components: {
VPopover,
},
props: {
open: {
type: Boolean,
default: false,
},
},
data() {
return {
doShowMenu: false,
}
},
watch: {
open(newValue) {
if (newValue === true) {
// show with delay to allow position calculation to happen for dynamic contents,
// otherwise the popover will appear in the wrong place first and be visible,
// and then in the next tick it repositions itself
// Note: we can't use this.$nextTick here as it happens too early before
// v-tooltip's position calculation happens
window.setTimeout(() => {
this.doShowMenu = newValue
}, 2)
} else {
this.doShowMenu = false
}
},
},
}
</script>

Expand All @@ -114,15 +86,6 @@ $arrow-width: 10px;
filter: drop-shadow(0 1px 10px var(--color-box-shadow));
&__hidden {
/* same as visibility-hidden but keep the size to avoid resizes on show */
/* !important is here to override inline styles set by v-tooltip for initial show */
visibility: hidden !important;
left: -10000px !important;
top: auto !important;
transform: transform3d(-10000, -10000, 0) !important;
}
&__inner {
padding: 0;
color: var(--color-main-text);
Expand Down

0 comments on commit 57584fd

Please sign in to comment.