Projection of Geodesic line and a turf polygon onto leaflet - leaflet

Question

I am using leaflet and turf.js to determine if a line passes through a polygon using turf.booleanIntersects(). I have the code working but with one slight inconsistency. The line in the attached image according to turf.booleanIntersects() passes through both of the polygons in the image, but the line drawn on map doesn't actually pass through the both polygons according to the image. Is the image incorrect (if so how can I fix it?) or does the line not actually go through the top polygon. Is it the projection inconsistency of a Geodesic line and geoJson turf polygon onto leaflet map?
Thank you
A snippet of important bit of my code
LayerGroup = L.layerGroup().addTo(mymap);
var line = new L.Geodesic([[point1, point2]], geodesicOptions).addTo(LayerGroup);
LinesList.push(line);
var line = turf.lineString([
[LinesList[i].points[0][0].lng, LinesList[i].points[0][0].lat],
[LinesList[i].points[0][1].lng, LinesList[i].points[0][1].lat]
]);
//multiple points make up polygonlines array
var point= [end.lng, end.lat];
polygonlines.push(point);
var geojsonPolygon =
{
"type": "Feature",
"properties": {},
"geometry": {
"type": "Polygon",
"coordinates": [polygonlines]
}
}
var turfpolygon = turf.polygon(geojsonPolygon.geometry.coordinates);
if (turf.booleanIntersects(line, turfpolygon) == true) {
const p2 = L.geoJSON(turfpolygon).addTo(mymap);
}