Different behaviour after upgrading from 0.27.1 to 0.27.3

Environments

Framework name: Moveable JS
Framework version: 0.27.3
Moveable Component version:
Testable Address(optional):

Description

Yesterday, I upgraded the version from 0.27.1 to 0.27.3 (thanks for the library). But I started to see various issues after the upgrade. I'll list down two of them.

Problem 1

I'm placing a custom handle to the bottom of moveable target like this-

This I'm achieving by getting the position of the moveable by calling moveable.getRect() (just after new Moveable(...)-

Earlier, this was working fine but now I'm getting all the 0 values in getRect() method. For now, I've added a workaround by wrapping it to setTimeout and it works (not sure why but may be because of asynchronous stuff being discussed here https://github.com/daybrush/moveable/issues/568).

Problem 2

Using a custom-Able, I'm showing the width & height of the element (as you can see in the above image)-

// eslint-disable-next-line @typescript-eslint/naming-convention
import {Able, MoveableManagerInterface} from 'moveable';

// eslint-disable-next-line @typescript-eslint/naming-convention
export const DimensionViewable: Able = {
    name: 'dimensionViewable',
    props: {},
    events: {},
    render: (moveable: MoveableManagerInterface<any, any>, render: any) => {
        const rect = moveable.getRect();

        const style = {
            position: 'absolute',
            top: `${rect.height + 20}px`,
            left: `${rect.width}px`,
            background: 'var(--cooee-blue)',
            borderRadius: '5px',
            padding: '3px 9px',
            color: 'white',
            fontSize: '13px',
            whiteSpace: 'nowrap',
            fontWeight: '500',
            willChange: 'transform',
            transform: 'translate(-50%, 0px)',
        };

        const props = {
            style,
            key: 'dimension-viewer',
            class: 'moveable-dimension',
        };

        const text = `${rect.offsetWidth} x ${rect.offsetHeight}`;
        return render.createElement('div', props, [text]);
    },
};

When I'm switching between targets, that element is being shown for a fraction of sections with 0x0 value. Please see the video (look at the top left corner of the mobile frame).

https://user-images.githubusercontent.com/1804514/149632536-19ae3481-4845-4cf5-a33c-df60d4bcf1f0.mov

I tried to read the changes in the recent releases https://github.com/daybrush/moveable/compare/0.27.1...master but couldn't get much. My one cent is that this is related to some asynchronous operation changes.

daybrush / moveable