search

Automattic / wp-calypso

The JavaScript and API powered WordPress.com
https://developer.wordpress.com
GNU General Public License v2.0
12.43k stars 1.99k forks source link

Map block: when there are many points (44+) on the map, a list renders #86336

Open TimBroddin opened 10 months ago

TimBroddin commented 10 months ago

Related thread: p1704740657255179-slack-CKZHG0QCR

Problem

When many points are added to a map the map no longer renders, but shows a list instead. This seems to happen at around 44 points, but not always. It seems dependant on the actual length of the points' JSON.

This example block triggers the error: 

<!-- wp:jetpack/map {"points":[{"placeTitle":"San Fran, CA, United States","title":"San Fran, CA, United States","caption":"San Fran, CA, United States","coordinates":{"longitude":-122.4184341430664,"latitude":37.779380798339844},"id":"San Fran, CA, United States 37.78 -122.42"},{"placeTitle":"Albuquerque, NM, United States","title":"Albuquerque, NM, United States","caption":"Albuquerque, NM, United States","coordinates":{"longitude":-106.65155029296875,"latitude":35.0882453918457},"id":"Albuquerque, NM, United States 35.09 -106.65"},{"placeTitle":"Reno, NV, United States","title":"Reno, NV, United States","caption":"Reno, NV, United States","coordinates":{"longitude":-119.81256866455078,"latitude":39.525943756103516},"id":"Reno, NV, United States 39.53 -119.81"},{"placeTitle":"Wheeler, OR, United States","title":"Wheeler, OR, United States","caption":"Wheeler, OR, United States","coordinates":{"longitude":-123.88328552246094,"latitude":45.68898391723633},"id":"Wheeler, OR, United States 45.69 -123.88"},{"placeTitle":"Lawrence, KS, United States","title":"Lawrence, KS, United States","caption":"Lawrence, KS, United States","coordinates":{"longitude":-95.2357177734375,"latitude":38.973148345947266},"id":"Lawrence, KS, United States 38.97 -95.24"},{"placeTitle":"Minneapolis, MN, United States","title":"Minneapolis, MN, United States","caption":"Minneapolis, MN, United States","coordinates":{"longitude":-93.26506805419922,"latitude":44.97776412963867},"id":"Minneapolis, MN, United States 44.98 -93.27"},{"placeTitle":"Denver, CO, United States","title":"Denver, CO, United States","caption":"Denver, CO, United States","coordinates":{"longitude":-104.99030303955078,"latitude":39.73921203613281},"id":"Denver, CO, United States 39.74 -104.99"},{"placeTitle":"Laramie, WY, United States","title":"Laramie, WY, United States","caption":"Laramie, WY, United States","coordinates":{"longitude":-105.59222412109375,"latitude":41.31170654296875},"id":"Laramie, WY, United States 41.31 -105.59"},{"placeTitle":"Kansas City, MO, United States","title":"Kansas City, MO, United States","caption":"Kansas City, MO, United States","coordinates":{"longitude":-94.57797241210938,"latitude":39.099761962890625},"id":"Kansas City, MO, United States 39.10 -94.58"},{"placeTitle":"Boise, ID, United States","title":"Boise, ID, United States","caption":"Boise, ID, United States","coordinates":{"longitude":-116.20197296142578,"latitude":43.6153450012207},"id":"Boise, ID, United States 43.62 -116.20"},{"placeTitle":"Salt Lake City, UT, United States","title":"Salt Lake City, UT, United States","caption":"Salt Lake City, UT, United States","coordinates":{"longitude":-111.88819885253906,"latitude":40.759552001953125},"id":"Salt Lake City, UT, United States 40.76 -111.89"},{"placeTitle":"Detroit, MI, United States","title":"Detroit, MI, United States","caption":"Detroit, MI, United States","coordinates":{"longitude":-83.04492950439453,"latitude":42.32939147949219},"id":"Detroit, MI, United States 42.33 -83.04"},{"placeTitle":"Columbus, OH, United States","title":"Columbus, OH, United States","caption":"Columbus, OH, United States","coordinates":{"longitude":-83.0030517578125,"latitude":39.96195983886719},"id":"Columbus, OH, United States 39.96 -83.00"},{"placeTitle":"Nashville, TN, United States","title":"Nashville, TN, United States","caption":"Nashville, TN, United States","coordinates":{"longitude":-86.77780151367188,"latitude":36.16606521606445},"id":"Nashville, TN, United States 36.17 -86.78"},{"placeTitle":"Oklahoma City, OK, United States","title":"Oklahoma City, OK, United States","caption":"Oklahoma City, OK, United States","coordinates":{"longitude":-97.52123260498047,"latitude":35.468971252441406},"id":"Oklahoma City, OK, United States 35.47 -97.52"},{"placeTitle":"Phoenix, AZ, United States","title":"Phoenix, AZ, United States","caption":"Phoenix, AZ, United States","coordinates":{"longitude":-112.07661437988281,"latitude":33.4482536315918},"id":"Phoenix, AZ, United States 33.45 -112.08"},{"placeTitle":"Dallas, TX, United States","title":"Dallas, TX, United States","caption":"Dallas, TX, United States","coordinates":{"longitude":-96.79559326171875,"latitude":32.77556610107422},"id":"Dallas, TX, United States 32.78 -96.80"},{"placeTitle":"Dallas, OR, United States","title":"Dallas, OR, United States","caption":"Dallas, OR, United States","coordinates":{"longitude":-123.31564331054688,"latitude":44.92047119140625},"id":"Dallas, OR, United States 44.92 -123.32"},{"placeTitle":"Dallas, GA, United States","title":"Dallas, GA, United States","caption":"Dallas, GA, United States","coordinates":{"longitude":-84.84061431884766,"latitude":33.92463302612305},"id":"Dallas, GA, United States 33.92 -84.84"},{"placeTitle":"Dallas, NC, United States","title":"Dallas, NC, United States","caption":"Dallas, NC, United States","coordinates":{"longitude":-81.17720031738281,"latitude":35.317134857177734},"id":"Dallas, NC, United States 35.32 -81.18"},{"placeTitle":"New York, United States","title":"New York, United States","caption":"New York, United States","coordinates":{"longitude":-73.75669860839844,"latitude":42.65290069580078},"id":"New York, United States 42.65 -73.76"},{"placeTitle":"New Jersey, United States","title":"New Jersey, United States","caption":"New Jersey, United States","coordinates":{"longitude":-74.77140045166016,"latitude":40.22140121459961},"id":"New Jersey, United States 40.22 -74.77"},{"placeTitle":"Maine, United States","title":"Maine, United States","caption":"Maine, United States","coordinates":{"longitude":-69.78070068359375,"latitude":44.307701110839844},"id":"Maine, United States 44.31 -69.78"},{"placeTitle":"Los Angeles, CA, United States","title":"Los Angeles, CA, United States","caption":"Los Angeles, CA, United States","coordinates":{"longitude":-118.24234771728516,"latitude":34.0533447265625},"id":"Los Angeles, CA, United States 34.05 -118.24"},{"placeTitle":"Los Banos, CA, United States","title":"Los Banos, CA, United States","caption":"Los Banos, CA, United States","coordinates":{"longitude":-120.84949493408203,"latitude":37.06039810180664},"id":"Los Banos, CA, United States 37.06 -120.85"},{"placeTitle":"Las Vegas, NV, United States","title":"Las Vegas, NV, United States","caption":"Las Vegas, NV, United States","coordinates":{"longitude":-115.1487045288086,"latitude":36.166748046875},"id":"Las Vegas, NV, United States 36.17 -115.15"},{"placeTitle":"Columbus, GA, United States","title":"Columbus, GA, United States","caption":"Columbus, GA, United States","coordinates":{"longitude":-84.9877700805664,"latitude":32.45317459106445},"id":"Columbus, GA, United States 32.45 -84.99"},{"placeTitle":"Columbus, TX, United States","title":"Columbus, TX, United States","caption":"Columbus, TX, United States","coordinates":{"longitude":-96.5421142578125,"latitude":29.705373764038086},"id":"Columbus, TX, United States 29.71 -96.54"},{"placeTitle":"Chicago, IL, United States","title":"Chicago, IL, United States","caption":"Chicago, IL, United States","coordinates":{"longitude":-87.63238525390625,"latitude":41.88371658325195},"id":"Chicago, IL, United States 41.88 -87.63"},{"placeTitle":"Rapid City, SD, United States","title":"Rapid City, SD, United States","caption":"Rapid City, SD, United States","coordinates":{"longitude":-103.22654724121094,"latitude":44.08237838745117},"id":"Rapid City, SD, United States 44.08 -103.23"},{"placeTitle":"Cedar Rapids, IA, United States","title":"Cedar Rapids, IA, United States","caption":"Cedar Rapids, IA, United States","coordinates":{"longitude":-91.66939544677734,"latitude":41.97765350341797},"id":"Cedar Rapids, IA, United States 41.98 -91.67"},{"placeTitle":"Roanoke Rapids, NC, United States","title":"Roanoke Rapids, NC, United States","caption":"Roanoke Rapids, NC, United States","coordinates":{"longitude":-77.65789794921875,"latitude":36.45463180541992},"id":"Roanoke Rapids, NC, United States 36.45 -77.66"},{"placeTitle":"Grand Rapids, MI, United States","title":"Grand Rapids, MI, United States","caption":"Grand Rapids, MI, United States","coordinates":{"longitude":-85.67011260986328,"latitude":42.9691162109375},"id":"Grand Rapids, MI, United States 42.97 -85.67"},{"placeTitle":"Rapids City, IL, United States","title":"Rapids City, IL, United States","caption":"Rapids City, IL, United States","coordinates":{"longitude":-90.34346008300781,"latitude":41.578834533691406},"id":"Rapids City, IL, United States 41.58 -90.34"},{"placeTitle":"Montana, United States","title":"Montana, United States","caption":"Montana, United States","coordinates":{"longitude":-112.02030181884766,"latitude":46.586753845214844},"id":"Montana, United States 46.59 -112.02"},{"placeTitle":"Washington, DC, United States","title":"Washington, DC, United States","caption":"Washington, DC, United States","coordinates":{"longitude":-77.03128051757812,"latitude":38.89543914794922},"id":"Washington, DC, United States 38.90 -77.03"},{"placeTitle":"Fargo, ND, United States","title":"Fargo, ND, United States","caption":"Fargo, ND, United States","coordinates":{"longitude":-96.7839126586914,"latitude":46.8790283203125},"id":"Fargo, ND, United States 46.88 -96.78"},{"placeTitle":"West Fargo, ND, United States","title":"West Fargo, ND, United States","caption":"West Fargo, ND, United States","coordinates":{"longitude":-96.88597106933594,"latitude":46.87195587158203},"id":"West Fargo, ND, United States 46.87 -96.89"},{"placeTitle":"Eudora, KS, United States","title":"Eudora, KS, United States","caption":"Eudora, KS, United States","coordinates":{"longitude":-95.09859466552734,"latitude":38.94660949707031},"id":"Eudora, KS, United States 38.95 -95.10"},{"placeTitle":"Eudora, MO, United States","title":"Eudora, MO, United States","caption":"Eudora, MO, United States","coordinates":{"longitude":-93.53770446777344,"latitude":37.4825439453125},"id":"Eudora, MO, United States 37.48 -93.54"},{"placeTitle":"Fort Lauderdale, FL, United States","title":"Fort Lauderdale, FL, United States","caption":"Fort Lauderdale, FL, United States","coordinates":{"longitude":-80.1430435180664,"latitude":26.124160766601562},"id":"Fort Lauderdale, FL, United States 26.12 -80.14"},{"placeTitle":"Fort Collins, CO, United States","title":"Fort Collins, CO, United States","caption":"Fort Collins, CO, United States","coordinates":{"longitude":-105.08163452148438,"latitude":40.588993072509766},"id":"Fort Collins, CO, United States 40.59 -105.08"},{"placeTitle":"Fort Wayne, IN, United States","title":"Fort Wayne, IN, United States","caption":"Fort Wayne, IN, United States","coordinates":{"longitude":-85.13732147216797,"latitude":41.07963180541992},"id":"Fort Wayne, IN, United States 41.08 -85.14"},{"placeTitle":"Monterey, CA, United States","title":"Monterey, CA, United States","caption":"Monterey, CA, United States","coordinates":{"longitude":-121.8979263305664,"latitude":36.597389221191406},"id":"Monterey, CA, United States 36.60 -121.90"}],"zoom":8.319778745260226,"mapCenter":{"lat":36.75631145307725,"lng":-96.83199310302736}} -->
<div class="wp-block-jetpack-map" data-map-style="default" data-map-details="true" data-points="[{&quot;placeTitle&quot;:&quot;San Fran, CA, United States&quot;,&quot;title&quot;:&quot;San Fran, CA, United States&quot;,&quot;caption&quot;:&quot;San Fran, CA, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-122.4184341430664,&quot;latitude&quot;:37.779380798339844},&quot;id&quot;:&quot;San Fran, CA, United States 37.78 -122.42&quot;},{&quot;placeTitle&quot;:&quot;Albuquerque, NM, United States&quot;,&quot;title&quot;:&quot;Albuquerque, NM, United States&quot;,&quot;caption&quot;:&quot;Albuquerque, NM, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-106.65155029296875,&quot;latitude&quot;:35.0882453918457},&quot;id&quot;:&quot;Albuquerque, NM, United States 35.09 -106.65&quot;},{&quot;placeTitle&quot;:&quot;Reno, NV, United States&quot;,&quot;title&quot;:&quot;Reno, NV, United States&quot;,&quot;caption&quot;:&quot;Reno, NV, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-119.81256866455078,&quot;latitude&quot;:39.525943756103516},&quot;id&quot;:&quot;Reno, NV, United States 39.53 -119.81&quot;},{&quot;placeTitle&quot;:&quot;Wheeler, OR, United States&quot;,&quot;title&quot;:&quot;Wheeler, OR, United States&quot;,&quot;caption&quot;:&quot;Wheeler, OR, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-123.88328552246094,&quot;latitude&quot;:45.68898391723633},&quot;id&quot;:&quot;Wheeler, OR, United States 45.69 -123.88&quot;},{&quot;placeTitle&quot;:&quot;Lawrence, KS, United States&quot;,&quot;title&quot;:&quot;Lawrence, KS, United States&quot;,&quot;caption&quot;:&quot;Lawrence, KS, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-95.2357177734375,&quot;latitude&quot;:38.973148345947266},&quot;id&quot;:&quot;Lawrence, KS, United States 38.97 -95.24&quot;},{&quot;placeTitle&quot;:&quot;Minneapolis, MN, United States&quot;,&quot;title&quot;:&quot;Minneapolis, MN, United States&quot;,&quot;caption&quot;:&quot;Minneapolis, MN, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-93.26506805419922,&quot;latitude&quot;:44.97776412963867},&quot;id&quot;:&quot;Minneapolis, MN, United States 44.98 -93.27&quot;},{&quot;placeTitle&quot;:&quot;Denver, CO, United States&quot;,&quot;title&quot;:&quot;Denver, CO, United States&quot;,&quot;caption&quot;:&quot;Denver, CO, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-104.99030303955078,&quot;latitude&quot;:39.73921203613281},&quot;id&quot;:&quot;Denver, CO, United States 39.74 -104.99&quot;},{&quot;placeTitle&quot;:&quot;Laramie, WY, United States&quot;,&quot;title&quot;:&quot;Laramie, WY, United States&quot;,&quot;caption&quot;:&quot;Laramie, WY, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-105.59222412109375,&quot;latitude&quot;:41.31170654296875},&quot;id&quot;:&quot;Laramie, WY, United States 41.31 -105.59&quot;},{&quot;placeTitle&quot;:&quot;Kansas City, MO, United States&quot;,&quot;title&quot;:&quot;Kansas City, MO, United States&quot;,&quot;caption&quot;:&quot;Kansas City, MO, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-94.57797241210938,&quot;latitude&quot;:39.099761962890625},&quot;id&quot;:&quot;Kansas City, MO, United States 39.10 -94.58&quot;},{&quot;placeTitle&quot;:&quot;Boise, ID, United States&quot;,&quot;title&quot;:&quot;Boise, ID, United States&quot;,&quot;caption&quot;:&quot;Boise, ID, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-116.20197296142578,&quot;latitude&quot;:43.6153450012207},&quot;id&quot;:&quot;Boise, ID, United States 43.62 -116.20&quot;},{&quot;placeTitle&quot;:&quot;Salt Lake City, UT, United States&quot;,&quot;title&quot;:&quot;Salt Lake City, UT, United States&quot;,&quot;caption&quot;:&quot;Salt Lake City, UT, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-111.88819885253906,&quot;latitude&quot;:40.759552001953125},&quot;id&quot;:&quot;Salt Lake City, UT, United States 40.76 -111.89&quot;},{&quot;placeTitle&quot;:&quot;Detroit, MI, United States&quot;,&quot;title&quot;:&quot;Detroit, MI, United States&quot;,&quot;caption&quot;:&quot;Detroit, MI, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-83.04492950439453,&quot;latitude&quot;:42.32939147949219},&quot;id&quot;:&quot;Detroit, MI, United States 42.33 -83.04&quot;},{&quot;placeTitle&quot;:&quot;Columbus, OH, United States&quot;,&quot;title&quot;:&quot;Columbus, OH, United States&quot;,&quot;caption&quot;:&quot;Columbus, OH, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-83.0030517578125,&quot;latitude&quot;:39.96195983886719},&quot;id&quot;:&quot;Columbus, OH, United States 39.96 -83.00&quot;},{&quot;placeTitle&quot;:&quot;Nashville, TN, United States&quot;,&quot;title&quot;:&quot;Nashville, TN, United States&quot;,&quot;caption&quot;:&quot;Nashville, TN, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-86.77780151367188,&quot;latitude&quot;:36.16606521606445},&quot;id&quot;:&quot;Nashville, TN, United States 36.17 -86.78&quot;},{&quot;placeTitle&quot;:&quot;Oklahoma City, OK, United States&quot;,&quot;title&quot;:&quot;Oklahoma City, OK, United States&quot;,&quot;caption&quot;:&quot;Oklahoma City, OK, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-97.52123260498047,&quot;latitude&quot;:35.468971252441406},&quot;id&quot;:&quot;Oklahoma City, OK, United States 35.47 -97.52&quot;},{&quot;placeTitle&quot;:&quot;Phoenix, AZ, United States&quot;,&quot;title&quot;:&quot;Phoenix, AZ, United States&quot;,&quot;caption&quot;:&quot;Phoenix, AZ, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-112.07661437988281,&quot;latitude&quot;:33.4482536315918},&quot;id&quot;:&quot;Phoenix, AZ, United States 33.45 -112.08&quot;},{&quot;placeTitle&quot;:&quot;Dallas, TX, United States&quot;,&quot;title&quot;:&quot;Dallas, TX, United States&quot;,&quot;caption&quot;:&quot;Dallas, TX, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-96.79559326171875,&quot;latitude&quot;:32.77556610107422},&quot;id&quot;:&quot;Dallas, TX, United States 32.78 -96.80&quot;},{&quot;placeTitle&quot;:&quot;Dallas, OR, United States&quot;,&quot;title&quot;:&quot;Dallas, OR, United States&quot;,&quot;caption&quot;:&quot;Dallas, OR, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-123.31564331054688,&quot;latitude&quot;:44.92047119140625},&quot;id&quot;:&quot;Dallas, OR, United States 44.92 -123.32&quot;},{&quot;placeTitle&quot;:&quot;Dallas, GA, United States&quot;,&quot;title&quot;:&quot;Dallas, GA, United States&quot;,&quot;caption&quot;:&quot;Dallas, GA, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-84.84061431884766,&quot;latitude&quot;:33.92463302612305},&quot;id&quot;:&quot;Dallas, GA, United States 33.92 -84.84&quot;},{&quot;placeTitle&quot;:&quot;Dallas, NC, United States&quot;,&quot;title&quot;:&quot;Dallas, NC, United States&quot;,&quot;caption&quot;:&quot;Dallas, NC, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-81.17720031738281,&quot;latitude&quot;:35.317134857177734},&quot;id&quot;:&quot;Dallas, NC, United States 35.32 -81.18&quot;},{&quot;placeTitle&quot;:&quot;New York, United States&quot;,&quot;title&quot;:&quot;New York, United States&quot;,&quot;caption&quot;:&quot;New York, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-73.75669860839844,&quot;latitude&quot;:42.65290069580078},&quot;id&quot;:&quot;New York, United States 42.65 -73.76&quot;},{&quot;placeTitle&quot;:&quot;New Jersey, United States&quot;,&quot;title&quot;:&quot;New Jersey, United States&quot;,&quot;caption&quot;:&quot;New Jersey, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-74.77140045166016,&quot;latitude&quot;:40.22140121459961},&quot;id&quot;:&quot;New Jersey, United States 40.22 -74.77&quot;},{&quot;placeTitle&quot;:&quot;Maine, United States&quot;,&quot;title&quot;:&quot;Maine, United States&quot;,&quot;caption&quot;:&quot;Maine, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-69.78070068359375,&quot;latitude&quot;:44.307701110839844},&quot;id&quot;:&quot;Maine, United States 44.31 -69.78&quot;},{&quot;placeTitle&quot;:&quot;Los Angeles, CA, United States&quot;,&quot;title&quot;:&quot;Los Angeles, CA, United States&quot;,&quot;caption&quot;:&quot;Los Angeles, CA, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-118.24234771728516,&quot;latitude&quot;:34.0533447265625},&quot;id&quot;:&quot;Los Angeles, CA, United States 34.05 -118.24&quot;},{&quot;placeTitle&quot;:&quot;Los Banos, CA, United States&quot;,&quot;title&quot;:&quot;Los Banos, CA, United States&quot;,&quot;caption&quot;:&quot;Los Banos, CA, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-120.84949493408203,&quot;latitude&quot;:37.06039810180664},&quot;id&quot;:&quot;Los Banos, CA, United States 37.06 -120.85&quot;},{&quot;placeTitle&quot;:&quot;Las Vegas, NV, United States&quot;,&quot;title&quot;:&quot;Las Vegas, NV, United States&quot;,&quot;caption&quot;:&quot;Las Vegas, NV, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-115.1487045288086,&quot;latitude&quot;:36.166748046875},&quot;id&quot;:&quot;Las Vegas, NV, United States 36.17 -115.15&quot;},{&quot;placeTitle&quot;:&quot;Columbus, GA, United States&quot;,&quot;title&quot;:&quot;Columbus, GA, United States&quot;,&quot;caption&quot;:&quot;Columbus, GA, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-84.9877700805664,&quot;latitude&quot;:32.45317459106445},&quot;id&quot;:&quot;Columbus, GA, United States 32.45 -84.99&quot;},{&quot;placeTitle&quot;:&quot;Columbus, TX, United States&quot;,&quot;title&quot;:&quot;Columbus, TX, United States&quot;,&quot;caption&quot;:&quot;Columbus, TX, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-96.5421142578125,&quot;latitude&quot;:29.705373764038086},&quot;id&quot;:&quot;Columbus, TX, United States 29.71 -96.54&quot;},{&quot;placeTitle&quot;:&quot;Chicago, IL, United States&quot;,&quot;title&quot;:&quot;Chicago, IL, United States&quot;,&quot;caption&quot;:&quot;Chicago, IL, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-87.63238525390625,&quot;latitude&quot;:41.88371658325195},&quot;id&quot;:&quot;Chicago, IL, United States 41.88 -87.63&quot;},{&quot;placeTitle&quot;:&quot;Rapid City, SD, United States&quot;,&quot;title&quot;:&quot;Rapid City, SD, United States&quot;,&quot;caption&quot;:&quot;Rapid City, SD, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-103.22654724121094,&quot;latitude&quot;:44.08237838745117},&quot;id&quot;:&quot;Rapid City, SD, United States 44.08 -103.23&quot;},{&quot;placeTitle&quot;:&quot;Cedar Rapids, IA, United States&quot;,&quot;title&quot;:&quot;Cedar Rapids, IA, United States&quot;,&quot;caption&quot;:&quot;Cedar Rapids, IA, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-91.66939544677734,&quot;latitude&quot;:41.97765350341797},&quot;id&quot;:&quot;Cedar Rapids, IA, United States 41.98 -91.67&quot;},{&quot;placeTitle&quot;:&quot;Roanoke Rapids, NC, United States&quot;,&quot;title&quot;:&quot;Roanoke Rapids, NC, United States&quot;,&quot;caption&quot;:&quot;Roanoke Rapids, NC, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-77.65789794921875,&quot;latitude&quot;:36.45463180541992},&quot;id&quot;:&quot;Roanoke Rapids, NC, United States 36.45 -77.66&quot;},{&quot;placeTitle&quot;:&quot;Grand Rapids, MI, United States&quot;,&quot;title&quot;:&quot;Grand Rapids, MI, United States&quot;,&quot;caption&quot;:&quot;Grand Rapids, MI, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-85.67011260986328,&quot;latitude&quot;:42.9691162109375},&quot;id&quot;:&quot;Grand Rapids, MI, United States 42.97 -85.67&quot;},{&quot;placeTitle&quot;:&quot;Rapids City, IL, United States&quot;,&quot;title&quot;:&quot;Rapids City, IL, United States&quot;,&quot;caption&quot;:&quot;Rapids City, IL, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-90.34346008300781,&quot;latitude&quot;:41.578834533691406},&quot;id&quot;:&quot;Rapids City, IL, United States 41.58 -90.34&quot;},{&quot;placeTitle&quot;:&quot;Montana, United States&quot;,&quot;title&quot;:&quot;Montana, United States&quot;,&quot;caption&quot;:&quot;Montana, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-112.02030181884766,&quot;latitude&quot;:46.586753845214844},&quot;id&quot;:&quot;Montana, United States 46.59 -112.02&quot;},{&quot;placeTitle&quot;:&quot;Washington, DC, United States&quot;,&quot;title&quot;:&quot;Washington, DC, United States&quot;,&quot;caption&quot;:&quot;Washington, DC, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-77.03128051757812,&quot;latitude&quot;:38.89543914794922},&quot;id&quot;:&quot;Washington, DC, United States 38.90 -77.03&quot;},{&quot;placeTitle&quot;:&quot;Fargo, ND, United States&quot;,&quot;title&quot;:&quot;Fargo, ND, United States&quot;,&quot;caption&quot;:&quot;Fargo, ND, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-96.7839126586914,&quot;latitude&quot;:46.8790283203125},&quot;id&quot;:&quot;Fargo, ND, United States 46.88 -96.78&quot;},{&quot;placeTitle&quot;:&quot;West Fargo, ND, United States&quot;,&quot;title&quot;:&quot;West Fargo, ND, United States&quot;,&quot;caption&quot;:&quot;West Fargo, ND, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-96.88597106933594,&quot;latitude&quot;:46.87195587158203},&quot;id&quot;:&quot;West Fargo, ND, United States 46.87 -96.89&quot;},{&quot;placeTitle&quot;:&quot;Eudora, KS, United States&quot;,&quot;title&quot;:&quot;Eudora, KS, United States&quot;,&quot;caption&quot;:&quot;Eudora, KS, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-95.09859466552734,&quot;latitude&quot;:38.94660949707031},&quot;id&quot;:&quot;Eudora, KS, United States 38.95 -95.10&quot;},{&quot;placeTitle&quot;:&quot;Eudora, MO, United States&quot;,&quot;title&quot;:&quot;Eudora, MO, United States&quot;,&quot;caption&quot;:&quot;Eudora, MO, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-93.53770446777344,&quot;latitude&quot;:37.4825439453125},&quot;id&quot;:&quot;Eudora, MO, United States 37.48 -93.54&quot;},{&quot;placeTitle&quot;:&quot;Fort Lauderdale, FL, United States&quot;,&quot;title&quot;:&quot;Fort Lauderdale, FL, United States&quot;,&quot;caption&quot;:&quot;Fort Lauderdale, FL, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-80.1430435180664,&quot;latitude&quot;:26.124160766601562},&quot;id&quot;:&quot;Fort Lauderdale, FL, United States 26.12 -80.14&quot;},{&quot;placeTitle&quot;:&quot;Fort Collins, CO, United States&quot;,&quot;title&quot;:&quot;Fort Collins, CO, United States&quot;,&quot;caption&quot;:&quot;Fort Collins, CO, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-105.08163452148438,&quot;latitude&quot;:40.588993072509766},&quot;id&quot;:&quot;Fort Collins, CO, United States 40.59 -105.08&quot;},{&quot;placeTitle&quot;:&quot;Fort Wayne, IN, United States&quot;,&quot;title&quot;:&quot;Fort Wayne, IN, United States&quot;,&quot;caption&quot;:&quot;Fort Wayne, IN, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-85.13732147216797,&quot;latitude&quot;:41.07963180541992},&quot;id&quot;:&quot;Fort Wayne, IN, United States 41.08 -85.14&quot;},{&quot;placeTitle&quot;:&quot;Monterey, CA, United States&quot;,&quot;title&quot;:&quot;Monterey, CA, United States&quot;,&quot;caption&quot;:&quot;Monterey, CA, United States&quot;,&quot;coordinates&quot;:{&quot;longitude&quot;:-121.8979263305664,&quot;latitude&quot;:36.597389221191406},&quot;id&quot;:&quot;Monterey, CA, United States 36.60 -121.90&quot;}]" data-zoom="8.319778745260226" data-map-center="{&quot;lat&quot;:36.75631145307725,&quot;lng&quot;:-96.83199310302736}" data-marker-color="red" data-show-fullscreen-button="true">
  <ul>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=37.779380798339844,-122.4184341430664">San Fran, CA, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=35.0882453918457,-106.65155029296875">Albuquerque, NM, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=39.525943756103516,-119.81256866455078">Reno, NV, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=45.68898391723633,-123.88328552246094">Wheeler, OR, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=38.973148345947266,-95.2357177734375">Lawrence, KS, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=44.97776412963867,-93.26506805419922">Minneapolis, MN, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=39.73921203613281,-104.99030303955078">Denver, CO, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=41.31170654296875,-105.59222412109375">Laramie, WY, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=39.099761962890625,-94.57797241210938">Kansas City, MO, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=43.6153450012207,-116.20197296142578">Boise, ID, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=40.759552001953125,-111.88819885253906">Salt Lake City, UT, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=42.32939147949219,-83.04492950439453">Detroit, MI, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=39.96195983886719,-83.0030517578125">Columbus, OH, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=36.16606521606445,-86.77780151367188">Nashville, TN, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=35.468971252441406,-97.52123260498047">Oklahoma City, OK, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=33.4482536315918,-112.07661437988281">Phoenix, AZ, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=32.77556610107422,-96.79559326171875">Dallas, TX, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=44.92047119140625,-123.31564331054688">Dallas, OR, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=33.92463302612305,-84.84061431884766">Dallas, GA, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=35.317134857177734,-81.17720031738281">Dallas, NC, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=42.65290069580078,-73.75669860839844">New York, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=40.22140121459961,-74.77140045166016">New Jersey, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=44.307701110839844,-69.78070068359375">Maine, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=34.0533447265625,-118.24234771728516">Los Angeles, CA, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=37.06039810180664,-120.84949493408203">Los Banos, CA, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=36.166748046875,-115.1487045288086">Las Vegas, NV, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=32.45317459106445,-84.9877700805664">Columbus, GA, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=29.705373764038086,-96.5421142578125">Columbus, TX, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=41.88371658325195,-87.63238525390625">Chicago, IL, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=44.08237838745117,-103.22654724121094">Rapid City, SD, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=41.97765350341797,-91.66939544677734">Cedar Rapids, IA, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=36.45463180541992,-77.65789794921875">Roanoke Rapids, NC, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=42.9691162109375,-85.67011260986328">Grand Rapids, MI, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=41.578834533691406,-90.34346008300781">Rapids City, IL, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=46.586753845214844,-112.02030181884766">Montana, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=38.89543914794922,-77.03128051757812">Washington, DC, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=46.8790283203125,-96.7839126586914">Fargo, ND, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=46.87195587158203,-96.88597106933594">West Fargo, ND, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=38.94660949707031,-95.09859466552734">Eudora, KS, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=37.4825439453125,-93.53770446777344">Eudora, MO, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=26.124160766601562,-80.1430435180664">Fort Lauderdale, FL, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=40.588993072509766,-105.08163452148438">Fort Collins, CO, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=41.07963180541992,-85.13732147216797">Fort Wayne, IN, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=36.597389221191406,-121.8979263305664">Monterey, CA, United States</a></li>
  </ul>
