[LiveComponent] Race Condition in Live Components - Premature 'render:finished' Event Before Component Registration

[Pechynho]

There seems to be a bug in Live Components. More specifically, in the live_controller.js file, there is a logic flaw that breaks the SetValueOntoModelFieldsPlugin.

After fetching a request, executeMorphdom is performed, and a few steps later, the render:finished event is fired. The SetValueOntoModelFieldsPlugin subscribes to this event and executes its logic. However, there's an assumption that between executeMorphdom and firing the render:finished event, Stimulus registers all Live components and builds the live component map (used in the elementBelongsToThisComponent method).

This assumption is not always true. Sometimes Stimulus has not finished registering every Live component, so the elementBelongsToThisComponent method does not work properly, resulting in an exception.

I suggest ensuring that all Live components are fully registered after executeMorphdom before continuing with the rest of the logic.

live_controller.js:397 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'accessRule')
    at parseDeepData (live_controller.js:397:1)
    at getDeepData (live_controller.js:383:42)
    at ValueStore.get (live_controller.js:427:1)
    at ValueStore.has (live_controller.js:430:1)
    at live_controller.js:2708:1
    at NodeList.forEach (<anonymous>)
    at SetValueOntoModelFieldsPlugin.synchronizeValueOfModelFields (live_controller.js:2690:1)
    at live_controller.js:2686:1
    at live_controller.js:1556:1

[smnandre]

Hi @Pechynho ! Could you give us a bit more context on how to reproduce this situation ?

Or ideally a small example we can run to test/investigate what is going on ?