[core] fix rendering of fill outlines that have a different color than the fill itself

4 files changed, 24 insertions, 36 deletions

diff --git a/mapbox-gl-js b/mapbox-gl-js
-Subproject 9d72cc2c461673525f1a6321314d2460c0f3324
+Subproject b93bc451ccb57a3a0debddab9590d37b5cb06d4
diff --git a/package.json b/package.json
index 0cd6b450c7..f2329fb9fd 100644
--- a/package.json
+++ b/package.json
@@ -22,6 +22,7 @@
     "ejs": "^2.4.1",
     "express": "^4.11.1",
     "lodash": "^4.16.4",
+    "mapbox-gl-styles": "2.0.2",
     "pixelmatch": "^4.0.2",
     "pngjs": "^3.0.0",
     "request": "^2.72.0",
diff --git a/platform/node/test/ignores.json b/platform/node/test/ignores.json
index 70740f67f2..72282e7028 100644
--- a/platform/node/test/ignores.json
+++ b/platform/node/test/ignores.json
@@ -27,12 +27,6 @@
   "render-tests/fill-extrusion-pattern/literal": "https://github.com/mapbox/mapbox-gl-js/issues/3327",
   "render-tests/fill-extrusion-pattern/missing": "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-outline-color/fill": "https://github.com/mapbox/mapbox-gl-native/pull/8760",
-  "render-tests/fill-outline-color/function": "https://github.com/mapbox/mapbox-gl-native/issues/6927",
-  "render-tests/fill-outline-color/literal": "https://github.com/mapbox/mapbox-gl-native/issues/6927",
-  "render-tests/fill-outline-color/multiply": "https://github.com/mapbox/mapbox-gl-native/issues/6927",
-  "render-tests/fill-outline-color/opacity": "https://github.com/mapbox/mapbox-gl-native/issues/6927",
-  "render-tests/fill-outline-color/zoom-and-property-function": "https://github.com/mapbox/mapbox-gl-native/issues/6927",
   "render-tests/geojson/inline-linestring-fill": "current behavior is arbitrary",
   "render-tests/geojson/inline-polygon-symbol": "behavior needs reconciliation with gl-js",
   "render-tests/icon-size/composite-function-high-base-plain": "https://github.com/mapbox/mapbox-gl-native/issues/8654",
@@ -46,6 +40,7 @@
   "render-tests/line-join/property-function": "https://github.com/mapbox/mapbox-gl-js/pull/5020",
   "render-tests/line-join/property-function-dasharray": "https://github.com/mapbox/mapbox-gl-js/pull/5020",
   "render-tests/regressions/mapbox-gl-js#2305": "https://github.com/mapbox/mapbox-gl-native/issues/6927",
+  "render-tests/regressions/mapbox-gl-js#2929": "skip - needs issue",
   "render-tests/regressions/mapbox-gl-js#3010": "skip - needs issue",
   "render-tests/regressions/mapbox-gl-js#3548": "skip - needs issue",
   "render-tests/regressions/mapbox-gl-js#3682": "https://github.com/mapbox/mapbox-gl-js/issues/3682",