</div>
<!-- /wp:jetpack/map -->

Investigation

After a lot of digging I discovered that when saving the post, the wp_kses filter chokes on the block's HTML, and strips out all attributes for the opening div:

<div>
  <ul>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=37.779380798339844,-122.4184341430664">San Fran, CA, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=35.0882453918457,-106.65155029296875">Albuquerque, NM, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=39.525943756103516,-119.81256866455078">Reno, NV, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=45.68898391723633,-123.88328552246094">Wheeler, OR, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=38.973148345947266,-95.2357177734375">Lawrence, KS, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=44.97776412963867,-93.26506805419922">Minneapolis, MN, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=39.73921203613281,-104.99030303955078">Denver, CO, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=41.31170654296875,-105.59222412109375">Laramie, WY, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=39.099761962890625,-94.57797241210938">Kansas City, MO, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=43.6153450012207,-116.20197296142578">Boise, ID, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=40.759552001953125,-111.88819885253906">Salt Lake City, UT, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=42.32939147949219,-83.04492950439453">Detroit, MI, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=39.96195983886719,-83.0030517578125">Columbus, OH, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=36.16606521606445,-86.77780151367188">Nashville, TN, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=35.468971252441406,-97.52123260498047">Oklahoma City, OK, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=33.4482536315918,-112.07661437988281">Phoenix, AZ, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=32.77556610107422,-96.79559326171875">Dallas, TX, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=44.92047119140625,-123.31564331054688">Dallas, OR, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=33.92463302612305,-84.84061431884766">Dallas, GA, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=35.317134857177734,-81.17720031738281">Dallas, NC, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=42.65290069580078,-73.75669860839844">New York, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=40.22140121459961,-74.77140045166016">New Jersey, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=44.307701110839844,-69.78070068359375">Maine, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=34.0533447265625,-118.24234771728516">Los Angeles, CA, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=37.06039810180664,-120.84949493408203">Los Banos, CA, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=36.166748046875,-115.1487045288086">Las Vegas, NV, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=32.45317459106445,-84.9877700805664">Columbus, GA, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=29.705373764038086,-96.5421142578125">Columbus, TX, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=41.88371658325195,-87.63238525390625">Chicago, IL, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=44.08237838745117,-103.22654724121094">Rapid City, SD, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=41.97765350341797,-91.66939544677734">Cedar Rapids, IA, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=36.45463180541992,-77.65789794921875">Roanoke Rapids, NC, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=42.9691162109375,-85.67011260986328">Grand Rapids, MI, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=41.578834533691406,-90.34346008300781">Rapids City, IL, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=46.586753845214844,-112.02030181884766">Montana, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=38.89543914794922,-77.03128051757812">Washington, DC, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=46.8790283203125,-96.7839126586914">Fargo, ND, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=46.87195587158203,-96.88597106933594">West Fargo, ND, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=38.94660949707031,-95.09859466552734">Eudora, KS, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=37.4825439453125,-93.53770446777344">Eudora, MO, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=26.124160766601562,-80.1430435180664">Fort Lauderdale, FL, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=40.588993072509766,-105.08163452148438">Fort Collins, CO, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=41.07963180541992,-85.13732147216797">Fort Wayne, IN, United States</a></li>
    <li><a href="https://www.google.com/maps/search/?api=1&amp;query=36.597389221191406,-121.8979263305664">Monterey, CA, United States</a></li>
  </ul>
</div>

Possible solutions

1. Keep digging

Dig deeper, see what trips wp_kses, and fix this.

2. Simplify rendering

Revisit map block rendering: currently there's a lot of duplication going on regarding the points: they're included in the block attributes, the data-points HTML attribute and are rendered as a fallback in HTML inside the block content.

It should be possible to removethe data-points HTML attribute, and move that data inside the fallback HTML. The JavaScript could then pick up this information. This would avoid data duplication inside the rendered HTML.

The block could for example render this:

<div class="wp-block-jetpack-map" data-map-style="default" data-map-details="true">
  <ul>
    <li data-lat="37.779380798339844" data-lng="-122.4184341430664" data-title="San Fran, CA, United States">
      <a href="https://www.google.com/maps/search/?api=1&amp;query=37.779380798339844,-122.4184341430664">San Fran, CA, United States</a>
    </li>
    <li>...</li>
  </ul>
</div>

The downside of this solution: it would involve a block migration + writing code to support the old and new scenarios. But it is IMHO the more suitable solution.

csonnek commented 10 months ago

Another report in https://wordpress.com/forums/topic/map-block-displaying-as-a-list/?view=all