Fix loseContext/restoreContext (#8835)

Co-authored-by: Matt Karl <matt@mattkarl.com>
pixijs · Nov 12, 2022 · 1c1b6d9 · 1c1b6d9
1 parent c7e892d
commit 1c1b6d9
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 9 deletions.
diff --git a/packages/core/src/context/ContextSystem.ts b/packages/core/src/context/ContextSystem.ts
@@ -120,12 +120,6 @@ export class ContextSystem implements ISystem<ContextOptions>
         this.gl = gl;
         this.renderer.gl = gl;
         this.renderer.CONTEXT_UID = CONTEXT_UID_COUNTER++;
-
-        // restore a context if it was previously lost
-        if (gl.isContextLost() && gl.getExtension('WEBGL_lose_context'))
-        {
-            gl.getExtension('WEBGL_lose_context').restoreContext();
-        }
     }
 
     init(options: ContextOptions): void
@@ -240,6 +234,7 @@ export class ContextSystem implements ISystem<ContextOptions>
         const { gl } = this;
 
         const common = {
+            loseContext: gl.getExtension('WEBGL_lose_context'),
             anisotropicFiltering: gl.getExtension('EXT_texture_filter_anisotropic'),
             floatTextureLinear: gl.getExtension('OES_texture_float_linear'),
 
@@ -258,7 +253,6 @@ export class ContextSystem implements ISystem<ContextOptions>
             Object.assign(this.extensions, common, {
                 drawBuffers: gl.getExtension('WEBGL_draw_buffers'),
                 depthTexture: gl.getExtension('WEBGL_depth_texture'),
-                loseContext: gl.getExtension('WEBGL_lose_context'),
                 vertexArrayObject: gl.getExtension('OES_vertex_array_object')
                     || gl.getExtension('MOZ_OES_vertex_array_object')
                     || gl.getExtension('WEBKIT_OES_vertex_array_object'),
@@ -285,7 +279,17 @@ export class ContextSystem implements ISystem<ContextOptions>
      */
     protected handleContextLost(event: WebGLContextEvent): void
     {
+        // Prevent default to be able to restore the context
         event.preventDefault();
+
+        // Restore the context after this event has exited
+        setTimeout(() =>
+        {
+            if (this.gl.isContextLost() && this.extensions.loseContext)
+            {
+                this.extensions.loseContext.restoreContext();
+            }
+        }, 0);
     }
 
     /** Handles a restored webgl context. */

diff --git a/packages/core/src/framebuffer/FramebufferSystem.ts b/packages/core/src/framebuffer/FramebufferSystem.ts
@@ -53,6 +53,8 @@ export class FramebufferSystem implements ISystem
     /** Sets up the renderer context and necessary buffers. */
     protected contextChange(): void
     {
+        this.disposeAll(true);
+
         const gl = this.gl = this.renderer.gl;
 
         this.CONTEXT_UID = this.renderer.CONTEXT_UID;
@@ -61,8 +63,6 @@ export class FramebufferSystem implements ISystem
         this.hasMRT = true;
         this.writeDepthTexture = true;
 
-        this.disposeAll(true);
-
         // webgl2
         if (this.renderer.context.webGLVersion === 1)
         {