#12357 fix(VCarousel): incorrect transition direction when using touch

Open Albert Kaaman nekosaur
Coverage Reach
components/VCalendar/mixins/calendar-with-events.ts components/VCalendar/mixins/calendar-with-intervals.ts components/VCalendar/mixins/calendar-base.ts components/VCalendar/mixins/times.ts components/VCalendar/mixins/mouse.ts components/VCalendar/util/timestamp.ts components/VCalendar/util/props.ts components/VCalendar/util/events.ts components/VCalendar/modes/stack.ts components/VCalendar/modes/common.ts components/VCalendar/modes/column.ts components/VCalendar/modes/index.ts components/VCalendar/VCalendar.ts components/VCalendar/VCalendarDaily.ts components/VCalendar/VCalendarWeekly.ts components/VCalendar/VCalendarCategory.ts components/VCalendar/VCalendarMonthly.ts components/VCalendar/index.ts components/VSelect/VSelect.ts components/VSelect/VSelectList.ts components/VSelect/index.ts components/VDatePicker/VDatePicker.ts components/VDatePicker/mixins/date-picker-table.ts components/VDatePicker/util/createNativeLocaleFormatter.ts components/VDatePicker/util/pad.ts components/VDatePicker/util/eventHelpers.ts components/VDatePicker/util/index.ts components/VDatePicker/util/monthChange.ts components/VDatePicker/util/isDateAllowed.ts components/VDatePicker/VDatePickerDateTable.ts components/VDatePicker/VDatePickerHeader.ts components/VDatePicker/VDatePickerYears.ts components/VDatePicker/VDatePickerTitle.ts components/VDatePicker/VDatePickerMonthTable.ts components/VDatePicker/index.ts components/VDataTable/VDataTable.ts components/VDataTable/VDataTableHeaderDesktop.ts components/VDataTable/VVirtualTable.ts components/VDataTable/VEditDialog.ts components/VDataTable/VDataTableHeaderMobile.ts components/VDataTable/MobileRow.ts components/VDataTable/Row.ts components/VDataTable/VSimpleTable.ts components/VDataTable/mixins/header.ts components/VDataTable/VDataTableHeader.ts components/VDataTable/RowGroup.ts components/VDataTable/index.ts components/VTimePicker/VTimePicker.ts components/VTimePicker/VTimePickerClock.ts components/VTimePicker/VTimePickerTitle.ts components/VTimePicker/index.ts components/VTimePicker/SelectingTimes.ts components/VTreeview/VTreeview.ts components/VTreeview/VTreeviewNode.ts components/VTreeview/util/filterTreeItems.ts components/VTreeview/index.ts components/VSlider/VSlider.ts components/VSlider/index.ts components/VColorPicker/util/index.ts components/VColorPicker/VColorPickerEdit.ts components/VColorPicker/VColorPickerCanvas.ts components/VColorPicker/VColorPicker.ts components/VColorPicker/VColorPickerSwatches.ts components/VColorPicker/VColorPickerPreview.ts components/VColorPicker/index.ts components/VTextField/VTextField.ts components/VTextField/index.ts components/VNavigationDrawer/VNavigationDrawer.ts components/VNavigationDrawer/index.ts components/VAutocomplete/VAutocomplete.ts components/VAutocomplete/index.ts components/VMenu/VMenu.ts components/VMenu/index.ts components/VTabs/VTabs.ts components/VTabs/VTab.ts components/VTabs/VTabsBar.ts components/VTabs/VTabsItems.ts components/VTabs/index.ts components/VTabs/VTabItem.ts components/VTabs/VTabsSlider.ts components/VData/VData.ts components/VData/index.ts components/VSparkline/VSparkline.ts components/VSparkline/helpers/core.ts components/VSparkline/helpers/path.ts components/VSparkline/helpers/math.ts components/VSparkline/index.ts components/VList/VListGroup.ts components/VList/VListItem.ts components/VList/VList.ts components/VList/index.ts components/VList/VListItemGroup.ts components/VList/VListItemAvatar.ts components/VList/VListItemAction.ts components/VList/VListItemIcon.ts components/VDataIterator/VDataIterator.ts components/VDataIterator/VDataFooter.ts components/VDataIterator/index.ts components/VDialog/VDialog.ts components/VDialog/index.ts components/VWindow/VWindow.ts components/VWindow/VWindowItem.ts components/VWindow/index.ts components/VStepper/VStepperContent.ts components/VStepper/VStepper.ts components/VStepper/VStepperStep.ts components/VStepper/index.ts components/VGrid/VCol.ts components/VGrid/VRow.ts components/VGrid/VContainer.ts components/VGrid/grid.ts components/VGrid/index.ts components/VGrid/VFlex.ts components/VGrid/VSpacer.ts components/VGrid/VLayout.ts components/VSlideGroup/VSlideGroup.ts components/VSlideGroup/index.ts components/VSlideGroup/VSlideItem.ts components/VItemGroup/VItemGroup.ts components/VItemGroup/VItem.ts components/VItemGroup/index.ts components/VAppBar/VAppBar.ts components/VAppBar/VAppBarNavIcon.ts components/VAppBar/index.ts components/VIcon/VIcon.ts components/VIcon/index.ts components/VInput/VInput.ts components/VInput/index.ts components/VCombobox/VCombobox.ts components/VCombobox/index.ts components/VFileInput/VFileInput.ts components/VFileInput/index.ts components/VImg/VImg.ts components/VImg/index.ts components/VExpansionPanel/VExpansionPanelHeader.ts components/VExpansionPanel/VExpansionPanel.ts components/VExpansionPanel/VExpansionPanelContent.ts components/VExpansionPanel/VExpansionPanels.ts components/VExpansionPanel/index.ts components/VRangeSlider/VRangeSlider.ts components/VRangeSlider/index.ts components/VRadioGroup/VRadio.ts components/VRadioGroup/VRadioGroup.ts components/VRadioGroup/index.ts components/VTooltip/VTooltip.ts components/VTooltip/index.ts components/VRating/VRating.ts components/VRating/index.ts components/transitions/expand-transition.ts components/transitions/createTransition.ts components/transitions/index.ts components/VAlert/VAlert.ts components/VAlert/index.ts components/VPagination/VPagination.ts components/VPagination/index.ts components/VProgressLinear/VProgressLinear.ts components/VProgressLinear/index.ts components/VCarousel/VCarousel.ts components/VCarousel/VCarouselItem.ts components/VCarousel/index.ts components/index.ts components/VBadge/VBadge.ts components/VBadge/index.ts components/VSnackbar/VSnackbar.ts components/VSnackbar/index.ts components/VBtn/VBtn.ts components/VBtn/index.ts components/VCheckbox/VCheckbox.ts components/VCheckbox/VSimpleCheckbox.ts components/VCheckbox/index.ts components/VSkeletonLoader/VSkeletonLoader.ts components/VSkeletonLoader/index.ts components/VToolbar/VToolbar.ts components/VToolbar/index.ts components/VChip/VChip.ts components/VChip/index.ts components/VForm/VForm.ts components/VForm/index.ts components/VOverflowBtn/VOverflowBtn.ts components/VOverflowBtn/index.ts components/VBanner/VBanner.ts components/VBanner/index.ts components/VFooter/VFooter.ts components/VFooter/index.ts components/VTimeline/VTimelineItem.ts components/VTimeline/VTimeline.ts components/VTimeline/index.ts components/VBottomNavigation/VBottomNavigation.ts components/VBottomNavigation/index.ts components/VSwitch/VSwitch.ts components/VSwitch/index.ts components/VProgressCircular/VProgressCircular.ts components/VProgressCircular/index.ts components/VTextarea/VTextarea.ts components/VTextarea/index.ts components/VBreadcrumbs/VBreadcrumbs.ts components/VBreadcrumbs/VBreadcrumbsItem.ts components/VBreadcrumbs/index.ts components/VBreadcrumbs/VBreadcrumbsDivider.ts components/VVirtualScroll/VVirtualScroll.ts components/VVirtualScroll/index.ts components/VCard/VCard.ts components/VCard/index.ts components/VSpeedDial/VSpeedDial.ts components/VSpeedDial/index.ts components/VParallax/VParallax.ts components/VParallax/index.ts components/VHover/VHover.ts components/VHover/index.ts components/VPicker/VPicker.ts components/VPicker/index.ts components/VSystemBar/VSystemBar.ts components/VSystemBar/index.ts components/VLazy/VLazy.ts components/VLazy/index.ts components/VOverlay/VOverlay.ts components/VOverlay/index.ts components/VResponsive/VResponsive.ts components/VResponsive/index.ts components/VSheet/VSheet.ts components/VSheet/index.ts components/VChipGroup/VChipGroup.ts components/VChipGroup/index.ts components/VMessages/VMessages.ts components/VMessages/index.ts components/VAvatar/VAvatar.ts components/VAvatar/index.ts components/VApp/VApp.ts components/VApp/index.ts components/VBtnToggle/VBtnToggle.ts components/VBtnToggle/index.ts components/VLabel/VLabel.ts components/VLabel/index.ts components/VCounter/VCounter.ts components/VCounter/index.ts components/VMain/VMain.ts components/VMain/index.ts components/VContent/VContent.ts components/VContent/index.ts components/VThemeProvider/VThemeProvider.ts components/VThemeProvider/index.ts components/VDivider/VDivider.ts components/VDivider/index.ts components/VSubheader/VSubheader.ts components/VSubheader/index.ts components/VBottomSheet/VBottomSheet.ts components/VBottomSheet/index.ts mixins/menuable/index.ts mixins/validatable/index.ts mixins/overlayable/index.ts mixins/activatable/index.ts mixins/selectable/index.ts mixins/detachable/index.ts mixins/routable/index.ts mixins/themeable/index.ts mixins/dependent/index.ts mixins/scrollable/index.ts mixins/groupable/index.ts mixins/applicationable/index.ts mixins/proxyable/index.ts mixins/translatable/index.ts mixins/picker/index.ts mixins/colorable/index.ts mixins/mobile/index.ts mixins/stackable/index.ts mixins/intersectable/index.ts mixins/measurable/index.ts mixins/roundable/index.ts mixins/toggleable/index.ts mixins/picker-button/index.ts mixins/registrable/index.ts mixins/binds-attrs/index.ts mixins/bootable/index.ts mixins/delayable/index.ts mixins/returnable/index.ts mixins/sizeable/index.ts mixins/rippleable/index.ts mixins/loadable/index.ts mixins/elevatable/index.ts mixins/positionable/index.ts mixins/ssr-bootable/index.ts mixins/button-group/index.ts mixins/localable/index.ts mixins/comparable/index.ts mixins/filterable/index.ts mixins/transitionable/index.ts util/helpers.ts util/colorUtils.ts util/mergeData.ts util/console.ts util/color/transformSRGB.ts util/color/transformCIELAB.ts util/dateTimeUtils.ts util/colors.ts util/dedupeModelListeners.ts util/rebuildFunctionalSlots.ts util/mixins.ts util/component.ts services/theme/index.ts services/theme/utils.ts services/breakpoint/index.ts services/goto/index.ts services/goto/util.ts services/goto/easing-patterns.ts services/lang/index.ts services/icons/presets/fa-svg.ts services/icons/presets/index.ts services/icons/presets/fa.ts services/icons/presets/mdi-svg.ts services/icons/presets/md.ts services/icons/presets/fa4.ts services/icons/presets/mdi.ts services/icons/index.ts services/application/index.ts services/presets/index.ts services/index.ts services/service/index.ts directives/ripple/index.ts directives/touch/index.ts directives/color/index.ts directives/click-outside/index.ts directives/intersect/index.ts directives/mutate/index.ts directives/scroll/index.ts directives/resize/index.ts directives/index.ts locale/index.ts locale/cs.ts locale/uk.ts locale/no.ts locale/hr.ts locale/lt.ts locale/sv.ts locale/sk.ts locale/he.ts locale/et.ts locale/id.ts locale/el.ts locale/de.ts locale/es.ts locale/hu.ts locale/tr.ts locale/it.ts locale/sl.ts locale/ro.ts locale/fr.ts locale/zh-Hans.ts locale/th.ts locale/sr-Cyrl.ts locale/ru.ts locale/nl.ts locale/pl.ts locale/ar.ts locale/pt.ts locale/lv.ts locale/fa.ts locale/fi.ts locale/en.ts locale/ja.ts locale/af.ts locale/ca.ts locale/zh-Hant.ts locale/ko.ts install.ts framework.ts index.ts presets/default/index.ts entry-lib.ts

