Using JS API 4.16, I want to use a Slider widget in the ListItemPanel of my Layer List items, but when I attach an event listener to my slider, it fails to render.
Basically, I have:
const mySlider = new Slider({
min: 0,
max: 1,
steps: .05,
values: [1],
snapOnClickEnabled: true,
visibleElements: {labels: true,
rangeLabels: true}
}).on('thumb-drag', index => console.log(index));
const layerList = new LayerList({
view: view,
listItemCreatedFunction: event => {
const item = event.item
item.panel = {
content: [
mySlider
],
open: false
}
)};
and my Slider isn't rendering.
here's a codepen: https://codepen.io/broms/pen/BaKdXaj
If you uncomment the on('thumb-drag') listener at line 14 in the pen, the slider stops rendering.
I assume the code is correct, because if you uncomment the container property at line 5 (in addition to the above) and draw the slider in its own div, everything works as expected.
Is this a bug, or is there a way to get the Slider to work inside a ListItemPanel?