diff --git a/src/mbgl/renderer/layers/render_fill_layer.cpp b/src/mbgl/renderer/layers/render_fill_layer.cpp
index 2a61a9e993..394642a50d 100644
--- a/src/mbgl/renderer/layers/render_fill_layer.cpp
+++ b/src/mbgl/renderer/layers/render_fill_layer.cpp
@@ -64,15 +64,15 @@ void RenderFillLayer::render(PaintParameters& parameters, RenderSource*) {
             assert(dynamic_cast<FillBucket*>(tile.tile.getBucket(*baseImpl)));
             FillBucket& bucket = *reinterpret_cast<FillBucket*>(tile.tile.getBucket(*baseImpl));
 
-            auto draw = [&] (uint8_t sublayer,
-                             auto& program,
+            auto draw = [&] (auto& program,
                              const auto& drawMode,
+                             const auto& depthMode,
                              const auto& indexBuffer,
                              const auto& segments) {
                 program.get(evaluated).draw(
                     parameters.context,
                     drawMode,
-                    parameters.depthModeForSublayer(sublayer, gl::DepthMode::ReadWrite),
+                    depthMode,
                     parameters.stencilModeForClipping(tile.clip),
                     parameters.colorModeForRenderPass(),
                     FillProgram::UniformValues {
@@ -93,29 +93,23 @@ void RenderFillLayer::render(PaintParameters& parameters, RenderSource*) {
                 );
             };
 
-            if (evaluated.get<FillAntialias>() && !unevaluated.get<FillOutlineColor>().isUndefined() && parameters.pass == RenderPass::Translucent) {
-                draw(2,
-                     parameters.programs.fillOutline,
-                     gl::Lines { 2.0f },
-                     *bucket.lineIndexBuffer,
-                     bucket.lineSegments);
-            }
-
             // Only draw the fill when it's opaque and we're drawing opaque fragments,
             // or when it's translucent and we're drawing translucent fragments.
             if ((evaluated.get<FillColor>().constantOr(Color()).a >= 1.0f
               && evaluated.get<FillOpacity>().constantOr(0) >= 1.0f) == (parameters.pass == RenderPass::Opaque)) {
-                draw(1,
-                     parameters.programs.fill,
+                draw(parameters.programs.fill,
                      gl::Triangles(),
+                     parameters.depthModeForSublayer(1, gl::DepthMode::ReadWrite),
                      *bucket.triangleIndexBuffer,
                      bucket.triangleSegments);
             }
 
-            if (evaluated.get<FillAntialias>() && unevaluated.get<FillOutlineColor>().isUndefined() && parameters.pass == RenderPass::Translucent) {
-                draw(2,
-                     parameters.programs.fillOutline,
-                     gl::Lines { 2.0f },
+            if (evaluated.get<FillAntialias>() && parameters.pass == RenderPass::Translucent) {
+                draw(parameters.programs.fillOutline,
+                     gl::Lines{ 2.0f },
+                     parameters.depthModeForSublayer(
+                         unevaluated.get<FillOutlineColor>().isUndefined() ? 2 : 0,
+                         gl::DepthMode::ReadOnly),
                      *bucket.lineIndexBuffer,
                      bucket.lineSegments);
             }
@@ -138,15 +132,15 @@ void RenderFillLayer::render(PaintParameters& parameters, RenderSource*) {
             assert(dynamic_cast<FillBucket*>(tile.tile.getBucket(*baseImpl)));
             FillBucket& bucket = *reinterpret_cast<FillBucket*>(tile.tile.getBucket(*baseImpl));
 
-            auto draw = [&] (uint8_t sublayer,
-                             auto& program,
+            auto draw = [&] (auto& program,
                              const auto& drawMode,
+                             const auto& depthMode,
                              const auto& indexBuffer,
                              const auto& segments) {
                 program.get(evaluated).draw(
                     parameters.context,
                     drawMode,
-                    parameters.depthModeForSublayer(sublayer, gl::DepthMode::ReadWrite),
+                    depthMode,
                     parameters.stencilModeForClipping(tile.clip),
                     parameters.colorModeForRenderPass(),
                     FillPatternUniforms::values(
@@ -171,21 +165,19 @@ void RenderFillLayer::render(PaintParameters& parameters, RenderSource*) {
                 );
             };
 
-            draw(0,
-                 parameters.programs.fillPattern,
+            draw(parameters.programs.fillPattern,
                  gl::Triangles(),
+                 parameters.depthModeForSublayer(1, gl::DepthMode::ReadWrite),
                  *bucket.triangleIndexBuffer,
                  bucket.triangleSegments);
 
-            if (!evaluated.get<FillAntialias>() || !unevaluated.get<FillOutlineColor>().isUndefined()) {
-                continue;
+            if (evaluated.get<FillAntialias>() && unevaluated.get<FillOutlineColor>().isUndefined()) {
+                draw(parameters.programs.fillOutlinePattern,
+                     gl::Lines { 2.0f },
+                     parameters.depthModeForSublayer(2, gl::DepthMode::ReadOnly),
+                     *bucket.lineIndexBuffer,
+                     bucket.lineSegments);
             }
-
-            draw(2,
-                 parameters.programs.fillOutlinePattern,
-                 gl::Lines { 2.0f },
-                 *bucket.lineIndexBuffer,
-                 bucket.lineSegments);
         }
     }
 }