getClientBoundingRect для условно визуализированного элемента с анимацией в Svelte

Question

Данный условно визуализированный div с раскрывающимся меню. Чтобы рассчитать его положение (чтобы открыть его вверх или вниз), мне нужно получить его высоту и ширину.

Конечно, элемент не получает правильных размеров до того, как будет выполнен переход.

Итак, вопрос в том, как программно отключить переход? Или как мне получить будущее положение элемента, не показывая его?

{#if isOpened}
    <div
        bind:this={thisMenu}
        use:clickOutside
        on:click_outside={closeHandler}
        class="dropdown absolute left-100p text-gray-600 z-10 w-full animated
        rounded-lg"
        style={finalStyle}
        {isInit ?  null : transition:slide }>
        <slot name="list" />
    </div>
{/if}

Answer 1

Slide -transition использует getComputedStyle, так что, возможно, это то, что вам нужно. Следующее скопировано из функции слайда в репозитории svelte (src/runtime/transition/index.ts). Слайд-функция устанавливает эти значения от нуля до начального значения и обратно.

const style = getComputedStyle(node);
const opacity = +style.opacity;
const height = parseFloat(style.height);
const padding_top = parseFloat(style.paddingTop);
const padding_bottom = parseFloat(style.paddingBottom);
const margin_top = parseFloat(style.marginTop);
const margin_bottom = parseFloat(style.marginBottom);
const border_top_width = parseFloat(style.borderTopWidth);
const border_bottom_width = parseFloat(style.borderBottomWidth);