Added 'stencil' property to renderer system for enabling stencil buffer on GL context (#5509)

Co-authored-by: Noeri Huisman <mrxz@users.noreply.github.com>

Author: mrxz

docs/components/renderer.md

@@ -40,6 +40,7 @@ It also configures presentation attributes when entering WebVR/WebXR.
 | logarithmicDepthBuffer  | Whether to use a logarithmic depth buffer.                                      | auto          |
 | precision               | Fragment shader [precision][precision] : low, medium or high.                   | high          |
 | alpha                   | Whether the canvas should contain an alpha buffer.                              | true          |
+| stencil                 | Whether the canvas should contain a stencil buffer.                             | false         |
 | toneMapping             | Type of toneMapping to use, one of: 'no', 'ACESFilmic', 'linear', 'reinhard', 'cineon'  | 'no'          |
 | exposure                | When any toneMapping other than "no" is used this can be used to make the overall scene brighter or darker  | 1          |
 | anisotropy              | Default anisotropic filtering sample rate to use for textures                   | 1             |

src/core/scene/a-scene.js

@@ -640,6 +640,10 @@ class AScene extends AEntity {
         rendererConfig.alpha = rendererAttr.alpha === 'true';
       }
 
+      if (rendererAttr.stencil) {
+        rendererConfig.stencil = rendererAttr.stencil === 'true';
+      }
+
       if (rendererAttr.multiviewStereo) {
         rendererConfig.multiviewStereo = rendererAttr.multiviewStereo === 'true';
       }

src/systems/renderer.js

@@ -24,6 +24,7 @@ module.exports.System = registerSystem('renderer', {
     sortTransparentObjects: {default: false},
     colorManagement: {default: true},
     alpha: {default: true},
+    stencil: {default: false},
     foveationLevel: {default: 1}
   },