[Bug] Picking seems to pick the wrong layer with two pickable layers

Description

Duct-taping the IconLayer and ScenegraphLayer examples from the doco together, I'm able to reproduce an issue I've seen with picking - the wrong layer seems to be picked and I'm struggling to work out why.

Repro (or just see the codepen):

Result: hovering over either icons or scenegraph ONLY triggers the scenegraph hover behaviour:

Reversing [scenelayer, layer] reverses the effect: hovering anything triggers ONLY the icon hover behaviour.

Using Firefox on Linux with Zink GL renderer, I'll test a less weird setup in a sec.

Flavors

• React
• Python/Jupyter notebook
• MapboxLayer
• GoogleMapsOverlay
• CartoLayer
• DeckLayer/DeckRenderer for ArcGIS

Expected Behavior

No response

Steps to Reproduce

Reproduced in a codepen: https://codepen.io/akdor1154/pen/LYBYGxx

/*
* https://deck.gl/docs/api-reference/layers/icon-layer
*/
const {DeckGL, IconLayer, DataFilterExtension, ScenegraphLayer} = deck;

const {GLTFLoader} = loaders;

let rawData = [
  {"name":"16th St. Mission (16TH)","code":"16","address":"2000 Mission Street, San Francisco CA 94110","entries":"12409","exits":"12351","coordinates":[-122.419694,37.765062]},
  {"name":"Civic Center/UN Plaza (CIVC)","code":"CC","address":"1150 Market Street, San Francisco CA 94102","entries":"24798","exits":"22626","coordinates":[-122.413756,37.779528]},
  {"name":"Montgomery St. (MONT)","code":"MT","address":"598 Market Street, San Francisco CA 94104","entries":"43430","exits":"45128","coordinates":[-122.401407,37.789256]},
  {"name":"Powell St. (POWL)","code":"PL","address":"899 Market Street, San Francisco CA 94102","entries":"29460","exits":"25621","coordinates":[-122.406857,37.784991]},
];

const iconData = rawData.filter((s,i) => i < 2);

const length = iconData.length;
const pos = Float64Array.from(iconData.map(d => d.coordinates).flat(1));
const size = new Float32Array(length).fill(3);
const colors = Uint8ClampedArray.from(iconData.map(d => [Math.sqrt(d.exits), 140, 0, 255]).flat(1));
const icons = new Uint8Array(length).fill(0);
const t = Float32Array.from(iconData.map((d, i) => i));

const data = {
  length,
  attributes: {
    getPosition: {value: pos, size: 2},
    getSize: {value: size, size: 1},
    getColor: {value: colors, size: 4},
    getIcon: {value: icons, size: 1},
    getFilterValue: {value: t, size: 1}
  }
}
console.dir({data})

const layer = new IconLayer({
  id: 'icons',
  data: data,
  
  iconAtlas: 'https://raw.githubusercontent.com/visgl/deck.gl-data/master/website/icon-atlas.png',
  iconMapping: {
    0: {
      x: 0,
      y: 0,
      width: 128,
      height: 128,
      //anchorY: 128,
      mask: true
    }
  },
  autoHighlight: true,
  sizeScale: 10,
  pickable: true,
  onHover: (info) => {console.log('icon hover!'); console.log(info); console.dir({hover: info})},
});

const sceneData = rawData.filter((s,i) => i >= 2);

const scenelayer = new ScenegraphLayer({
  id: 'ScenegraphLayer',
  data: sceneData,
  
  _animations: {
    '*': {speed: 5}
  },
  _lighting: 'pbr',
  getOrientation: d => [0, Math.random() * 180, 90],
  getPosition: d => d.coordinates,
  scenegraph: 'https://raw.githubusercontent.com/KhronosGroup/glTF-Sample-Models/master/2.0/BoxAnimated/glTF-Binary/BoxAnimated.glb',
  sizeScale: 500,
  pickable: true,
  
  onHover: (info) => {console.log('scenegraph hover!'); console.log(info); console.dir({hover: info})},
});

new DeckGL({
  mapStyle: 'https://basemaps.cartocdn.com/gl/positron-gl-style/style.json',
  initialViewState: {
    longitude: -122.4,
    latitude: 37.74,
    zoom: 11,
    maxZoom: 20,
    pitch: 30,
    bearing: 0
  },
  controller: true,
  getTooltip: ({object}) => object && `${object.name}
${object.address}`,
  layers: [scenelayer, layer]
});

Environment

• Framework version: deck.gl@latest via unpkg, which seems to be 8.8.20
• Browser: Firefox
• OS: Linux (Pop!_OS 22.04, which has a very new kernel and mesa stack)

Logs

No response

Start with the linked CodePen and the DeckGL layer picking and hover path, comparing the layer order [scenelayer, layer] with its reverse. Done means hovering icon and scenegraph objects invokes the corresponding layer callback instead of only one layer's hover behavior.