Undefined text property for formatted text with multiple empty sections and right to left plugin #6444
Description
maplibre-gl-js version: 5.7.3, also for earlier versions
RTL text plugin version 0.3.0 (from https://github.com/mapbox/mapbox-gl-rtl-text)
browser: Firefox
Steps to Trigger Behavior
This problem only occurs with the right to left plugin enabled, and in particular a layer with a formatted text symbol with more than one section, and all sections result in an empty string.
Style with a layer
{
id: 'standard_station_entrances',
type: 'symbol',
minzoom: 16,
source: 'openrailwaymap_standard',
'source-layer': 'standard_station_entrances',
layout: {
'text-field': ['format',
['coalesce', ['get', 'name'], ''], {},
['coalesce', ['get', 'ref'], ''], {},
],
'text-optional': true,
},
},Data: an object with no properties (both name and ref are null in the example above).
In the line https://github.com/maplibre/maplibre-gl-js/blame/4ac8a61bfd6ce67906b237d977dac8c2580f9813/src/symbol/shaping.ts#L333, the value processedLines is and array of objects, not of arrays, and as such the text set to the tagged lines will be set to undefined.
Further, this causes errors
can't access property "length", this.text is undefined
Stack:
fire evented.ts:153
fire evented.ts:147
fire evented.ts:147
_loadTile source_cache.ts:194
rejected tslib.es6.js:119
(Async: promise callback)
step tslib.es6.js:120
__awaiter tslib.es6.js:121
__awaiter tslib.es6.js:117
_loadTile source_cache.ts:186
_reloadTile source_cache.ts:299
__awaiter tslib.es6.js:121
__awaiter tslib.es6.js:117
_reloadTile maplibre-gl-dev.js:44015
reload source_cache.ts:282
_rtlPluginLoaded style.ts:248
fire evented.ts:132
_requestImport rtl_text_plugin_main_thread.ts:78
fulfilled tslib.es6.js:118
(Async: promise callback)
step tslib.es6.js:120
__awaiter tslib.es6.js:121
__awaiter tslib.es6.js:117
_requestImport rtl_text_plugin_main_thread.ts:75
lazyLoad rtl_text_plugin_main_thread.ts:89
loadVectorData tile.ts:213
loadTile geojson_source.ts:484
fulfilled tslib.es6.js:118
(Async: promise callback)
step tslib.es6.js:120
__awaiter tslib.es6.js:121
__awaiter tslib.es6.js:117
loadTile geojson_source.ts:462
_loadTile source_cache.ts:188
__awaiter tslib.es6.js:121
__awaiter tslib.es6.js:117
_loadTile source_cache.ts:186
_addTile source_cache.ts:918
_updateRetainedTiles source_cache.ts:759
update source_cache.ts:711
_updateSources style.ts:1763
_render map.ts:3349
redraw maplibre-gl-dev.js:65998
throttledResizeCallback map.ts:708
later throttle.ts:24
throttle maplibre-gl-dev.js:58292
_resizeObserver map.ts:718
(Async: ResizeObserverCallback)
Map map.ts:713
<anonymous> ui.js:625
I don't know why the right to left plugin would return other types of objects than expected.
Link to Demonstration
See https://jsbin.com/himisusegi/1/edit?html,console,output
Expected Behavior
No errors.
Actual Behavior
The error above.