新しいタブを開くボタンにツールチップが表示されていると、HTTPキャンバスのコンテンツが消えてしまいます。MacのChrome 49でAngularJSツールチップを使用してキャンバスのコンテンツが消える
これは非常に具体的な症状ですので、私はあなたを歩いてみてください。
私は、次のHTMLでそれを再現することができるよ、残念ながらplunkerかjsfiddleではない:
<html>
<head>
<style>
.container {
height: 300px;
width: 300px;
}
canvas {
border: 1px solid black
}
button {
margin-top: 15px;
}
</style>
</head>
<body ng-app="CanvasTooltipApp">
<div ng-controller="CanvasTooltipCtrl" class="container">
<canvas id="myCanvas" height="300"></canvas>
<button type="button" ng-click="clickMe()" tooltip="The Tooltip Text">Click Me</button>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.15/angular.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.14.3/ui-bootstrap-tpls.js"></script>
<script>
angular.module('CanvasTooltipApp', ['ui.bootstrap']);
angular.module('CanvasTooltipApp').config(function($tooltipProvider) {
$tooltipProvider.options({popupDelay: 1500});
});
angular.module('CanvasTooltipApp').controller('CanvasTooltipCtrl', function($scope) {
var canvas = document.getElementById('myCanvas');
var ctx = canvas.getContext('2d');
ctx.beginPath();
ctx.arc(95, 50, 40, 0, 2 * Math.PI);
ctx.stroke();
$scope.clickMe = function() {
window.open('http://www.google.com', '_blank');
};
});
</script>
</body>
</html>
これは、Mac上のChromeのみ49上に再現されます。
再生するには:(ツールチップが表示される前に!)ボタンをクリックすると、新しいタブが開きます。数秒待ってください。おそらく別の新しいタブを開くかもしれません。その後、すべてのタブを閉じて元のタブに戻ります。キャンバスの形が消えるはずです。
私は、AngularJS 1.3.15とangle-ui-bootstrap 0.14.3を使用します。 普通のブートストラップのツールチップでは再現されていないようです。 角度uiブートストラップでのみ再生されます。
angle-ui-bootstrapのバージョンをアップグレードすることは役に立ちません。
他のブラウザや他のOSでは再生されません。
これはそうだと思います。 私はあなたがplunker/fiddleなしでそれを再現することに成功したことを願っています。
大変ありがとうございます! ダニエル
興味深いことに、参考にしていただきありがとうございます。 Chromeのバグレポートへのリンクを投稿してください。 ありがとうございます –
さて、Chromeは49.0.2623.108に自動更新され、バグは消えました。私はもうあなたのことを再現することはできませんので、私はあなたの更新をお勧めします! –
これはChromeのこのドロップで修正されたバグレポートです - https://codereview.chromium.org/1762783002 –