UTI: Code clean-up
[csit.git] / resources / tools / dash / app / pal / stats / layout.py
index d265145..8df6d53 100644 (file)
@@ -15,7 +15,6 @@
 """
 
 import logging
-import urllib
 import pandas as pd
 import dash_bootstrap_components as dbc
 
@@ -29,26 +28,50 @@ from yaml import load, FullLoader, YAMLError
 from datetime import datetime, timedelta
 from copy import deepcopy
 
+from ..utils.constants import Constants as C
+from ..utils.utils import show_tooltip, gen_new_url, get_date, get_ttypes, \
+    get_cadences, get_test_beds, get_job, generate_options, set_job_params
+from ..utils.url_processing import url_decode
 from ..data.data import Data
 from .graphs import graph_statistics, select_data
 
 
 class Layout:
+    """The layout of the dash app and the callbacks.
     """
-    """
-
-    DEFAULT_JOB = "csit-vpp-perf-mrr-daily-master-2n-icx"
 
-    def __init__(self, app: Flask, html_layout_file: str, spec_file: str,
+    def __init__(self, app: Flask, html_layout_file: str,
         graph_layout_file: str, data_spec_file: str, tooltip_file: str,
         time_period: int=None) -> None:
-        """
+        """Initialization:
+        - save the input parameters,
+        - read and pre-process the data,
+        - prepare data for the control panel,
+        - read HTML layout file,
+        - read tooltips from the tooltip file.
+
+        :param app: Flask application running the dash application.
+        :param html_layout_file: Path and name of the file specifying the HTML
+            layout of the dash application.
+        :param graph_layout_file: Path and name of the file with layout of
+            plot.ly graphs.
+        :param data_spec_file: Path and name of the file specifying the data to
+            be read from parquets for this application.
+        :param tooltip_file: Path and name of the yaml file specifying the
+            tooltips.
+        :param time_period: It defines the time period for data read from the
+            parquets in days from now back to the past.
+        :type app: Flask
+        :type html_layout_file: str
+        :type graph_layout_file: str
+        :type data_spec_file: str
+        :type tooltip_file: str
+        :type time_period: int
         """
 
         # Inputs
         self._app = app
         self._html_layout_file = html_layout_file
-        self._spec_file = spec_file
         self._graph_layout_file = graph_layout_file
         self._data_spec_file = data_spec_file
         self._tooltip_file = tooltip_file
@@ -74,7 +97,7 @@ class Layout:
             self._time_period = data_time_period
 
         jobs = sorted(list(data_stats["job"].unique()))
-        job_info = {
+        d_job_info = {
             "job": list(),
             "dut": list(),
             "ttype": list(),
@@ -83,14 +106,14 @@ class Layout:
         }
         for job in jobs:
             lst_job = job.split("-")
-            job_info["job"].append(job)
-            job_info["dut"].append(lst_job[1])
-            job_info["ttype"].append(lst_job[3])
-            job_info["cadence"].append(lst_job[4])
-            job_info["tbed"].append("-".join(lst_job[-2:]))
-        self.df_job_info = pd.DataFrame.from_dict(job_info)
+            d_job_info["job"].append(job)
+            d_job_info["dut"].append(lst_job[1])
+            d_job_info["ttype"].append(lst_job[3])
+            d_job_info["cadence"].append(lst_job[4])
+            d_job_info["tbed"].append("-".join(lst_job[-2:]))
+        self.job_info = pd.DataFrame.from_dict(d_job_info)
 
-        self._default = self._set_job_params(self.DEFAULT_JOB)
+        self._default = set_job_params(self.job_info, C.STATS_DEFAULT_JOB)
 
         tst_info = {
             "job": list(),
@@ -99,10 +122,10 @@ class Layout:
             "dut_version": list(),
             "hosts": list(),
             "passed": list(),
-            "failed": list()
+            "failed": list(),
+            "lst_failed": list()
         }
         for job in jobs:
-            # TODO: Add list of failed tests for each build
             df_job = df_tst_info.loc[(df_tst_info["job"] == job)]
             builds = df_job["build"].unique()
             for build in builds:
@@ -113,15 +136,25 @@ class Layout:
                 tst_info["dut_version"].append(df_build["dut_version"].iloc[-1])
                 tst_info["hosts"].append(df_build["hosts"].iloc[-1])
                 try:
-                    passed = df_build.value_counts(subset='passed')[True]
+                    passed = df_build.value_counts(subset="passed")[True]
                 except KeyError:
                     passed = 0
                 try:
-                    failed = df_build.value_counts(subset='passed')[False]
+                    failed = df_build.value_counts(subset="passed")[False]
+                    failed_tests = df_build.loc[(df_build["passed"] == False)]\
+                        ["test_id"].to_list()
+                    l_failed = list()
+                    for tst in failed_tests:
+                        lst_tst = tst.split(".")
+                        suite = lst_tst[-2].replace("2n1l-", "").\
+                            replace("1n1l-", "").replace("2n-", "")
+                        l_failed.append(f"{suite.split('-')[0]}-{lst_tst[-1]}")
                 except KeyError:
                     failed = 0
+                    l_failed = list()
                 tst_info["passed"].append(passed)
                 tst_info["failed"].append(failed)
+                tst_info["lst_failed"].append(sorted(l_failed))
 
         self._data = data_stats.merge(pd.DataFrame.from_dict(tst_info))
 
@@ -194,88 +227,20 @@ class Layout:
     def default(self) -> any:
         return self._default
 
-    def _get_duts(self) -> list:
-        """
-        """
-        return sorted(list(self.df_job_info["dut"].unique()))
-
-    def _get_ttypes(self, dut: str) -> list:
-        """
-        """
-        return sorted(list(self.df_job_info.loc[(
-            self.df_job_info["dut"] == dut
-        )]["ttype"].unique()))
-
-    def _get_cadences(self, dut: str, ttype: str) -> list:
-        """
-        """
-        return sorted(list(self.df_job_info.loc[(
-            (self.df_job_info["dut"] == dut) &
-            (self.df_job_info["ttype"] == ttype)
-        )]["cadence"].unique()))
-
-    def _get_test_beds(self, dut: str, ttype: str, cadence: str) -> list:
-        """
-        """
-        return sorted(list(self.df_job_info.loc[(
-            (self.df_job_info["dut"] == dut) &
-            (self.df_job_info["ttype"] == ttype) &
-            (self.df_job_info["cadence"] == cadence)
-        )]["tbed"].unique()))
+    def add_content(self):
+        """Top level method which generated the web page.
 
-    def _get_job(self, dut, ttype, cadence, testbed):
-        """Get the name of a job defined by dut, ttype, cadence, testbed.
+        It generates:
+        - Store for user input data,
+        - Navigation bar,
+        - Main area with control panel and ploting area.
 
-        Input information comes from control panel.
-        """
-        return self.df_job_info.loc[(
-            (self.df_job_info["dut"] == dut) &
-            (self.df_job_info["ttype"] == ttype) &
-            (self.df_job_info["cadence"] == cadence) &
-            (self.df_job_info["tbed"] == testbed)
-        )]["job"].item()
-
-    def _set_job_params(self, job: str) -> dict:
-        """
-        """
-        lst_job = job.split("-")
-        return {
-            "job": job,
-            "dut": lst_job[1],
-            "ttype": lst_job[3],
-            "cadence": lst_job[4],
-            "tbed": "-".join(lst_job[-2:]),
-            "duts": self._generate_options(self._get_duts()),
-            "ttypes": self._generate_options(self._get_ttypes(lst_job[1])),
-            "cadences": self._generate_options(self._get_cadences(
-                lst_job[1], lst_job[3])),
-            "tbeds": self._generate_options(self._get_test_beds(
-                lst_job[1], lst_job[3], lst_job[4]))
-        }
+        If no HTML layout is provided, an error message is displayed instead.
 
-    def _show_tooltip(self, id: str, title: str) -> list:
-        """
+        :returns: The HTML div with the whole page.
+        :rtype: html.Div
         """
-        return [
-            f"{title} ",
-            dbc.Badge(
-                id=id,
-                children="?",
-                pill=True,
-                color="white",
-                text_color="info",
-                class_name="border ms-1",
-            ),
-            dbc.Tooltip(
-                children=self._tooltips.get(id, str()),
-                target=id,
-                placement="auto"
-            )
-        ]
 
-    def add_content(self):
-        """
-        """
         if self.html_layout:
             return html.Div(
                 id="div-main",
@@ -291,7 +256,7 @@ class Layout:
                     ),
                     dcc.Loading(
                         dbc.Offcanvas(
-                            class_name="w-25",
+                            class_name="w-50",
                             id="offcanvas-metadata",
                             title="Detailed Information",
                             placement="end",
@@ -326,6 +291,9 @@ class Layout:
 
     def _add_navbar(self):
         """Add nav element with navigation panel. It is placed on the top.
+
+        :returns: Navigation bar.
+        :rtype: dbc.NavbarSimple
         """
         return dbc.NavbarSimple(
             id="navbarsimple-main",
@@ -348,6 +316,9 @@ class Layout:
 
     def _add_ctrl_col(self) -> dbc.Col:
         """Add column with controls. It is placed on the left side.
+
+        :returns: Column with the control panel.
+        :rtype: dbc.Col
         """
         return dbc.Col(
             id="col-controls",
@@ -358,6 +329,9 @@ class Layout:
 
     def _add_plotting_col(self) -> dbc.Col:
         """Add column with plots and tables. It is placed on the right side.
+
+        :returns: Column with tables.
+        :rtype: dbc.Col
         """
         return dbc.Col(
             id="col-plotting-area",
@@ -397,24 +371,38 @@ class Layout:
                                 dcc.Loading(children=[
                                     dbc.Button(
                                         id="btn-download-data",
-                                        children=self._show_tooltip(
+                                        children=show_tooltip(self._tooltips,
                                             "help-download", "Download Data"),
                                         class_name="me-1",
                                         color="info"
                                     ),
                                     dcc.Download(id="download-data")
-                                ]),
+                                ])
                             ]
                         ),
                         dbc.Col(  # Show URL
                             width=10,
                             children=[
-                                dbc.Card(
-                                    id="card-url",
-                                    body=True,
-                                    class_name="gy-2 p-0",
-                                    children=[]
-                                ),
+                                dbc.InputGroup(
+                                    class_name="me-1",
+                                    children=[
+                                        dbc.InputGroupText(
+                                            style=C.URL_STYLE,
+                                            children=show_tooltip(
+                                                self._tooltips,
+                                                "help-url", "URL",
+                                                "input-url"
+                                            )
+                                        ),
+                                        dbc.Input(
+                                            id="input-url",
+                                            readonly=True,
+                                            type="url",
+                                            style=C.URL_STYLE,
+                                            value=""
+                                        )
+                                    ]
+                                )
                             ]
                         )
                     ]
@@ -424,7 +412,10 @@ class Layout:
         )
 
     def _add_ctrl_panel(self) -> dbc.Row:
-        """
+        """Add control panel.
+
+        :returns: Control panel.
+        :rtype: dbc.Row
         """
         return dbc.Row(
             id="row-ctrl-panel",
@@ -438,7 +429,7 @@ class Layout:
                             children=[
                                 dbc.Label(
                                     class_name="p-0",
-                                    children=self._show_tooltip(
+                                    children=show_tooltip(self._tooltips,
                                         "help-dut", "Device under Test")
                                 ),
                                 dbc.Row(
@@ -456,7 +447,7 @@ class Layout:
                             children=[
                                 dbc.Label(
                                     class_name="p-0",
-                                    children=self._show_tooltip(
+                                    children=show_tooltip(self._tooltips,
                                         "help-ttype", "Test Type"),
                                 ),
                                 dbc.RadioItems(
@@ -472,7 +463,7 @@ class Layout:
                             children=[
                                 dbc.Label(
                                     class_name="p-0",
-                                    children=self._show_tooltip(
+                                    children=show_tooltip(self._tooltips,
                                         "help-cadence", "Cadence"),
                                 ),
                                 dbc.RadioItems(
@@ -488,7 +479,7 @@ class Layout:
                             children=[
                                 dbc.Label(
                                     class_name="p-0",
-                                    children=self._show_tooltip(
+                                    children=show_tooltip(self._tooltips,
                                         "help-tbed", "Test Bed"),
                                 ),
                                 dbc.Select(
@@ -514,7 +505,7 @@ class Layout:
                             children=[
                                 dbc.Label(
                                     class_name="gy-1",
-                                    children=self._show_tooltip(
+                                    children=show_tooltip(self._tooltips,
                                         "help-time-period", "Time Period"),
                                 ),
                                 dcc.DatePickerRange(
@@ -539,7 +530,20 @@ class Layout:
         )
 
     class ControlPanel:
+        """A class representing the control panel.
+        """
+
         def __init__(self, panel: dict, default: dict) -> None:
+            """Initialisation of the control pannel by default values. If
+            particular values are provided (parameter "panel") they are set
+            afterwards.
+
+            :param panel: Custom values to be set to the control panel.
+            :param default: Default values to be set to the control panel.
+            :type panel: dict
+            :type defaults: dict
+            """
+
             self._defaults = {
                 "ri-ttypes-options": default["ttypes"],
                 "ri-cadences-options": default["cadences"],
@@ -556,6 +560,13 @@ class Layout:
                     self._panel[key] = panel[key]
 
         def set(self, kwargs: dict) -> None:
+            """Set the values of the Control panel.
+
+            :param kwargs: key - value pairs to be set.
+            :type kwargs: dict
+            :raises KeyError: If the key in kwargs is not present in the Control
+                panel.
+            """
             for key, val in kwargs.items():
                 if key in self._panel:
                     self._panel[key] = val
@@ -571,24 +582,38 @@ class Layout:
             return self._panel
 
         def get(self, key: str) -> any:
+            """Returns the value of a key from the Control panel.
+
+            :param key: The key which value should be returned.
+            :type key: str
+            :returns: The value of the key.
+            :rtype: any
+            :raises KeyError: If the key in kwargs is not present in the Control
+                panel.
+            """
             return self._panel[key]
 
         def values(self) -> list:
+            """Returns the values from the Control panel as a list.
+
+            :returns: The values from the Control panel.
+            :rtype: list
+            """
             return list(self._panel.values())
 
-    @staticmethod
-    def _generate_options(opts: list) -> list:
-        """
-        """
-        return [{"label": i, "value": i} for i in opts]
 
     def callbacks(self, app):
+        """Callbacks for the whole application.
+
+        :param app: The application.
+        :type app: Flask
+        """
 
         @app.callback(
             Output("control-panel", "data"),  # Store
             Output("graph-passed", "figure"),
             Output("graph-duration", "figure"),
-            Output("card-url", "children"),
+            Output("input-url", "value"),
             Output("ri-ttypes", "options"),
             Output("ri-cadences", "options"),
             Output("dd-tbeds", "options"),
@@ -605,31 +630,53 @@ class Layout:
             Input("dpr-period", "start_date"),
             Input("dpr-period", "end_date"),
             Input("url", "href")
-            # prevent_initial_call=True
         )
-        def _update_ctrl_panel(cp_data: dict, dut:str, ttype: str, cadence:str,
+        def _update_ctrl_panel(cp_data: dict, dut: str, ttype: str, cadence:str,
                 tbed: str, start: str, end: str, href: str) -> tuple:
-            """
+            """Update the application when the event is detected.
+
+            :param cp_data: Current status of the control panel stored in
+                browser.
+            :param dut: Input - DUT name.
+            :param ttype: Input - Test type.
+            :param cadence: Input - The cadence of the job.
+            :param tbed: Input - The test bed.
+            :param start: Date and time where the data processing starts.
+            :param end: Date and time where the data processing ends.
+            :param href: Input - The URL provided by the browser.
+            :type cp_data: dict
+            :type dut: str
+            :type ttype: str
+            :type cadence: str
+            :type tbed: str
+            :type start: str
+            :type end: str
+            :type href: str
+            :returns: New values for web page elements.
+            :rtype: tuple
             """
 
             ctrl_panel = self.ControlPanel(cp_data, self.default)
 
-            start = datetime(int(start[0:4]), int(start[5:7]), int(start[8:10]))
-            end = datetime(int(end[0:4]), int(end[5:7]), int(end[8:10]))
+            start = get_date(start)
+            end = get_date(end)
 
-            parsed_url = urllib.parse.urlparse(href)
-            url = f"{parsed_url.netloc}{parsed_url.path}"
-            url_params = urllib.parse.parse_qs(parsed_url.fragment)
+            # Parse the url:
+            parsed_url = url_decode(href)
+            if parsed_url:
+                url_params = parsed_url["params"]
+            else:
+                url_params = None
 
             trigger_id = callback_context.triggered[0]["prop_id"].split(".")[0]
             if trigger_id == "ri-duts":
-                ttype_opts = self._generate_options(self._get_ttypes(dut))
+                ttype_opts = generate_options(get_ttypes(self.job_info, dut))
                 ttype_val = ttype_opts[0]["value"]
-                cad_opts = self._generate_options(
-                    self._get_cadences(dut, ttype_val))
+                cad_opts = generate_options(get_cadences(
+                    self.job_info, dut, ttype_val))
                 cad_val = cad_opts[0]["value"]
-                tbed_opts = self._generate_options(
-                    self._get_test_beds(dut, ttype_val, cad_val))
+                tbed_opts = generate_options(get_test_beds(
+                    self.job_info, dut, ttype_val, cad_val))
                 tbed_val = tbed_opts[0]["value"]
                 ctrl_panel.set({
                     "ri-duts-value": dut,
@@ -641,12 +688,12 @@ class Layout:
                     "dd-tbeds-value": tbed_val
                 })
             elif trigger_id == "ri-ttypes":
-                cad_opts = self._generate_options(
-                    self._get_cadences(ctrl_panel.get("ri-duts-value"), ttype))
+                cad_opts = generate_options(get_cadences(
+                    self.job_info, ctrl_panel.get("ri-duts-value"), ttype))
                 cad_val = cad_opts[0]["value"]
-                tbed_opts = self._generate_options(
-                    self._get_test_beds(ctrl_panel.get("ri-duts-value"),
-                    ttype, cad_val))
+                tbed_opts = generate_options(get_test_beds(
+                    self.job_info, ctrl_panel.get("ri-duts-value"), ttype,
+                    cad_val))
                 tbed_val = tbed_opts[0]["value"]
                 ctrl_panel.set({
                     "ri-ttypes-value": ttype,
@@ -656,8 +703,8 @@ class Layout:
                     "dd-tbeds-value": tbed_val
                 })
             elif trigger_id == "ri-cadences":
-                tbed_opts = self._generate_options(
-                    self._get_test_beds(ctrl_panel.get("ri-duts-value"),
+                tbed_opts = generate_options(get_test_beds(
+                    self.job_info, ctrl_panel.get("ri-duts-value"),
                     ctrl_panel.get("ri-ttypes-value"), cadence))
                 tbed_val = tbed_opts[0]["value"]
                 ctrl_panel.set({
@@ -678,51 +725,37 @@ class Layout:
                     new_start = url_params.get("start", list())[0]
                     new_end = url_params.get("end", list())[0]
                     if new_job and new_start and new_end:
-                        start = datetime(
-                            int(new_start[0:4]), int(new_start[5:7]),
-                            int(new_start[8:10]))
-                        end = datetime(
-                            int(new_end[0:4]), int(new_end[5:7]),
-                            int(new_end[8:10]))
-                        job_params = self._set_job_params(new_job)
+                        start = get_date(new_start)
+                        end = get_date(new_end)
+                        job_params = set_job_params(self.job_info, new_job)
                         ctrl_panel = self.ControlPanel(None, job_params)
                 else:
                     ctrl_panel = self.ControlPanel(cp_data, self.default)
-                    job = self._get_job(
-                        ctrl_panel.get("ri-duts-value"),
-                        ctrl_panel.get("ri-ttypes-value"),
-                        ctrl_panel.get("ri-cadences-value"),
-                        ctrl_panel.get("dd-tbeds-value")
-                    )
 
-            job = self._get_job(
+            job = get_job(
+                self.job_info,
                 ctrl_panel.get("ri-duts-value"),
                 ctrl_panel.get("ri-ttypes-value"),
                 ctrl_panel.get("ri-cadences-value"),
                 ctrl_panel.get("dd-tbeds-value")
             )
-            url_params = {
-                "job": job,
-                "start": start,
-                "end": end
-            }
 
             ctrl_panel.set({"al-job-children": job})
-            fig_passed, fig_duration = graph_statistics(
-                self.data, job, self.layout, start, end)
+            fig_passed, fig_duration = graph_statistics(self.data, job,
+                self.layout, start, end)
 
             ret_val = [
                 ctrl_panel.panel,
                 fig_passed,
                 fig_duration,
-                [
-                    dcc.Clipboard(
-                        target_id="card-url",
-                        title="Copy URL",
-                        style={"display": "inline-block"}
-                    ),
-                    f"{url}#{urllib.parse.urlencode(url_params)}"
-                ]
+                gen_new_url(
+                    parsed_url,
+                    {
+                        "job": job,
+                        "start": start,
+                        "end": end
+                    }
+                )
             ]
             ret_val.extend(ctrl_panel.values())
             return ret_val
@@ -736,23 +769,35 @@ class Layout:
             prevent_initial_call=True
         )
         def _download_data(cp_data: dict, start: str, end: str, n_clicks: int):
-            """
+            """Download the data
+
+            :param cp_data: Current status of the control panel stored in
+                browser.
+            :param start: Date and time where the data processing starts.
+            :param end: Date and time where the data processing ends.
+            :param n_clicks: Number of clicks on the button "Download".
+            :type cp_data: dict
+            :type start: str
+            :type end: str
+            :type n_clicks: int
+            :returns: dict of data frame content (base64 encoded) and meta data
+                used by the Download component.
+            :rtype: dict
             """
             if not (n_clicks):
                 raise PreventUpdate
 
             ctrl_panel = self.ControlPanel(cp_data, self.default)
 
-            job = self._get_job(
+            job = get_job(
+                self.job_info,
                 ctrl_panel.get("ri-duts-value"),
                 ctrl_panel.get("ri-ttypes-value"),
                 ctrl_panel.get("ri-cadences-value"),
                 ctrl_panel.get("dd-tbeds-value")
             )
 
-            start = datetime(int(start[0:4]), int(start[5:7]), int(start[8:10]))
-            end = datetime(int(end[0:4]), int(end[5:7]), int(end[8:10]))
-            data = select_data(self.data, job, start, end)
+            data = select_data(self.data, job, get_date(start), get_date(end))
             data = data.drop(columns=["job", ])
 
             return dcc.send_data_frame(data.T.to_csv, f"{job}-stats.csv")
@@ -766,7 +811,19 @@ class Layout:
         )
         def _show_metadata_from_graphs(
                 passed_data: dict, duration_data: dict) -> tuple:
-            """
+            """Generates the data for the offcanvas displayed when a particular
+            point in a graph is clicked on.
+
+            :param passed_data: The data from the clicked point in the graph
+                displaying the pass/fail data.
+            :param duration_data: The data from the clicked point in the graph
+                displaying the duration data.
+            :type passed_data: dict
+            :type duration data: dict
+            :returns: The data to be displayed on the offcanvas (job statistics
+                and the list of failed tests) and the information to show the
+                offcanvas.
+            :rtype: tuple(list, bool)
             """
 
             if not (passed_data or duration_data):
@@ -781,6 +838,26 @@ class Layout:
             elif trigger_id == "graph-duration":
                 graph_data = duration_data["points"][0].get("text", "")
             if graph_data:
+                lst_graph_data = graph_data.split("<br>")
+
+                # Prepare list of failed tests:
+                job = str()
+                build = str()
+                for itm in lst_graph_data:
+                    if "csit-ref:" in itm:
+                        job, build = itm.split(" ")[-1].split("/")
+                        break
+                if job and build:
+                    fail_tests = self.data.loc[
+                        (self.data["job"] == job) &
+                        (self.data["build"] == build)
+                    ]["lst_failed"].values[0]
+                    if not fail_tests:
+                        fail_tests = None
+                else:
+                    fail_tests = None
+
+                # Create the content of the offcanvas:
                 metadata = [
                     dbc.Card(
                         class_name="gy-2 p-0",
@@ -805,7 +882,7 @@ class Layout:
                                                 ),
                                                 x.split(": ")[1]
                                             ]
-                                        ) for x in graph_data.split("<br>")
+                                        ) for x in lst_graph_data
                                     ],
                                     flush=True),
                                 ]
@@ -813,6 +890,30 @@ class Layout:
                         ]
                     )
                 ]
+
+                if fail_tests is not None:
+                    metadata.append(
+                        dbc.Card(
+                            class_name="gy-2 p-0",
+                            children=[
+                                dbc.CardHeader(
+                                    f"List of Failed Tests ({len(fail_tests)})"
+                                ),
+                                dbc.CardBody(
+                                    id="failed-tests",
+                                    class_name="p-0",
+                                    children=[dbc.ListGroup(
+                                        children=[
+                                            dbc.ListGroupItem(x) \
+                                                for x in fail_tests
+                                        ],
+                                        flush=True),
+                                    ]
+                                )
+                            ]
+                        )
+                    )
+
                 open_canvas = True
 
             return metadata, open_canvas