[Question] Background Image inline

Hi @awaredigital StyleManager targets both Components and CssRules, so do it like below:

editor.on('component:styleUpdate:background-image', component => {
        const sm = editor.StyleManager
        const model = sm.getModelToStyle(component)
        // the model can be a Component or CssRule
        const bg = model.getStyle()['background-image']
        const idx = bg.toString().indexOf('url(')
        const newBg = bg.substr(idx + 'url'.length, bg.length - 1)
        if (newBg != '(none)') {
            component.addAttributes && component.addAttributes({'data-element': newBg})
        }
    })

Cheers!

That is great. How do i stop the data of

model.getStyle()['background-image']

being passed into the CSS? Only the background image.

Thanks

@awaredigital i have tested the above code and it was working fine. but for the error, you may check bg before further processing because after we update the component style we may get the callback again which is your case here:

if (bg != null) {
    const idx = bg.toString().indexOf('url(')
    //...
}

Cheers!