MasatoMakino / pixijs-mouse-event-transmitter

Transmit mouse events from pixi.js stage to other canvas.
MIT License
0 stars 1 forks source link

テスト環境からpixi.js-legacyを排除する #188

Closed MasatoMakino closed 8 months ago

MasatoMakino commented 8 months ago

headless-glを使えばpixi.jsをforceCanvasオプションなしで使えるため、テスト環境のためだけにpixi.js-legacyを用意する必要はない。

MasatoMakino commented 8 months ago

related : Bump pixi.js-legacy from 7.3.2 to 7.4.0 #183

MasatoMakino commented 8 months ago

単純にheadless-glをインストールした場合、この処理のあと、WebGLコンテキストの取得に失敗する。

  const app = new Application({
    width: W,
    height: H,
    backgroundColor: 0x666666,
  });

node-canvasで生成されたcanvasエレメントは、headless-glを自動では参照しないため。

https://github.com/akira-cn/node-canvas-webgl このように、node-canvasをモックしてheadless-glのコンテキストを返すことは可能。

MasatoMakino commented 8 months ago

考えられる解決方法として

  1. 生成されたCanvas インスタンスのコンテキストを取得する関数をモックしてglインスタンスを返す
  2. Jest-erectron-runner を使う
  3. Vitest のerectron runner を探す

の3つがある

MasatoMakino commented 8 months ago

このissueについての今後の方針

現在、Pixi.jsのテストはNode.js環境で行われていますが、これには限界があります。特に、WebGLやCanvasなどのブラウザ特有のAPIを使用するテストは、ブラウザ環境で実行する必要があります。

そこで、ブラウザ環境でのテストを可能にするために、JestのElectronランナーを使用する提案があります。しかし、この変更は大規模であり、一度に全てのテストを移行すると失敗した場合のリスクが大きいです。

そのため、まずは小規模な別プロジェクトで新しいテスト環境を試すことを提案します。このプロジェクトでは、必要最小限のテストケースを作成し、新しいテスト環境が期待通りに動作することを確認します。

このアプローチにより、問題が発生した場合でも影響を最小限に抑えることができます。また、新しいテスト環境が成功した場合には、その結果を元のプロジェクトにフィードバックすることができます。

次のステップとしては、新しいテスト環境を試すためのミニマムなプロジェクトを作成し、テストを実行してみることを提案します。この結果に基づいて、元のプロジェクトに対する改善策を検討します。

最小限のテスト環境は以下のリポジトリで実験を行います。 https://github.com/MasatoMakino/minimal-test-environment-jest-pixijs