ページ 11

【解決済み】VS CodeでChromeでテスト中スクロールしたときにエラーになります

Posted: 2020年5月28日(木) 23:36
by にゃたま
VS CodeでF5キーを使って起動してタイトル画面などでマウスホイールをスクロールすると
以下のエラーが表示されます。

Unable to preventDefault inside passive event listener due to target being treated as passive.

ブラウザ起動時のみのようでツクールMV本体から起動した場合には表示されないようです。
これは当方の環境の問題でしょうか?他にVS Codeを使ってる人で出る方いませんか?
VS Codeをつかうようになってから初めてスクロールして気づきました。

スクロールはバックログの機能で使うのでスクロールするたびにエラーが出るのが気持ち悪いです。

テストには以下のブラウザを使っています。
Mac版Chrome バージョン: 81.0.4044.138(Official Build) (64 ビット)
ツクールMV本体はMac版最新のものを使用しております。

追記
尚、この症状は新規プロジェクトを作成してクリーンな状態でも発生しました。
VS Codeのコンソールに表示されるエラーでゲームそのものは進行できるようですが
コンソールのエラーが出ること自体気持ち悪いというか何故でるのか謎ですorz

Re: VS CodeでChromeでテスト中スクロールしたときにエラーになります

Posted: 2020年5月29日(金) 11:15
by Plasma Dark
エラーの全文は

Unable to preventDefault inside passive event listener due to target being treated as passive. See https://www.chromestatus.com/features/6662647093133312
rpg_core.js:3795


です。
指示どおりに https://www.chromestatus.com/features/6662647093133312 を見ると、以下のような内容にたどり着きます。
(私はURL直で開いても駄目だったので、preventDefaultで検索かけましたが)

Treat Document Level Wheel/Mousewheel Event Listeners as Passive

The wheel/mousewheel event listeners that are registered on document level targets (window.document, window.document.body, or window) will be treated as passive if not specified as otherwise and calling preventDefault() inside such listeners will be ignored. This is the wheel version of the scrolling intervention which is shipped in Chrome 56


マウスホイールイベントは特に指定がない場合はpassiveとして扱われ、そのリスナ内の preventDefault() は無視されます。
passive や preventDefault() については下記記事がわかりやすいと思います。
https://qiita.com/tochiji/items/4e9e64cabc0a1cd7a1ae

私のテキストログプラグインで動作の違いを見てみましたが、 passive: true のまま(Chrome56以降のデフォルト動作)だとマウススクロールでかなり滑るような動きをしていますね。
これが気になるのであれば、 TouchEvent._setupEventHandler を上書きしちゃうのが良いんじゃないでしょうか。
もし気にならないなら、 _onWheel のほうで preventDefault() を呼ばないようにしちゃうのも手です。

コード: 全て選択

(function() {
  'use strict';
  TouchInput._setupEventHandlers = function() {
    var isSupportPassive = Utils.isSupportPassiveEvent();
    document.addEventListener('mousedown', this._onMouseDown.bind(this));
    document.addEventListener('mousemove', this._onMouseMove.bind(this));
    document.addEventListener('mouseup', this._onMouseUp.bind(this));
    document.addEventListener('wheel', this._onWheel.bind(this), isSupportPassive ? {passive: false} : false);
    document.addEventListener('touchstart', this._onTouchStart.bind(this), isSupportPassive ? {passive: false} : false);
    document.addEventListener('touchmove', this._onTouchMove.bind(this), isSupportPassive ? {passive: false} : false);
    document.addEventListener('touchend', this._onTouchEnd.bind(this));
    document.addEventListener('touchcancel', this._onTouchCancel.bind(this));
    document.addEventListener('pointerdown', this._onPointerDown.bind(this));
  };
})();

Re: VS CodeでChromeでテスト中スクロールしたときにエラーになります

Posted: 2020年5月29日(金) 22:25
by にゃたま
Plasma Dark様

仰られたコードの内容は何をしているのか正直よくわかりませんが、
プラグイン化して読み込んでVS Codeから実行したところエラーが消えていました。
これで精神的に楽になりました(^^

テキストログの動作自体はスクロールに問題ないようです。
Plasma Dark様のテキストログも検討しましたがどうも
当方の使用しているトリアコンタン様のノベルプラグインとの
相性が悪いようで現在はYEP_X_MessageBacklogを使用しています。

ただこのプラグインはメッセージの1文が長文だと
折返しができないのでメッセージの最後が途切れてしまうのが難点ではありますが…
これができれば良いプラグインなんですがね…

とにもかくにもエラーが出なくなったのは助かりました。
これにてこのトピックは解決とさせていただきます。
ありがとうございました。