No flags found

Use flags to group coverage reports by test type, project and/or folders.
Then setup custom commit statuses and notifications for each flag.

e.g., #unittest #integration

#production #enterprise

#frontend #backend

Learn more about Codecov Flags here.


@@ -157,7 +157,7 @@
Loading
157 157
          mandatory: this.mandatory,
158 158
        },
159 159
        on: {
160 -
          change: (val: any) => {
160 +
          change: (val: unknown) => {
161 161
            this.internalValue = val
162 162
          },
163 163
        },

@@ -44,10 +44,7 @@
Loading
44 44
      type: [Boolean, String],
45 45
      default: '$prev',
46 46
    },
47 -
    reverse: {
48 -
      type: Boolean,
49 -
      default: undefined,
50 -
    },
47 +
    reverse: Boolean,
51 48
    showArrows: Boolean,
52 49
    showArrowsOnHover: Boolean,
53 50
    touch: Object as PropType<TouchHandlers>,
@@ -60,7 +57,6 @@
Loading
60 57
61 58
  data () {
62 59
    return {
63 -
      changedByDelimiters: false,
64 60
      internalHeight: undefined as undefined | string, // This can be fixed by child class.
65 61
      transitionHeight: undefined as undefined | string, // Intermediate height during transition.
66 62
      transitionCount: 0, // Number of windows in transition state.
@@ -83,7 +79,7 @@
Loading
83 79
      if (!this.isBooted) return ''
84 80
85 81
      const axis = this.vertical ? 'y' : 'x'
86 -
      const reverse = this.$vuetify.rtl && axis === 'x' ? !this.internalReverse : this.internalReverse
82 +
      const reverse = this.internalReverse ? !this.isReverse : this.isReverse
87 83
      const direction = reverse ? '-reverse' : ''
88 84
89 85
      return `v-window-${axis}${direction}-transition`
@@ -105,12 +101,14 @@
Loading
105 101
      })
