Enable fill extrusion pattern render tests [Core] (#4261)

Co-authored-by: pre-commit-ci[bot] <66853113+pre-commit-ci[bot]@users.noreply.github.com>
Co-authored-by: Bart Louwers <bart@emeel.net>
Co-authored-by: Adrian Cojocaru <adrian.cojocaru92@yahoo.com>

include/mbgl/shaders/webgpu/common.hpp

@@ -21,6 +21,29 @@ const LINE_NORMAL_SCALE: f32 = 1.0 / 63.0;  // 1.0 / (127 / 2)
 const MAX_LINE_DISTANCE: f32 = 32767.0;
 const SDF_PX: f32 = 8.0;
 
+// WebGPU equivalent of GLSL mod function
+fn glMod(x: f32, y: f32) -> f32 {
+    return x - y * floor(x / y);
+}
+
+fn glMod2(x: vec2<f32>, y: f32) -> vec2<f32> {
+    return x - y * floor(x / y);
+}
+
+fn glMod2v(x: vec2<f32>, y: vec2<f32>) -> vec2<f32> {
+    return x - y * floor(x / y);
+}
+
+// GLSL compatibility helpers
+fn gl_mod(x: vec2<f32>, y: vec2<f32>) -> vec2<f32> {
+    return glMod2v(x, y);
+}
+
+// Radians conversion
+fn radians(degrees: f32) -> f32 {
+    return PI * degrees / 180.0;
+}
+
 // Helper functions for unpacking data
 fn unpack_float(packedValue: f32) -> vec2<f32> {
     let packedIntValue = i32(packedValue);
@@ -30,7 +53,7 @@ fn unpack_float(packedValue: f32) -> vec2<f32> {
 
 fn unpack_opacity(packedOpacity: f32) -> vec2<f32> {
     let intOpacity = i32(packedOpacity) / 2;
-    return vec2<f32>(f32(intOpacity) / 127.0, packedOpacity % 2.0);
+    return vec2<f32>(f32(intOpacity) / 127.0, glMod(packedOpacity, 2.0));
 }
 
 // Decode a color that has been packed into two floats
@@ -55,34 +78,11 @@ fn unpack_mix_color(packedColors: vec4<f32>, t: f32) -> vec4<f32> {
 // Get pattern position for texture atlas lookups
 fn get_pattern_pos(pixel_coord_upper: vec2<f32>, pixel_coord_lower: vec2<f32>,
                    pattern_size: vec2<f32>, tile_units_to_pixels: f32, pos: vec2<f32>) -> vec2<f32> {
-    let offset_a = (pixel_coord_upper % pattern_size) * 256.0;
-    let offset_b = (offset_a % pattern_size) * 256.0 + pixel_coord_lower;
-    let offset = offset_b % pattern_size;
+    let offset_a = gl_mod(pixel_coord_upper, pattern_size) * 256.0;
+    let offset_b = gl_mod(offset_a, pattern_size) * 256.0 + pixel_coord_lower;
+    let offset = gl_mod(offset_b, pattern_size);
     return (tile_units_to_pixels * pos + offset) / pattern_size;
 }
-
-// Radians conversion
-fn radians(degrees: f32) -> f32 {
-    return PI * degrees / 180.0;
-}
-
-// WebGPU equivalent of GLSL mod function
-fn glMod(x: f32, y: f32) -> f32 {
-    return x - y * floor(x / y);
-}
-
-fn glMod2(x: vec2<f32>, y: f32) -> vec2<f32> {
-    return x - y * floor(x / y);
-}
-
-fn glMod2v(x: vec2<f32>, y: vec2<f32>) -> vec2<f32> {
-    return x - y * floor(x / y);
-}
-
-// GLSL compatibility helpers
-fn gl_mod(x: vec2<f32>, y: vec2<f32>) -> vec2<f32> {
-    return glMod2v(x, y);
-}
 )";
 };
 

include/mbgl/shaders/webgpu/fill_extrusion.hpp

@@ -189,10 +189,10 @@ struct FillExtrusionPatternDrawableUBO {
     tile_ratio: f32,
     base_t: f32,
     height_t: f32,
+    color_t: f32,
     pattern_from_t: f32,
     pattern_to_t: f32,
     pad1: f32,
-    pad2: f32,
 };
 
 struct FillExtrusionPatternTilePropsUBO {

metrics/ignores/platform-all.json

@@ -75,13 +75,6 @@
     "render-tests/extent/1024-circle": "needs investigation",
     "render-tests/feature-state/promote-id": "https://github.com/mapbox/mapbox-gl-native/issues/16016",
     "render-tests/fill-extrusion-geometry/linestring": "https://github.com/mapbox/mapbox-gl-native/pull/14240",
-    "render-tests/fill-extrusion-pattern/@2x": "https://github.com/mapbox/mapbox-gl-js/issues/3327",
-    "render-tests/fill-extrusion-pattern/feature-expression": "https://github.com/mapbox/mapbox-gl-js/issues/3327",
-    "render-tests/fill-extrusion-pattern/function": "https://github.com/mapbox/mapbox-gl-js/issues/3327",
-    "render-tests/fill-extrusion-pattern/function-2": "https://github.com/mapbox/mapbox-gl-js/issues/3327",
-    "render-tests/fill-extrusion-pattern/literal": "https://github.com/mapbox/mapbox-gl-js/issues/3327",
-    "render-tests/fill-extrusion-pattern/opacity": "https://github.com/mapbox/mapbox-gl-js/issues/3327",
-    "render-tests/fill-extrusion-pattern/tile-buffer": "https://github.com/mapbox/mapbox-gl-js/issues/3327",
     "render-tests/fill-pattern/update-feature-state": "https://github.com/mapbox/mapbox-gl-native/issues/15895",
     "render-tests/geojson/inline-linestring-fill": "current behavior is arbitrary",
     "render-tests/icon-text-fit/text-variable-anchor-overlap": "https://github.com/mapbox/mapbox-gl-native/issues/15809",

metrics/ignores/platform-macos-webgpu.json

@@ -4,5 +4,12 @@
     "render-tests/regressions/mapbox-gl-js#7066": "Failing with mbgl-render-test",
     "render-tests/fill-outline-color/zoom-and-property-function": "It will be fixed after triangulated lines will support data driven properties",
     "render-tests/fill-outline-color/property-function": "It will be fixed after triangulated lines will support data driven properties",
-    "render-tests/fill-extrusion-color/function": "Layer Z Fighting: https://github.com/maplibre/maplibre-native/issues/1847"
+    "render-tests/fill-extrusion-color/function": "Layer Z Fighting: https://github.com/maplibre/maplibre-native/issues/1847",
+    "render-tests/fill-extrusion-pattern/@2x": "https://github.com/mapbox/mapbox-gl-js/issues/3327",
+    "render-tests/fill-extrusion-pattern/feature-expression": "https://github.com/mapbox/mapbox-gl-js/issues/3327",
+    "render-tests/fill-extrusion-pattern/function": "https://github.com/mapbox/mapbox-gl-js/issues/3327",
+    "render-tests/fill-extrusion-pattern/function-2": "https://github.com/mapbox/mapbox-gl-js/issues/3327",
+    "render-tests/fill-extrusion-pattern/literal": "https://github.com/mapbox/mapbox-gl-js/issues/3327",
+    "render-tests/fill-extrusion-pattern/opacity": "https://github.com/mapbox/mapbox-gl-js/issues/3327",
+    "render-tests/fill-extrusion-pattern/tile-buffer": "https://github.com/mapbox/mapbox-gl-js/issues/3327"
 }