問題タブ [stenciljs]

そのため、リーフレット マップをラップし、いくつかの追加機能を追加する Stenciljs コンポーネントを開発しています。

明らかに、リーフレットをテストしたくない、またはテストする必要はありませんが、代わりに、ラッパー コンポーネントのパーツのみをテストします。

したがって、テスト例を使用して、テストを作成します。

コンポーネントをロードしてパブリック関数をテストしてみてください。

このメッセージは、テストがリーフレットをレンダリングしようとしていることが原因であると考えられます。これは真のブラウザーではないため、ビューを検出できず、このエラーがスローされるため、テストでリーフレットをモックしようとしましたが、それでも同じ問題。

jest モックを使用してリーフレット モジュールをモックしようとしています

しかし、これは違いはありませんでした

私が持っていた唯一のアイデアは、ロジックをコンポーネントから分離することですが、テストの目的でこれを行っているだけなので、それは間違っていると感じています.

使用中のバージョンは次のとおりです。リーフレット: 1.3.4、@stencil: 0.15.2、jest: 23.4.2

他の提案はありますか？

@skyboyer の提案のおかげでさらに調査すると、リーフレットコア browser.js ファイルのこの行にたどり着きます

リーフレットコア browser.js ファイルのこの行に私を導きます

しかし、次のエラーが発生するため、ウィンドウの画面プロパティをモックできません

だから私は次のことを試します。

同じエラーで、これを完全に無視するので、エクスポートを上書きしてみます。

喜びもなかったので、試してみました

しかし、それは定数であり、変更できないことがわかります（ただし、含意統計変数は ¯_(ツ)_/¯ です）

他に試せることはありますか？

さらに更新すると、ウィンドウをモックすることができましたが、残念ながらこれでは解決しません。

これをコンソール ログに記録すると、適切なプロパティが取得されますが、コンポーネントのインスタンス化をテストするとすぐに失敗します。

読んでみると、Leaflet は DOM をチェックせず、とにかくレンダリングしようとしているようです。とにかく、このあたりはわかりません。リーフレットのヘッドレス パッケージを見ましたが、それらを交換する方法がわかりません。テスト。

テストのための別の戦略、おそらく分度器を検討する必要があると思います。

lodash を stenciljs コンポーネントにインポートしようとしています。私は複数の方法を試し、これに関する多くの解決策を見てきましたが、うまくいきませんでした。

次の方法でインポートしようとしました。

それらのどれも私のために働いていません。最初のものはエラーをスローしませんが、lodash の関数を使用できません。残りの方法はエラーをスローし、ビルドは失敗します。

どんな助けでも本当にかなりの価値があります。

前もって感謝します！！