How in leaflet add custom data to polyline?

[sergeynilov]

Hello,
In jquery 3/leaflet / turf app
I use custom class extended from CircleMarker
as I need in any marker keep info about any point and info on nearby points.
Markers are connected with polylines and I want to keep simialr information polyline
and clicking on it get this info. I failed to make it. I do

    customCircleMarker = L.CircleMarker.extend({
        options: {
            first_market: false,
            last_market: false,
            point_id: null,
            prior_point_id: null,
        }
    });
    var selectedPoint= {}
    var points = [
        {id: 1, title:'title #1 ', lat:52.509, lng:-3.08},
        {id: 2, title:'title #2 ', lat:51.503, lng:-1.06},
        {id: 3, title:'title #3 ', lat:49.51, lng:-2.47}
    ];

    var mymap = L.map('mapid').setView([51.505, -0.09], 7);


    L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
        maxZoom: 18,
        attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' +
            '<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
            'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
        id: 'mapbox/streets-v11',
        tileSize: 512,
        zoomOffset: -1
    }).addTo(mymap);

    drawPoints()
    function drawPoints() {
        let polylinePoints= []  // I get all info about all Polylines
        let loop_index =  0
        points.forEach(point => {
            let priorPoint= null
            if(loop_index > 0) {
                priorPoint= points[loop_index - 1]
            }

            var myMarker = new customCircleMarker([point.lat, point.lng], {
                title: 'unselected',
                radius: 20,
                first_market: loop_index == 0,
                last_market: loop_index == points.length-1,
                point_id: point.id,
                prior_point_id: priorPoint ? priorPoint.id : null,
            });
            myMarker.on('click', function (event) { // THAT WORKS OK
                console.log('myMarker.event.target.options.point_id::')
                console.log(event.target.options.point_id)
            });
            myMarker.addTo(mymap);

            polylinePoints[polylinePoints.length]=[point.lat, point.lng]
            loop_index++
        })


        var radius = 10;
        var polyline = new L.Polyline(polylinePoints, {
            color: 'green',
            opacity: 1,
            weight: 2,
            customData:{  // BUT TAT DOES NOT WORK AS POINT IS OUT OF LOOP
                point_id: point.id,
                prior_point_id: priorPoint ? priorPoint.id : null,
            }
            // offset: radius
        });
        // Add click listener
        polyline.on('click', function (event) {
            event.originalEvent.stopPropagation();
            window.event.cancelBubble = true;  // CAN NOT STOP Propagation
            showModal(event)
            // alert('Polyline clicked!');
        });
        // Add polyline to featuregroup
        polyline.addTo(mymap);

        // zoom the map to the polyline
        mymap.fitBounds(polyline.getBounds());

    } // function drawPoints () {

How can I add custom data to polyline ?

Thanks!