Fix promoteId for line layers

src/data/bucket/line_bucket.js

@@ -121,7 +121,7 @@ class LineBucket implements Bucket {
         const lineSortKey = this.layers[0].layout.get('line-sort-key');
         const bucketFeatures = [];
 
-        for (const {feature, index, sourceLayerIndex} of features) {
+        for (const {feature, id, index, sourceLayerIndex} of features) {
             if (!this.layers[0]._featureFilter(new EvaluationParameters(this.zoom), feature)) continue;
 
             const geometry = loadGeometry(feature);
@@ -130,7 +130,7 @@ class LineBucket implements Bucket {
                 undefined;
 
             const bucketFeature: BucketFeature = {
-                id: feature.id,
+                id,
                 properties: feature.properties,
                 type: feature.type,
                 sourceLayerIndex,

src/style-spec/reference/v8.json

@@ -177,6 +177,10 @@
       "type": "string",
       "doc": "Contains an attribution to be displayed when the map is shown to a user."
     },
+    "promoteId": {
+      "type": "promoteId",
+      "doc": "A property to use as a feature id (for feature state). Either a property name, or an object of the form `{<sourceLayer>: <propertyName>}`. If specified as a string for a vector tile source, the same property is used across all its source layers."
+    },
     "*": {
       "type": "*",
       "doc": "Other keys to configure the data source."
@@ -317,10 +321,6 @@
       "default": "mapbox",
       "doc": "The encoding used by this source. Mapbox Terrain RGB is used by default"
     },
-    "promoteId": {
-      "type": "promoteId",
-      "doc": "A property to use as a feature id (for feature state). Either a property name, or an object of the form `{<sourceLayer>: <propertyName>}`."
-    },
     "*": {
       "type": "*",
       "doc": "Other keys to configure the data source."
@@ -5786,5 +5786,11 @@
       "type": "property-type",
       "doc": "Property is constant across all zoom levels and property values."
     }
+  },
+  "promoteId": {
+    "*": {
+      "type": "string",
+      "doc": "A name of a feature property to use as ID for feature state."
+    }
   }
 }

test/integration/render-tests/feature-state/promote-id-fill-extrusion/style.json

@@ -0,0 +1,161 @@
+{
+  "version": 8,
+  "metadata": {
+    "test": {
+      "height": 128,
+      "width": 512,
+      "operations": [
+        [
+          "setFeatureState",
+          {
+            "source": "geojson",
+            "id": "9007199254740992"
+          },
+          {
+            "color": "red"
+          }
+        ],
+        [
+          "setFeatureState",
+          {
+            "source": "geojson",
+            "id": "1.2"
+          },
+          {
+            "color": "blue"
+          }
+        ],
+        [
+          "wait"
+        ]
+      ]
+    }
+  },
+  "sources": {
+    "geojson": {
+      "type": "geojson",
+      "promoteId": "foo",
+      "data": {
+        "type": "FeatureCollection",
+        "features": [{
+          "type": "Feature",
+          "geometry": {
+            "type": "Polygon",
+            "coordinates": [
+              [
+                [
+                  -0.0005,
+                  -0.0001
+                ],
+                [
+                  -0.0005,
+                  0.0001
+                ],
+                [
+                  -0.0003,
+                  0.0001
+                ],
+                [
+                  -0.0003,
+                  -0.0001
+                ],
+                [
+                  -0.0005,
+                  -0.0001
+                ]
+              ]
+            ]
+          },
+          "properties": {
+            "foo": "9007199254740992"
+          }
+        }, {
+          "type": "Feature",
+          "geometry": {
+            "type": "Polygon",
+            "coordinates": [
+              [
+                [
+                  -0.0001,
+                  -0.0001
+                ],
+                [
+                  -0.0001,
+                  0.0001
+                ],
+                [
+                  0.0001,
+                  0.0001
+                ],
+                [
+                  0.0001,
+                  -0.0001
+                ],
+                [
+                  -0.0001,
+                  -0.0001
+                ]
+              ]
+            ]
+          },
+          "properties": {
+            "foo": "9007199254740993"
+          }
+        }, {
+          "type": "Feature",
+          "geometry": {
+            "type": "Polygon",
+            "coordinates": [
+              [
+                [
+                  0.0003,
+                  -0.0001
+                ],
+                [
+                  0.0003,
+                  0.0001
+                ],
+                [
+                  0.0005,
+                  0.0001
+                ],
+                [
+                  0.0005,
+                  -0.0001
+                ],
+                [
+                  0.0003,
+                  -0.0001
+                ]
+              ]
+            ]
+          },
+          "properties": {
+            "foo": "1.2"
+          }
+        }]
+      }
+    }
+  },
+  "pitch": 60,
+  "zoom": 18,
+  "layers": [
+    {
+      "id": "fill-extrusion",
+      "type": "fill-extrusion",
+      "source": "geojson",
+      "paint": {
+        "fill-extrusion-height": 10,
+        "fill-extrusion-base": 0,
+        "fill-extrusion-color": [
+          "coalesce",
+          [
+            "feature-state",
+            "color"
+          ],
+          "black"
+        ]
+      }
+    }
+  ]
+}

test/integration/render-tests/feature-state/promote-id-fill/style.json

@@ -0,0 +1,114 @@
+{
+  "version": 8,
+  "metadata": {
+    "test": {
+      "width": 64,
+      "height": 32,
+      "operations": [
+        [
+          "setFeatureState",
+          {
+            "source": "geojson",
+            "id": "9007199254740992"
+          },
+          {
+            "color": "red"
+          }
+        ],
+        [
+          "setFeatureState",
+          {
+            "source": "geojson",
+            "id": "1.2"
+          },
+          {
+            "color": "blue"
+          }
+        ],
+        [
+          "wait"
+        ]
+      ]
+    }
+  },
+  "zoom": 2,
+  "sources": {
+    "geojson": {
+      "type": "geojson",
+      "promoteId": "foo",
+      "data": {
+        "type": "FeatureCollection",
+        "features": [{
+          "type": "Feature",
+          "geometry": {
+            "type": "Polygon",
+            "coordinates": [
+              [
+                [ -5, -1 ],
+                [ -5, 1 ],
+                [ -3, 1 ],
+                [ -3, -1 ],
+                [ -5, -1 ]
+              ]
+            ]
+          },
+          "properties": {
+            "foo": "9007199254740992"
+          }
+        }, {
+          "type": "Feature",
+          "geometry": {
+            "type": "Polygon",
+            "coordinates": [
+              [
+                [ -1, -1 ],
+                [ -1, 1 ],
+                [ 1, 1 ],
+                [ 1, -1 ],
+                [ -0.5, -1 ]
+              ]
+            ]
+          },
+          "properties": {
+            "foo": "9007199254740993"
+          }
+        }, {
+          "type": "Feature",
+          "geometry": {
+            "type": "Polygon",
+            "coordinates": [
+              [
+                [ 3, -1 ],
+                [ 3, 1 ],
+                [ 5, 1 ],
+                [ 5, -1 ],
+                [ 3, -1 ]
+              ]
+            ]
+          },
+          "properties": {
+            "foo": "1.2"
+          }
+        }]
+      }
+    }
+  },
+  "layers": [
+    {
+      "id": "fill",
+      "type": "fill",
+      "source": "geojson",
+      "paint": {
+        "fill-antialias": false,
+        "fill-color": [
+          "coalesce",
+          [
+            "feature-state",
+            "color"
+          ],
+          "black"
+        ]
+      }
+    }
+  ]
+}