Updating InputableRange control in Toolbar from JS

I have a custom toolbar component with a set of inputablerange controls to
have slider values sent to a back end. I can happily retrieve the values via
events and send to my API as they change, but i also want to initialise their
value with the current backend values when the toolbar loads. I can get the
current values also via API and call that API from the JS succesfully but i
just can’t work out how to set the value on an existing inputablerange
control. Usual JS style would just be to objectname.value = ? but that doesn’t
work or variations of it. With little to no documentation in that space -
struggling to come up with ideas. Anyone have success in that space?

I always look at the template. It has this part:

    set value(value) {
        if (this.min == null || this.max == null) {
            this.m_bind_value = value;
            return;
        }
        this.setAttribute('value', value.toString());
    }

Maybe you can try something like this:

this.m_SliderObject = document.getElementById("TestSlider");
this.m_SliderObject.setAttribute('value', 5);

Let me try again - i did do that i believe - but will have another try. Thanks
for the feedback.