plotly / plotly/plotly.js

diffConfig always returns true if modeBarButtons (array of array) is populated

オープン
#5,273 コメント 0 件 リアクション 0 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

bug P3
主要言語
JavaScript
スター
18.3k
フォーク
2k
平均マージ
2日 12時間
マージ済み PR(30日)
28

説明

diffConfig function has bug where it always returns true if modeBarButtons (array of array) is populated. This results in unnecessary re-rendering. The function should check if the array member is array inside a for loop, It should be -

/*

  • simple diff for config - for now, just treat all changes as equivalent
    */
    function diffConfig(oldConfig, newConfig) {
    var key;

    for(key in oldConfig) {
    if(key.charAt(0) === '_') continue;
    var oldVal = oldConfig[key];
    var newVal = newConfig[key];
    if(oldVal !== newVal) {
    if(Lib.isPlainObject(oldVal) && Lib.isPlainObject(newVal)) {
    if(diffConfig(oldVal, newVal)) {
    return true;
    }
    } else if(Array.isArray(oldVal) && Array.isArray(newVal)) {
    if(oldVal.length !== newVal.length) {
    return true;
    }

             for(var i = 0; i < oldVal.length; i++) {
                 if(oldVal[i] !== newVal[i]) {
     				**if(Array.isArray(oldVal[i]) && Array.isArray(newVal[i])){
     					if(diffConfig(oldVal[i], newVal[i])) {
     						return true;
     					}
     				}							
                     else** if(Lib.isPlainObject(oldVal[i]) && Lib.isPlainObject(newVal[i])) {
                         if(diffConfig(oldVal[i], newVal[i])) {
                             return true;
                         }
                     } else {
                         return true;
                     }
                 }
             }
         } else {
             return true;
         }
     }
    

    }
    }

e.g Config object used -

const plotlyConfig: Partial = {
responsive: true,
displaylogo: false,
displayModeBar: true,
doubleClick: false,
showTips: false,
scrollZoom: false,
modeBarButtons: [
[
'select2d',
'lasso2d',
'zoom2d',
'pan2d',
'resetScale2d',
],
],
locale: language,
locales: locales
}

コントリビューションガイド

コントリビューションガイドを開く

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

調査の方向性

diffConfig 関数を見つけ、ネストされた modeBarButtons 配列を含む plotlyConfig の例を再現ケースとして使用します。等価なネストされた配列を比較し、変更されていない設定が異なるものとして報告されないことを確認して、不要な再レンダリングを避けます。この issue ではファイルもテストも指定されていません。

索引モデルが issue の本文から書いたものです。

評価

技術スタック
javascript
領域
data-visualization, frontend
issue の種類
バグ
難易度
2/5
見積もり時間
1〜3時間
活発さ
停滞
明瞭さ
おおむね明確
初心者へのやさしさ
55/100

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。