fix: ios spa多次创建导致canvas白屏。Closed #630

antvis · Mar 18, 2020 · ea3f84f · ea3f84f
1 parent 1ad16fa
commit ea3f84f
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 1 deletion.
diff --git a/src/graphic/canvas.js b/src/graphic/canvas.js
@@ -181,6 +181,12 @@ class Canvas extends EventEmit {
     if (this.get('destroyed')) {
       return;
     }
+    // 需要清理 canvas 画布内容，否则会导致 spa 应用 ios 下 canvas 白屏
+    // https://stackoverflow.com/questions/52532614/total-canvas-memory-use-exceeds-the-maximum-limit-safari-12
+    // https://github.com/antvis/F2/issues/630
+    const el = this.get('el');
+    el.width = 0;
+    el.height = 0;
     this.clear();
     this._attrs = {};
     this.set('destroyed', true);

diff --git a/test/unit/graphic/canvas-spec.js b/test/unit/graphic/canvas-spec.js
@@ -134,7 +134,7 @@ describe('Canvas', function() {
 
   it('clear canvas', function() {
     const canvas = new Canvas({
-      el: 'canvas',
+      el: dom,
       width: 500,
       height: 500,
       pixelRatio: 1
@@ -145,6 +145,8 @@ describe('Canvas', function() {
     canvas.clear();
     expect(canvas.getChildren()).to.be.an('array').that.is.empty;
     canvas.destroy();
+    expect(dom.width).to.equal(0);
+    expect(dom.height).to.equal(0);
     expect(canvas.isDestroyed()).to.be.true;
     document.body.removeChild(dom);
   });