File 3231-Fix-broken-fill-screen-button-in-benchmark-visualiza.patch of Package erlang

From b75db41042bc7c0b003298e1bed7e84d27a13a7b Mon Sep 17 00:00:00 2001
From: Kjell Winblad <kjellwinblad@gmail.com>
Date: Fri, 10 Sep 2021 09:02:53 +0200
Subject: [PATCH] Fix broken "fill-screen"-button in benchmark visualization
 HTML pages

The signal queue benchmark in parallel_messages_SUITE and the ETS
benchmark in ets_SUITE have benchmark result visualization HTML pages
with "fill-screen" buttons to make the graphs bigger. This button did
not work as intended before. When pressing the button for a graph, the
last graph got replaced with a bigger version and not the one over the
button. This is now fixed.
---
 .../visualize_throughput.html                    | 16 +++++++++-------
 .../ets_SUITE_data/visualize_throughput.html     | 16 +++++++++-------
 2 files changed, 18 insertions(+), 14 deletions(-)

diff --git a/erts/test/parallel_messages_SUITE_data/visualize_throughput.html b/erts/test/parallel_messages_SUITE_data/visualize_throughput.html
index 92519876c9..5f8b00592a 100644
--- a/erts/test/parallel_messages_SUITE_data/visualize_throughput.html
+++ b/erts/test/parallel_messages_SUITE_data/visualize_throughput.html
@@ -224,10 +224,12 @@
           function plotScenario(name, plotType) {
               var data = scenarioDataMap[name];
               var yAxisTitle = undefined;
+              var graphId = "graph" + nrOfGraphs;
+              var fullscreenButtonid = "fullscreenButton" + nrOfGraphs;
               nrOfGraphs = nrOfGraphs + 1;
-              $("<div class='added' id='graph" + nrOfGraphs + "'>")
+              $("<div class='added' id='" + graphId + "'>")
                   .insertBefore(insertPlaceholder);
-              $("<button type='button' class='added' id='fullscreenButton" + nrOfGraphs + "'>Fill screen</button>")
+              $("<button type='button' class='added' id='" + fullscreenButtonid + "'>Fill screen</button>")
                   .insertBefore(insertPlaceholder);
               $("<span class='added'><br><hr><br></span>")
                   .insertBefore(insertPlaceholder);
@@ -249,17 +251,17 @@
                       title: yAxisTitle
                   }
               };
-              $("#fullscreenButton" + nrOfGraphs).click(
+              $("#" + fullscreenButtonid).click(
                   function () {
-                      $('#graph' + nrOfGraphs).replaceWith(
-                          $("<div class='added' id='graph" + nrOfGraphs + "'>"));
+                      $('#' + graphId).replaceWith(
+                          $("<div class='added' id='" + graphId + "'>"));
                       layout = $.extend({}, layout, {
                           width: $(window).width() - 40,
                           height: $(window).height() - 40
                       });
-                      Plotly.newPlot('graph' + nrOfGraphs, data, layout);
+                      Plotly.newPlot(graphId, data, layout);
                   });
-              Plotly.newPlot('graph' + nrOfGraphs, data, layout);
+              Plotly.newPlot(graphId, data, layout);
           }
           $.each(scenarioList,
               function (index, name) {
diff --git a/lib/stdlib/test/ets_SUITE_data/visualize_throughput.html b/lib/stdlib/test/ets_SUITE_data/visualize_throughput.html
index 922a3790ea..c2241c39b5 100644
--- a/lib/stdlib/test/ets_SUITE_data/visualize_throughput.html
+++ b/lib/stdlib/test/ets_SUITE_data/visualize_throughput.html
@@ -240,10 +240,12 @@
           function plotScenario(name, plotType) {
               var data = scenarioDataMap[name];
               var yAxisTitle = undefined;
+              var graphId = "graph" + nrOfGraphs;
+              var fullscreenButtonid = "fullscreenButton" + nrOfGraphs;
               nrOfGraphs = nrOfGraphs + 1;
-              $("<div class='added' id='graph" + nrOfGraphs + "'>")
+              $("<div class='added' id='" + graphId + "'>")
                   .insertBefore(insertPlaceholder);
-              $("<button type='button' class='added' id='fullscreenButton" + nrOfGraphs + "'>Fill screen</button>")
+              $("<button type='button' class='added' id='" + fullscreenButtonid + "'>Fill screen</button>")
                   .insertBefore(insertPlaceholder);
               $("<span class='added'><br><hr><br></span>")
                   .insertBefore(insertPlaceholder);
@@ -265,17 +267,17 @@
                       title: yAxisTitle
                   }
               };
-              $("#fullscreenButton" + nrOfGraphs).click(
+              $("#" + fullscreenButtonid).click(
                   function () {
-                      $('#graph' + nrOfGraphs).replaceWith(
-                          $("<div class='added' id='graph" + nrOfGraphs + "'>"));
+                      $('#' + graphId).replaceWith(
+                          $("<div class='added' id='" + graphId + "'>"));
                       layout = $.extend({}, layout, {
                           width: $(window).width() - 40,
                           height: $(window).height() - 40
                       });
-                      Plotly.newPlot('graph' + nrOfGraphs, data, layout);
+                      Plotly.newPlot(graphId, data, layout);
                   });
-              Plotly.newPlot('graph' + nrOfGraphs, data, layout);
+              Plotly.newPlot(graphId, data, layout);
           }
           $.each(scenarioList,
               function (index, name) {
-- 
2.31.1