Sentry-javascript: ブレッドクラムの要素にテキストを追加するui.click

作成日 2016年05月12日  ·  18コメント  ·  ソース: getsentry/sentry-javascript

特にクラス名があまり明らかにされていないアプリの場合は、作業が簡単になります。

の線に沿った何か:

 div > button.btn.btn-lg.btn-primary "Purchase"

要素に大量のテキストが含まれている場合は、切り捨てられる可能性があります。

最も参考になるコメント

追加したかっただけです-私はreact&styled-componentsを使用しているので、クラス名は自動的に生成されます。(手動でcaptureBreadcrumbせずに)コンテキストを増やすとよいでしょう。

screen shot 2018-07-02 at 4 36 14 pm

全てのコメント18件

ですから、これは私がやりたいことですが、DOMシリアル化関数が肥大化して、クリックハンドラーに顕著なオーバーヘッドが追加され始めるのではないかと心配しています。

しかし、私は探求します。

簡単な代替策の1つは、

target = elem.outerHTML;

クリックした要素をそのまま出力します。 ツリー構造が失われますが、私の個人的な経験では、コードで常に見慣れている実際の要素全体を見るほど役に立たないため、より迅速に認識できます。

それはhttps://github.com/getsentry/raven-js/issues/576も解決し

@soroushhakami –最初はouterHTML始めましたが、このユーティリティメソッド

outerHTMLを使用しなかった理由( @mitsuhikoがコメントしたように):

  • CSSセレクター形式は、より少ない文字でより多くの情報を表示できます
  • outerHTMLは、ノイズの多い一時データを含めることができます。

    • 長いdata-reactid文字列(React 0.14以前)

    • ツールチップを対象とした動的に生成されたtitle属性

  • addEventListenerターゲットがどのように構成されているかに応じて、多くの空の要素を取得し
  • 同じクラス/コンテンツのボタンがありましたが、これは祖先情報を介してのみコンテキスト化されています

基本的に、 outerHTMLは、見栄えのする架空の例をたくさん示すといいように見えますが、数週間ライブで実行した経験では不十分でした。

ああ、わかりました、理にかなっています、説明に感謝します! 👍

すべてのボタンにIDタグを追加しました。 彼らがパンくずリストに現れないことに驚いた。 カスタムタグだったとしても、嬉しいです。 しかし、IDタグはその独自性のために理想的であるように思われます。

@nblasgen –失敗したテストケースを提供できれば、何が起きているのか見て喜んでいます。

しかし、現在、コードはIDをキャプチャすることになっているので、これを検証するテストがあります。

IDを表示するための+1、またはdata-sentry-id="Some text here"ようなカスタムタグ

この欠落している部分を認識しているので、今はこれを閉じます。次のメジャーバージョンでこの機能がどのように機能するかを再検討します。

参照: https
参照: https

追加したかっただけです-私はreact&styled-componentsを使用しているので、クラス名は自動的に生成されます。(手動でcaptureBreadcrumbせずに)コンテキストを増やすとよいでしょう。

screen shot 2018-07-02 at 4 36 14 pm

@kamilogorekこれに関する更新はありますか?

クリック「メッセージ」を微調整する可能性はありますか?

たぶん、より多くのデータをbreadcrumbCallbackに渡して、デフォルトで歩哨に送信せずに必要なものを選択できるようにすることができますか? たぶん、dom要素全体でさえ?

@TuxujPesは次のメジャーリリースで可能になりますが、メジャーリリースでのみ導入できるいくつかのパブリックAPIの変更が必要なため、今回は不可能です。

@kamilogorekいいですね。 メジャーリリース日の見積もりはありますか?

第3四半期の終わり近くのどこかで(すみません、応答時間が非常に長く、休暇中でした)。

IDを表示するための+1、またはdata-sentry-id="Some text here"ようなカスタムタグ

彼らはこの情報があるかどうかを分析し、それを持ち歩くことができます。 存在する場合は、セレクターにボタンを残して詳細を確認してください。

@hiagodotme @ TuxujPes @ adamreisnzこの機能は新しいSDKですでに利用可能です-https //docs.sentry.io/learn/filtering/ = javascript#before-breadcrumb

参考:新しいSDKを使用すると、バンドルサイズ#1552で+ 50Kbになることを忘れないでください。

@ 1999では、raven-jsと比較して12.7kBが追加されます。関連性がないため、gzip圧縮されていないサイズを比較に使用しないでください。
また、v5(https://github.com/getsentry/sentry-javascript/pull/1919)は15kB未満になるため、ペイロードの増加について心配する必要はありません。

@kamilogorek 200を超える変更ファイルを含むPRが少し怖いです。これは、新しいバージョンというよりも、完全に新しいSDKのようです。 また、ETAのリリース日はいつですか?

このページは役に立ちましたか?
0 / 5 - 0 評価