Svelte: Make a method similar to React.Component.forceUpdate()

[Alexey-Sch]

Is your feature request related to a problem? Please describe.
Sometimes I need to immediately update the state of a component. For example, in order to measure its dimensions when mounting, and then apply some logic to these sizes, for example, position it on the page. This is now impossible to do.

Describe the solution you'd like
I see a solution in creating a method similar to React.Component.forceUpdate().

Describe alternatives you've considered
Using the tick() method, but it does not seem to work as needed - in some cases it returns an already resolved promise.

How important is this feature to you?
Pretty important. Now we are in the stage of choosing a framework on which we will begin a new project. The lack of such functionality will be very undesirable.

Additional context
Example: the Carousel component with a smooth scroll (via CSS-transition) and an Item that should be central, for example, with an index of 41 out of 100. The layout is adaptive.

I need to mount the component on the page, measure the offset of the Item with index 41, scroll the Carousel to it, and only then turn on the animations.

Now scrolling to Item and animations are turned on simultaneously, which is why initial scrolling to the 41st Item occurs with animation.

Using the forceUpdate() method will allow me to first scroll up to 41st Item, and only then enable animations.

[Rich-Harris]

I'm not sure I understand the situation — can you create a simple repro that indicates the missing behaviour?

[Rich-Harris]

(ideally using https://svelte.dev/repl)

[Alexey-Sch]

https://svelte.dev/repl/88b183a5635d40e49182c8727463aff9?version=3.10.0

To simulate the behavior I required, I used the setTimeout() method to wait for a component update:

https://svelte.dev/repl/f90ec39d6c0f4694871ede06dba69250?version=3.10.0

[pngwn]

Can't you simply wait for the changes to be flushed and then wait for a few frames before enabling the animations?

https://svelte.dev/repl/833c8b3aa2af456cbdb9f1adad7295b6?version=3.10.0

[Alexey-Sch]

Thank you, this solution works. But I would like to clarify the nuances - should it work everywhere? We are waiting for a few frames, is there a guarantee that Svelte will update the appearance of the component during this time - say, on older devices or on devices with 100% CPU utilization?

[pngwn]

We are using await tick() as well which means that state has been updated and changes have been flushed to the DOM, only after that has happened are we waiting for the new frames. I haven't tested this extensively but I think it should work in most circumstances.

[Alexey-Sch]

Thanks. In this case, the forceUpdate() method for me personally is not need yet. You can close this issue if you think that this method is not yet required in the Svelte.

[Alexey-Sch]

By the way, do I understand correctly that a tick() should ALWAYS return an initially unresolved promise?