106 102
    },
107 103
    internalReverse (): boolean {
108 -
      return this.reverse ? !this.isReverse : this.isReverse
104 +
      return this.$vuetify.rtl ? !this.reverse : this.reverse
109 105
    },
110 106
  },
111 107
112 108
  watch: {
113 -
    internalIndex: 'updateReverse',
109 +
    internalIndex (val, oldVal) {
110 +
      this.isReverse = this.updateReverse(val, oldVal)
111 +
    },
114 112
  },
115 113
116 114
  mounted () {
@@ -138,7 +136,7 @@
Loading
138 136
    genIcon (
139 137
      direction: 'prev' | 'next',
140 138
      icon: string,
141 -
      fn: () => void
139 +
      click: () => void
142 140
    ) {
143 141
      return this.$createElement('div', {
144 142
        staticClass: `v-window__${direction}`,
@@ -148,12 +146,7 @@
Loading
148 146
          attrs: {
149 147
            'aria-label': this.$vuetify.lang.t(`$vuetify.carousel.${direction}`),
150 148
          },
151 -
          on: {
152 -
            click: () => {
153 -
              this.changedByDelimiters = true
154 -
              fn()
155 -
            },
156 -
          },
149 +
          on: { click },
157 150
        }, [
158 151
          this.$createElement(VIcon, {
159 152
            props: { large: true },
@@ -211,8 +204,6 @@
Loading
211 204
      return prevIndex
212 205
    },
213 206
    next () {
214 -
      this.isReverse = this.$vuetify.rtl
215 -
216 207
      /* istanbul ignore if */
217 208
      if (!this.hasActiveItems || !this.hasNext) return
218 209
@@ -222,8 +213,6 @@
Loading
222 213
      this.internalValue = this.getValue(item, nextIndex)
223 214
    },
224 215
    prev () {
225 -
      this.isReverse = !this.$vuetify.rtl
226 -
227 216
      /* istanbul ignore if */
228 217
      if (!this.hasActiveItems || !this.hasPrev) return
229 218
@@ -233,12 +222,15 @@
Loading
233 222
      this.internalValue = this.getValue(item, lastIndex)
234 223
    },
235 224
    updateReverse (val: number, oldVal: number) {
236 -
      if (this.changedByDelimiters) {
237 -
        this.changedByDelimiters = false
238 -
        return
225 +
      const lastIndex = this.items.length - 1
226 +
227 +
      if (val === lastIndex && oldVal === 0) {
228 +
        return true
229 +
      } else if (val === 0 && oldVal === lastIndex) {
230 +
        return false
231 +
      } else {
232 +
        return val < oldVal
239 233
      }
240 -
241 -
      this.isReverse = val < oldVal
242 234
    },
243 235
  },
244 236

Learn more Showing 64 files with coverage changes found.

Changes in packages/vuetify/src/components/VColorPicker/VColorPickerPreview.ts
+1
Loading file...
Changes in packages/vuetify/src/components/VSlideGroup/VSlideGroup.ts
+1
+5
Loading file...
Changes in packages/vuetify/src/components/VDataTable/VDataTableHeaderDesktop.ts
+1
Loading file...
Changes in packages/vuetify/src/components/VAlert/VAlert.ts
+1
Loading file...
Changes in packages/vuetify/src/util/console.ts
+1
Loading file...
Changes in packages/vuetify/src/components/VImg/VImg.ts
+1
+1
Loading file...
Changes in packages/vuetify/src/components/VNavigationDrawer/VNavigationDrawer.ts
+53
+7
Loading file...
Changes in packages/vuetify/src/directives/color/index.ts
+5
+1
Loading file...
Changes in packages/vuetify/src/install.ts
+1
+14
Loading file...
Changes in packages/vuetify/src/components/VLazy/VLazy.ts
+1
Loading file...
Changes in packages/vuetify/src/components/VCalendar/VCalendarCategory.ts
-1
+1
Loading file...
Changes in packages/vuetify/src/components/VTreeview/util/filterTreeItems.ts
+1
Loading file...
Changes in packages/vuetify/src/components/VDatePicker/util/createNativeLocaleFormatter.ts
+1
Loading file...
Changes in packages/vuetify/src/components/transitions/createTransition.ts
+2
+1
Loading file...
Changes in packages/vuetify/src/services/theme/utils.ts
+1
Loading file...
Changes in packages/vuetify/src/directives/mutate/index.ts
+1
Loading file...
Changes in packages/vuetify/src/util/color/transformSRGB.ts
+2
Loading file...
Changes in packages/vuetify/src/components/VItemGroup/VItemGroup.ts
+1
Loading file...
Changes in packages/vuetify/src/components/VCalendar/mixins/mouse.ts
+1
Loading file...
Changes in packages/vuetify/src/util/color/transformCIELAB.ts
+2
Loading file...
Changes in packages/vuetify/src/mixins/proxyable/index.ts
+8
Loading file...
Changes in packages/vuetify/src/mixins/picker-button/index.ts
+1
Loading file...
Changes in packages/vuetify/src/services/icons/presets/fa-svg.ts
+1
Loading file...
Changes in packages/vuetify/src/components/VSparkline/helpers/core.ts
+2
Loading file...
Changes in packages/vuetify/src/mixins/groupable/index.ts
+10
Loading file...
Changes in packages/vuetify/src/components/VSnackbar/VSnackbar.ts
+1
Loading file...
Changes in packages/vuetify/src/directives/intersect/index.ts
+1
Loading file...
Changes in packages/vuetify/src/components/VDataTable/VSimpleTable.ts
+4
Loading file...
Changes in packages/vuetify/src/services/lang/index.ts
+1
Loading file...
Changes in packages/vuetify/src/services/application/index.ts
+1
Loading file...
Changes in packages/vuetify/src/mixins/toggleable/index.ts
+5
Loading file...
Changes in packages/vuetify/src/directives/click-outside/index.ts
+12
Loading file...
Changes in packages/vuetify/src/services/theme/index.ts
+2
Loading file...
Changes in packages/vuetify/src/components/VWindow/VWindow.ts
+2
Loading file...
Changes in packages/vuetify/src/components/VDataTable/VDataTable.ts
+1
Loading file...
Changes in packages/vuetify/src/util/colorUtils.ts
+2
Loading file...
Changes in packages/vuetify/src/components/VCalendar/util/timestamp.ts
+2
Loading file...
Changes in packages/vuetify/src/components/VCheckbox/VCheckbox.ts
+1
Loading file...
Changes in packages/vuetify/src/util/mergeData.ts
+2
Loading file...
Changes in packages/vuetify/src/components/VInput/VInput.ts
+3
Loading file...
Changes in packages/vuetify/src/components/VSparkline/VSparkline.ts
+1
Loading file...
Changes in packages/vuetify/src/components/VSwitch/VSwitch.ts
+1
Loading file...
Changes in packages/vuetify/src/components/VSelect/VSelectList.ts
+1
Loading file...
Changes in packages/vuetify/src/components/VIcon/VIcon.ts
+21
Loading file...
Changes in packages/vuetify/src/directives/ripple/index.ts
+2
Loading file...
Changes in packages/vuetify/src/components/VCalendar/VCalendarWeekly.ts
+1
Loading file...
Changes in packages/vuetify/src/components/VCalendar/util/events.ts
+1
Loading file...
Changes in packages/vuetify/src/services/presets/index.ts
+1
Loading file...
Changes in packages/vuetify/src/services/goto/index.ts
+4
Loading file...
Changes in packages/vuetify/src/components/VColorPicker/VColorPickerEdit.ts
+11
Loading file...
Changes in packages/vuetify/src/components/VDatePicker/VDatePicker.ts
+47
Loading file...
Changes in packages/vuetify/src/components/VMenu/VMenu.ts
+22
+3
Loading file...
Changes in packages/vuetify/src/util/helpers.ts
+92
+1
Loading file...
Changes in packages/vuetify/src/components/VTabs/VTabs.ts
+30
+2
Loading file...
Changes in packages/vuetify/src/components/VAutocomplete/VAutocomplete.ts
+32
Loading file...
Changes in packages/vuetify/src/components/VTimePicker/VTimePicker.ts
-1
+4
Loading file...
Changes in packages/vuetify/src/components/VSlider/VSlider.ts
+87
Loading file...
Changes in packages/vuetify/src/components/VDialog/VDialog.ts
+44
+13
Loading file...
Changes in packages/vuetify/src/components/VSelect/VSelect.ts
+129
+5
Loading file...
Changes in packages/vuetify/src/components/VData/VData.ts
+54
+2
Loading file...
Changes in packages/vuetify/src/components/VTextField/VTextField.ts
-1
-1
+69
Loading file...
Changes in packages/vuetify/src/mixins/themeable/index.ts
+20
Loading file...
Changes in packages/vuetify/src/components/VColorPicker/util/index.ts
-2
+8
Loading file...
Changes in packages/vuetify/src/components/VCalendar/mixins/calendar-with-events.ts
-11
+12
Loading file...
Files Coverage
packages/vuetify/src 0.56% 87.00%
Project Totals (368 files) 87.00%
Loading