Position not reachable when dragging

[kevinbal1]

Description

Hello, I have an issue with Flicking using Vue 3 script setup + composition. I am swiping by dragging, and from time to time, it will throw the POSITION_NOT_REACHABLE error, and I have no idea why it throws it and in what circumstance. Yet, sometimes it happens.

Edit: It seems like align: 'next' seems to be doing that, setting it to prev fixes it, could you perhaps explain why please ?

Steps to check or reproduce

const flicking = ref<Flicking | null>(null);
const flickingOptions: Partial<FlickingOptions> = {
  circular: false,
  align: 'next',
  autoResize: true,
  bound: true,
};

<div v-if="localOffers" class="hidden gap-3" :class="{ 'sm:flex': localOffers.length > 0 }">
  <div
    v-if="promotionOffer && routerRoute.name === 'offers.index'"
    class="hidden py-2 sm:block md:pt-4"
  >
    <HighlightOffer :promotionOffer="promotionOffer" />
  </div>
  <Flicking ref="flicking" class="pb-6 pt-2 md:pt-4" :options="flickingOptions">
    <div v-for="(offer, index) in localOffers" :key="`offer-${index}`" class="ml-4 w-fit">
      <Component :is="props.is" :offer="offer" :mode="props.offerType" />
    </div>
  </Flicking>
</div>

[malangfox]

Hello @kevinbal1.

We've been trying to reproduce this issue, but we've been unable to reproduce the issue with these options. My guess is that this issue is related to the size of the elements set by the style. Can you provide a demo or repo where we can reproduce this issue?

[kevinbal1]

Hello @kevinbal1.

We've been trying to reproduce this issue, but we've been unable to reproduce the issue with these options. My guess is that this issue is related to the size of the elements set by the style. Can you provide a demo or repo where we can reproduce this issue?

Thank you for the response. Are you unable to reproduce the issue with the option align: 'next' also ?

[malangfox]

@kevinbal1

We tried using the same options you passed to reproduce this issue.

These are the vue3 environment demo and the pure javascript environment demo we tired, but this issue was not reproduced.

The circular option defaults to false, so in these two demos, we use the following combinations of options.

  align: 'next',
  autoResize: true,
  bound: true,

Is there anything else we can know to reproduce what you are experiencing?

Moreover, can you reproduce this when you exclude the autoResize or bound options?