[LiveComponent] Uncaught TypeError: currentLevelData is null

[alexgaill]

Hi, I'm trying to use select2 js with LiveComponents. I'd like to save the select value when it change on component using

this.component.{liveProp} = data

This use return an error: Uncaught TypeError: currentLevelData is null

I removed a lot of lines to test.

There is my js code:

import { Controller } from '@hotwired/stimulus'
import $ from 'jquery'
require('select2')

export default class extends Controller {
    connect () {
        this.element.addEventListener('live:connect', (event) => {
            this.component = event.detail.component

            this.component.on('render:finished', (component) => {
                this.addSaveSelectValueOnChangeEvent($('.selectTag'))
            })
        })
    }

    addSaveSelectValueOnChangeEvent (elements) {
        for (let i = 0; i < elements.length; i++) {
            const that = this
            const target = elements[i]
            $(target).select2({
                tags: true,
                tokenSeparators: [',', ' ']
            })

            console.log(that.component.firewalls)

        }
    }

[weaverryan]

Hi there!

Sorry for the slow reply. Hmm, I'm guessing that.component.getData('firewalls') also gives the same error? What does your LiveComponent look like? I assume you have a firewalls LiveProp? Can you post a stack trace for the error?

It definitely could be a bug. At the very least, it's an unfriendly error message that needs improving.

[carsonbot]

Hey, thanks for your report! There has not been a lot of activity here for a while. Is this bug still relevant? Have you managed to find a workaround?

[carsonbot]

Just a quick reminder to make a comment on this. If I don't hear anything I'll close this.

[carsonbot]

Hey,

I didn't hear anything so I'm going to close it. Feel free to comment if this is still relevant, I can always reopen!