From e4960480d6b4f282129d1d44d4c0bdeff1c6184f Mon Sep 17 00:00:00 2001
From: Conner Nilsen <connernilsen@meta.com>
Date: Tue, 25 Jul 2023 08:36:15 -0700
Subject: [PATCH] Update frontend snapshot tests to fix Github failing tests
 (#95)

Summary:
Pull Request resolved: https://github.com/facebook/sapp/pull/95

The previous diff in the stack fixed import errors that blocked any tests from running in Github CI. This diff fixes the frontend tests that began failing after the import errors were fixed.

Differential Revision: D47758887

fbshipit-source-id: c3ff6052cca15754f6e273d58f435eef6506aa4c
---
 .../src/__snapshots__/Issues.test.js.snap     | 733 ++++++++++++------
 .../src/__snapshots__/Runs.test.js.snap       | 101 +--
 .../src/__snapshots__/Traces.test.js.snap     | 303 ++++----
 3 files changed, 708 insertions(+), 429 deletions(-)

diff --git a/sapp/ui/frontend/src/__snapshots__/Issues.test.js.snap b/sapp/ui/frontend/src/__snapshots__/Issues.test.js.snap
index 73c0e34e..4e8bed52 100644
--- a/sapp/ui/frontend/src/__snapshots__/Issues.test.js.snap
+++ b/sapp/ui/frontend/src/__snapshots__/Issues.test.js.snap
@@ -2,7 +2,7 @@
 
 exports[`Renders issues and filters 1`] = `
 Array [
-  <div
+  <nav
     className="ant-breadcrumb"
     style={
       Object {
@@ -10,33 +10,35 @@ Array [
       }
     }
   >
-    <span>
-      <a
-        className="ant-breadcrumb-link"
-        href="/runs"
-      >
-        Runs
-      </a>
-      <span
-        className="ant-breadcrumb-separator"
-      >
-        /
-      </span>
-    </span>
-    <span>
-      <span
-        className="ant-breadcrumb-link"
-      >
-        Run 
-        0
-      </span>
-      <span
-        className="ant-breadcrumb-separator"
-      >
-        /
-      </span>
-    </span>
-  </div>,
+    <ol>
+      <li>
+        <a
+          className="ant-breadcrumb-link"
+          href="/runs"
+        >
+          Runs
+        </a>
+        <span
+          className="ant-breadcrumb-separator"
+        >
+          /
+        </span>
+      </li>
+      <li>
+        <span
+          className="ant-breadcrumb-link"
+        >
+          Run 
+          0
+        </span>
+        <span
+          className="ant-breadcrumb-separator"
+        >
+          /
+        </span>
+      </li>
+    </ol>
+  </nav>,
   <section
     className="ant-layout ant-layout-has-sider"
   >
@@ -171,6 +173,7 @@ Array [
         >
           <button
             className="ant-btn"
+            disabled={false}
             onClick={[Function]}
             onMouseEnter={[Function]}
             onMouseLeave={[Function]}
@@ -188,7 +191,6 @@ Array [
             >
               <svg
                 aria-hidden="true"
-                className=""
                 data-icon="filter"
                 fill="currentColor"
                 focusable="false"
@@ -207,18 +209,20 @@ Array [
           </button>
         </div>
         <ul
-          className="ant-menu ant-menu-light ant-menu-root ant-menu-inline"
-          onMouseEnter={[Function]}
-          onTransitionEnd={[Function]}
+          className="ant-menu ant-menu-root ant-menu-inline ant-menu-light"
+          data-menu-list={true}
+          onKeyDown={[Function]}
           role="menu"
           style={
             Object {
               "borderRight": 0,
             }
           }
+          tabIndex={0}
         >
           <div
             className="ant-select ant-select-auto-complete ant-select-single ant-select-customize-input ant-select-show-search"
+            eventKey="tmp_key-0"
             onBlur={[Function]}
             onFocus={[Function]}
             onKeyDown={[Function]}
@@ -230,106 +234,125 @@ Array [
                 "width": "100%",
               }
             }
+            warnKey={true}
           >
             <div
               className="ant-select-selector"
+              onClick={[Function]}
               onMouseDown={[Function]}
             >
               <span
                 className="ant-select-selection-search"
               >
                 <span
-                  className="ant-input-affix-wrapper ant-input-search ant-select-selection-search-input"
-                  onMouseUp={[Function]}
+                  className="ant-input-group-wrapper ant-input-search ant-select-selection-search-input"
                   style={
                     Object {
                       "opacity": null,
                     }
                   }
                 >
-                  <input
-                    aria-activedescendant="rc_select_TEST_OR_SSR_list_0"
-                    aria-autocomplete="list"
-                    aria-controls="rc_select_TEST_OR_SSR_list"
-                    aria-haspopup="listbox"
-                    aria-owns="rc_select_TEST_OR_SSR_list"
-                    autoComplete="off"
-                    className="ant-input"
-                    id="rc_select_TEST_OR_SSR"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onCompositionEnd={[Function]}
-                    onCompositionStart={[Function]}
-                    onFocus={[Function]}
-                    onKeyDown={[Function]}
-                    onMouseDown={[Function]}
-                    onPaste={[Function]}
-                    placeholder="saved filter"
-                    readOnly={false}
-                    role="combobox"
-                    style={null}
-                    type="search"
-                    unselectable={null}
-                    value=""
-                  />
                   <span
-                    className="ant-input-suffix"
+                    className="ant-input-wrapper ant-input-group"
                   >
+                    <input
+                      aria-activedescendant="rc_select_TEST_OR_SSR_list_0"
+                      aria-autocomplete="list"
+                      aria-controls="rc_select_TEST_OR_SSR_list"
+                      aria-haspopup="listbox"
+                      aria-owns="rc_select_TEST_OR_SSR_list"
+                      autoComplete="off"
+                      className="ant-input"
+                      hidden={null}
+                      id="rc_select_TEST_OR_SSR"
+                      onBlur={[Function]}
+                      onChange={[Function]}
+                      onCompositionEnd={[Function]}
+                      onCompositionStart={[Function]}
+                      onFocus={[Function]}
+                      onKeyDown={[Function]}
+                      onMouseDown={[Function]}
+                      onPaste={[Function]}
+                      placeholder="saved filter"
+                      readOnly={false}
+                      role="combobox"
+                      style={null}
+                      type="search"
+                      unselectable={null}
+                      value=""
+                    />
                     <span
-                      aria-label="search"
-                      className="anticon anticon-search ant-input-search-icon"
-                      onClick={[Function]}
-                      role="img"
-                      tabIndex={-1}
+                      className="ant-input-group-addon"
                     >
-                      <svg
-                        aria-hidden="true"
-                        className=""
-                        data-icon="search"
-                        fill="currentColor"
-                        focusable="false"
-                        height="1em"
-                        viewBox="64 64 896 896"
-                        width="1em"
+                      <button
+                        className="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
+                        disabled={false}
+                        onClick={[Function]}
+                        onMouseDown={[Function]}
+                        type="button"
                       >
-                        <path
-                          d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0011.6 0l43.6-43.5a8.2 8.2 0 000-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"
-                        />
-                      </svg>
+                        <span
+                          aria-label="search"
+                          className="anticon anticon-search"
+                          role="img"
+                        >
+                          <svg
+                            aria-hidden="true"
+                            data-icon="search"
+                            fill="currentColor"
+                            focusable="false"
+                            height="1em"
+                            viewBox="64 64 896 896"
+                            width="1em"
+                          >
+                            <path
+                              d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0011.6 0l43.6-43.5a8.2 8.2 0 000-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"
+                            />
+                          </svg>
+                        </span>
+                      </button>
                     </span>
                   </span>
                 </span>
               </span>
+              <span
+                className="ant-select-selection-placeholder"
+              />
             </div>
           </div>
           <li
             className="ant-menu-submenu ant-menu-submenu-inline"
             onMouseEnter={[Function]}
             onMouseLeave={[Function]}
-            role="menuitem"
+            role="none"
+            style={Object {}}
           >
             <div
+              aria-controls="rc-menu-uuid-test-tmp_key-1-popup"
               aria-expanded={false}
-              aria-haspopup="true"
+              aria-haspopup={true}
               className="ant-menu-submenu-title"
+              data-menu-id="rc-menu-uuid-test-tmp_key-1"
               onClick={[Function]}
+              onFocus={[Function]}
               onMouseEnter={[Function]}
               onMouseLeave={[Function]}
-              role="button"
+              role="menuitem"
               style={
                 Object {
                   "paddingLeft": 24,
                 }
               }
+              tabIndex={-1}
+              title={null}
             >
               <span
                 aria-label="setting"
-                className="anticon anticon-setting"
+                className="anticon anticon-setting ant-menu-item-icon"
                 role="img"
               >
                 <svg
                   aria-hidden="true"
-                  className=""
                   data-icon="setting"
                   fill="currentColor"
                   focusable="false"
@@ -342,41 +365,48 @@ Array [
                   />
                 </svg>
               </span>
-              <span>
+              <span
+                className="ant-menu-title-content"
+              >
                 Filter options
               </span>
               <i
                 className="ant-menu-submenu-arrow"
               />
             </div>
-            <div />
           </li>
           <li
             className="ant-menu-submenu ant-menu-submenu-inline ant-menu-submenu-open ant-menu-submenu-disabled"
             onMouseEnter={[Function]}
             onMouseLeave={[Function]}
-            role="menuitem"
+            role="none"
+            style={Object {}}
           >
             <div
+              aria-controls="rc-menu-uuid-test-recents-popup"
+              aria-disabled={true}
               aria-expanded={true}
-              aria-haspopup="true"
-              aria-owns="recents$Menu"
+              aria-haspopup={true}
               className="ant-menu-submenu-title"
-              role="button"
+              data-menu-id="rc-menu-uuid-test-recents"
+              onClick={[Function]}
+              onFocus={[Function]}
+              role="menuitem"
               style={
                 Object {
                   "paddingLeft": 24,
                 }
               }
+              tabIndex={null}
+              title={null}
             >
               <span
                 aria-label="field-time"
-                className="anticon anticon-field-time"
+                className="anticon anticon-field-time ant-menu-item-icon"
                 role="img"
               >
                 <svg
                   aria-hidden="true"
-                  className=""
                   data-icon="field-time"
                   fill="currentColor"
                   focusable="false"
@@ -395,7 +425,9 @@ Array [
                   />
                 </svg>
               </span>
-              <span>
+              <span
+                className="ant-menu-title-content"
+              >
                 Recent filters
               </span>
               <i
@@ -404,12 +436,120 @@ Array [
             </div>
             <ul
               className="ant-menu ant-menu-sub ant-menu-inline"
-              id="recents$Menu"
-              role="menu"
-              style={Object {}}
+              data-menu-list={true}
+              id="rc-menu-uuid-test-recents-popup"
             />
           </li>
         </ul>
+        <div
+          aria-hidden={true}
+          style={
+            Object {
+              "display": "none",
+            }
+          }
+        >
+          <div
+            className="ant-select ant-select-auto-complete ant-select-single ant-select-customize-input ant-select-show-search"
+            eventKey="tmp_key-0"
+            onBlur={[Function]}
+            onFocus={[Function]}
+            onKeyDown={[Function]}
+            onKeyUp={[Function]}
+            onMouseDown={[Function]}
+            style={
+              Object {
+                "padding": "12px 12px 0 12px",
+                "width": "100%",
+              }
+            }
+            warnKey={true}
+          >
+            <div
+              className="ant-select-selector"
+              onClick={[Function]}
+              onMouseDown={[Function]}
+            >
+              <span
+                className="ant-select-selection-search"
+              >
+                <span
+                  className="ant-input-group-wrapper ant-input-search ant-select-selection-search-input"
+                  style={
+                    Object {
+                      "opacity": null,
+                    }
+                  }
+                >
+                  <span
+                    className="ant-input-wrapper ant-input-group"
+                  >
+                    <input
+                      aria-activedescendant="rc_select_TEST_OR_SSR_list_0"
+                      aria-autocomplete="list"
+                      aria-controls="rc_select_TEST_OR_SSR_list"
+                      aria-haspopup="listbox"
+                      aria-owns="rc_select_TEST_OR_SSR_list"
+                      autoComplete="off"
+                      className="ant-input"
+                      hidden={null}
+                      id="rc_select_TEST_OR_SSR"
+                      onBlur={[Function]}
+                      onChange={[Function]}
+                      onCompositionEnd={[Function]}
+                      onCompositionStart={[Function]}
+                      onFocus={[Function]}
+                      onKeyDown={[Function]}
+                      onMouseDown={[Function]}
+                      onPaste={[Function]}
+                      placeholder="saved filter"
+                      readOnly={false}
+                      role="combobox"
+                      style={null}
+                      type="search"
+                      unselectable={null}
+                      value=""
+                    />
+                    <span
+                      className="ant-input-group-addon"
+                    >
+                      <button
+                        className="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
+                        disabled={false}
+                        onClick={[Function]}
+                        onMouseDown={[Function]}
+                        type="button"
+                      >
+                        <span
+                          aria-label="search"
+                          className="anticon anticon-search"
+                          role="img"
+                        >
+                          <svg
+                            aria-hidden="true"
+                            data-icon="search"
+                            fill="currentColor"
+                            focusable="false"
+                            height="1em"
+                            viewBox="64 64 896 896"
+                            width="1em"
+                          >
+                            <path
+                              d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0011.6 0l43.6-43.5a8.2 8.2 0 000-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"
+                            />
+                          </svg>
+                        </span>
+                      </button>
+                    </span>
+                  </span>
+                </span>
+              </span>
+              <span
+                className="ant-select-selection-placeholder"
+              />
+            </div>
+          </div>
+        </div>
       </div>
     </aside>
   </section>,
@@ -418,7 +558,7 @@ Array [
 
 exports[`Renders issues and filters 2`] = `
 Array [
-  <div
+  <nav
     className="ant-breadcrumb"
     style={
       Object {
@@ -426,33 +566,35 @@ Array [
       }
     }
   >
-    <span>
-      <a
-        className="ant-breadcrumb-link"
-        href="/runs"
-      >
-        Runs
-      </a>
-      <span
-        className="ant-breadcrumb-separator"
-      >
-        /
-      </span>
-    </span>
-    <span>
-      <span
-        className="ant-breadcrumb-link"
-      >
-        Run 
-        0
-      </span>
-      <span
-        className="ant-breadcrumb-separator"
-      >
-        /
-      </span>
-    </span>
-  </div>,
+    <ol>
+      <li>
+        <a
+          className="ant-breadcrumb-link"
+          href="/runs"
+        >
+          Runs
+        </a>
+        <span
+          className="ant-breadcrumb-separator"
+        >
+          /
+        </span>
+      </li>
+      <li>
+        <span
+          className="ant-breadcrumb-link"
+        >
+          Run 
+          0
+        </span>
+        <span
+          className="ant-breadcrumb-separator"
+        >
+          /
+        </span>
+      </li>
+    </ol>
+  </nav>,
   <section
     className="ant-layout ant-layout-has-sider"
   >
@@ -489,7 +631,6 @@ Array [
               >
                 <svg
                   aria-hidden="true"
-                  className=""
                   data-icon="fire"
                   fill="currentColor"
                   focusable="false"
@@ -513,7 +654,7 @@ Array [
                 href="/run/0/issue/11"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -530,7 +671,7 @@ Array [
             className="ant-row"
             style={
               Object {
-                "marginBottom": 4,
+                "marginBottom": -4,
                 "marginLeft": -4,
                 "marginRight": -4,
                 "marginTop": -4,
@@ -553,7 +694,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -575,7 +716,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -585,7 +726,7 @@ Array [
                   onMouseLeave={[Function]}
                   style={
                     Object {
-                      "WebkitLineClamp": null,
+                      "WebkitLineClamp": undefined,
                     }
                   }
                 >
@@ -602,7 +743,7 @@ Array [
             className="ant-row"
             style={
               Object {
-                "marginBottom": 4,
+                "marginBottom": -4,
                 "marginLeft": -4,
                 "marginRight": -4,
                 "marginTop": -4,
@@ -625,7 +766,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -647,7 +788,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -659,7 +800,7 @@ Array [
             className="ant-row"
             style={
               Object {
-                "marginBottom": 4,
+                "marginBottom": -4,
                 "marginLeft": -4,
                 "marginRight": -4,
                 "marginTop": -4,
@@ -682,7 +823,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -704,7 +845,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -727,6 +868,7 @@ Array [
                   >
                     <div
                       className="ant-select-selector"
+                      onClick={[Function]}
                       onMouseDown={[Function]}
                     >
                       <span
@@ -740,6 +882,7 @@ Array [
                           aria-owns="rc_select_TEST_OR_SSR_list"
                           autoComplete="off"
                           className="ant-select-selection-search-input"
+                          disabled={false}
                           id="rc_select_TEST_OR_SSR"
                           onChange={[Function]}
                           onCompositionEnd={[Function]}
@@ -785,7 +928,6 @@ Array [
                       >
                         <svg
                           aria-hidden="true"
-                          className=""
                           data-icon="down"
                           fill="currentColor"
                           focusable="false"
@@ -808,7 +950,7 @@ Array [
             className="ant-row"
             style={
               Object {
-                "marginBottom": 4,
+                "marginBottom": -4,
                 "marginLeft": -4,
                 "marginRight": -4,
                 "marginTop": -4,
@@ -831,7 +973,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -853,7 +995,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -861,7 +1003,7 @@ Array [
                   className="ant-typography"
                   style={
                     Object {
-                      "WebkitLineClamp": null,
+                      "WebkitLineClamp": undefined,
                     }
                   }
                 >
@@ -876,7 +1018,7 @@ Array [
             className="ant-row"
             style={
               Object {
-                "marginBottom": 4,
+                "marginBottom": -4,
                 "marginLeft": -4,
                 "marginRight": -4,
                 "marginTop": -4,
@@ -899,7 +1041,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -921,7 +1063,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -931,7 +1073,7 @@ Array [
                   onMouseLeave={[Function]}
                   style={
                     Object {
-                      "WebkitLineClamp": null,
+                      "WebkitLineClamp": undefined,
                       "wordBreak": "break-all",
                     }
                   }
@@ -947,7 +1089,7 @@ Array [
             className="ant-row"
             style={
               Object {
-                "marginBottom": 4,
+                "marginBottom": -4,
                 "marginLeft": -4,
                 "marginRight": -4,
                 "marginTop": -4,
@@ -970,7 +1112,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -992,7 +1134,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -1009,7 +1151,6 @@ Array [
                 >
                   <svg
                     aria-hidden="true"
-                    className=""
                     data-icon="code"
                     fill="currentColor"
                     focusable="false"
@@ -1038,7 +1179,7 @@ Array [
                   onMouseLeave={[Function]}
                   style={
                     Object {
-                      "WebkitLineClamp": null,
+                      "WebkitLineClamp": undefined,
                       "wordBreak": "break-all",
                     }
                   }
@@ -1054,7 +1195,7 @@ Array [
             className="ant-row"
             style={
               Object {
-                "marginBottom": 4,
+                "marginBottom": -4,
                 "marginLeft": -4,
                 "marginRight": -4,
                 "marginTop": -4,
@@ -1077,7 +1218,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -1099,7 +1240,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -1127,7 +1268,7 @@ Array [
                   onMouseLeave={[Function]}
                   style={
                     Object {
-                      "WebkitLineClamp": null,
+                      "WebkitLineClamp": undefined,
                     }
                   }
                 >
@@ -1165,7 +1306,7 @@ Array [
             className="ant-row"
             style={
               Object {
-                "marginBottom": 4,
+                "marginBottom": -4,
                 "marginLeft": -4,
                 "marginRight": -4,
                 "marginTop": -4,
@@ -1188,7 +1329,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -1210,7 +1351,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -1238,7 +1379,7 @@ Array [
                   onMouseLeave={[Function]}
                   style={
                     Object {
-                      "WebkitLineClamp": null,
+                      "WebkitLineClamp": undefined,
                     }
                   }
                 >
@@ -1276,7 +1417,7 @@ Array [
             className="ant-row"
             style={
               Object {
-                "marginBottom": 4,
+                "marginBottom": -4,
                 "marginLeft": -4,
                 "marginRight": -4,
                 "marginTop": -4,
@@ -1299,7 +1440,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -1321,7 +1462,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -1388,6 +1529,7 @@ Array [
         >
           <button
             className="ant-btn"
+            disabled={false}
             onClick={[Function]}
             onMouseEnter={[Function]}
             onMouseLeave={[Function]}
@@ -1405,7 +1547,6 @@ Array [
             >
               <svg
                 aria-hidden="true"
-                className=""
                 data-icon="filter"
                 fill="currentColor"
                 focusable="false"
@@ -1424,18 +1565,20 @@ Array [
           </button>
         </div>
         <ul
-          className="ant-menu ant-menu-light ant-menu-root ant-menu-inline"
-          onMouseEnter={[Function]}
-          onTransitionEnd={[Function]}
+          className="ant-menu ant-menu-root ant-menu-inline ant-menu-light"
+          data-menu-list={true}
+          onKeyDown={[Function]}
           role="menu"
           style={
             Object {
               "borderRight": 0,
             }
           }
+          tabIndex={0}
         >
           <div
             className="ant-select ant-select-auto-complete ant-select-single ant-select-customize-input ant-select-show-search"
+            eventKey="tmp_key-0"
             onBlur={[Function]}
             onFocus={[Function]}
             onKeyDown={[Function]}
@@ -1447,106 +1590,125 @@ Array [
                 "width": "100%",
               }
             }
+            warnKey={true}
           >
             <div
               className="ant-select-selector"
+              onClick={[Function]}
               onMouseDown={[Function]}
             >
               <span
                 className="ant-select-selection-search"
               >
                 <span
-                  className="ant-input-affix-wrapper ant-input-search ant-select-selection-search-input"
-                  onMouseUp={[Function]}
+                  className="ant-input-group-wrapper ant-input-search ant-select-selection-search-input"
                   style={
                     Object {
                       "opacity": null,
                     }
                   }
                 >
-                  <input
-                    aria-activedescendant="rc_select_TEST_OR_SSR_list_0"
-                    aria-autocomplete="list"
-                    aria-controls="rc_select_TEST_OR_SSR_list"
-                    aria-haspopup="listbox"
-                    aria-owns="rc_select_TEST_OR_SSR_list"
-                    autoComplete="off"
-                    className="ant-input"
-                    id="rc_select_TEST_OR_SSR"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onCompositionEnd={[Function]}
-                    onCompositionStart={[Function]}
-                    onFocus={[Function]}
-                    onKeyDown={[Function]}
-                    onMouseDown={[Function]}
-                    onPaste={[Function]}
-                    placeholder="saved filter"
-                    readOnly={false}
-                    role="combobox"
-                    style={null}
-                    type="search"
-                    unselectable={null}
-                    value=""
-                  />
                   <span
-                    className="ant-input-suffix"
+                    className="ant-input-wrapper ant-input-group"
                   >
+                    <input
+                      aria-activedescendant="rc_select_TEST_OR_SSR_list_0"
+                      aria-autocomplete="list"
+                      aria-controls="rc_select_TEST_OR_SSR_list"
+                      aria-haspopup="listbox"
+                      aria-owns="rc_select_TEST_OR_SSR_list"
+                      autoComplete="off"
+                      className="ant-input"
+                      hidden={null}
+                      id="rc_select_TEST_OR_SSR"
+                      onBlur={[Function]}
+                      onChange={[Function]}
+                      onCompositionEnd={[Function]}
+                      onCompositionStart={[Function]}
+                      onFocus={[Function]}
+                      onKeyDown={[Function]}
+                      onMouseDown={[Function]}
+                      onPaste={[Function]}
+                      placeholder="saved filter"
+                      readOnly={false}
+                      role="combobox"
+                      style={null}
+                      type="search"
+                      unselectable={null}
+                      value=""
+                    />
                     <span
-                      aria-label="search"
-                      className="anticon anticon-search ant-input-search-icon"
-                      onClick={[Function]}
-                      role="img"
-                      tabIndex={-1}
+                      className="ant-input-group-addon"
                     >
-                      <svg
-                        aria-hidden="true"
-                        className=""
-                        data-icon="search"
-                        fill="currentColor"
-                        focusable="false"
-                        height="1em"
-                        viewBox="64 64 896 896"
-                        width="1em"
+                      <button
+                        className="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
+                        disabled={false}
+                        onClick={[Function]}
+                        onMouseDown={[Function]}
+                        type="button"
                       >
-                        <path
-                          d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0011.6 0l43.6-43.5a8.2 8.2 0 000-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"
-                        />
-                      </svg>
+                        <span
+                          aria-label="search"
+                          className="anticon anticon-search"
+                          role="img"
+                        >
+                          <svg
+                            aria-hidden="true"
+                            data-icon="search"
+                            fill="currentColor"
+                            focusable="false"
+                            height="1em"
+                            viewBox="64 64 896 896"
+                            width="1em"
+                          >
+                            <path
+                              d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0011.6 0l43.6-43.5a8.2 8.2 0 000-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"
+                            />
+                          </svg>
+                        </span>
+                      </button>
                     </span>
                   </span>
                 </span>
               </span>
+              <span
+                className="ant-select-selection-placeholder"
+              />
             </div>
           </div>
           <li
             className="ant-menu-submenu ant-menu-submenu-inline"
             onMouseEnter={[Function]}
             onMouseLeave={[Function]}
-            role="menuitem"
+            role="none"
+            style={Object {}}
           >
             <div
+              aria-controls="rc-menu-uuid-test-tmp_key-1-popup"
               aria-expanded={false}
-              aria-haspopup="true"
+              aria-haspopup={true}
               className="ant-menu-submenu-title"
+              data-menu-id="rc-menu-uuid-test-tmp_key-1"
               onClick={[Function]}
+              onFocus={[Function]}
               onMouseEnter={[Function]}
               onMouseLeave={[Function]}
-              role="button"
+              role="menuitem"
               style={
                 Object {
                   "paddingLeft": 24,
                 }
               }
+              tabIndex={-1}
+              title={null}
             >
               <span
                 aria-label="setting"
-                className="anticon anticon-setting"
+                className="anticon anticon-setting ant-menu-item-icon"
                 role="img"
               >
                 <svg
                   aria-hidden="true"
-                  className=""
                   data-icon="setting"
                   fill="currentColor"
                   focusable="false"
@@ -1559,41 +1721,48 @@ Array [
                   />
                 </svg>
               </span>
-              <span>
+              <span
+                className="ant-menu-title-content"
+              >
                 Filter options
               </span>
               <i
                 className="ant-menu-submenu-arrow"
               />
             </div>
-            <div />
           </li>
           <li
             className="ant-menu-submenu ant-menu-submenu-inline ant-menu-submenu-open ant-menu-submenu-disabled"
             onMouseEnter={[Function]}
             onMouseLeave={[Function]}
-            role="menuitem"
+            role="none"
+            style={Object {}}
           >
             <div
+              aria-controls="rc-menu-uuid-test-recents-popup"
+              aria-disabled={true}
               aria-expanded={true}
-              aria-haspopup="true"
-              aria-owns="recents$Menu"
+              aria-haspopup={true}
               className="ant-menu-submenu-title"
-              role="button"
+              data-menu-id="rc-menu-uuid-test-recents"
+              onClick={[Function]}
+              onFocus={[Function]}
+              role="menuitem"
               style={
                 Object {
                   "paddingLeft": 24,
                 }
               }
+              tabIndex={null}
+              title={null}
             >
               <span
                 aria-label="field-time"
-                className="anticon anticon-field-time"
+                className="anticon anticon-field-time ant-menu-item-icon"
                 role="img"
               >
                 <svg
                   aria-hidden="true"
-                  className=""
                   data-icon="field-time"
                   fill="currentColor"
                   focusable="false"
@@ -1612,7 +1781,9 @@ Array [
                   />
                 </svg>
               </span>
-              <span>
+              <span
+                className="ant-menu-title-content"
+              >
                 Recent filters
               </span>
               <i
@@ -1621,12 +1792,120 @@ Array [
             </div>
             <ul
               className="ant-menu ant-menu-sub ant-menu-inline"
-              id="recents$Menu"
-              role="menu"
-              style={Object {}}
+              data-menu-list={true}
+              id="rc-menu-uuid-test-recents-popup"
             />
           </li>
         </ul>
+        <div
+          aria-hidden={true}
+          style={
+            Object {
+              "display": "none",
+            }
+          }
+        >
+          <div
+            className="ant-select ant-select-auto-complete ant-select-single ant-select-customize-input ant-select-show-search"
+            eventKey="tmp_key-0"
+            onBlur={[Function]}
+            onFocus={[Function]}
+            onKeyDown={[Function]}
+            onKeyUp={[Function]}
+            onMouseDown={[Function]}
+            style={
+              Object {
+                "padding": "12px 12px 0 12px",
+                "width": "100%",
+              }
+            }
+            warnKey={true}
+          >
+            <div
+              className="ant-select-selector"
+              onClick={[Function]}
+              onMouseDown={[Function]}
+            >
+              <span
+                className="ant-select-selection-search"
+              >
+                <span
+                  className="ant-input-group-wrapper ant-input-search ant-select-selection-search-input"
+                  style={
+                    Object {
+                      "opacity": null,
+                    }
+                  }
+                >
+                  <span
+                    className="ant-input-wrapper ant-input-group"
+                  >
+                    <input
+                      aria-activedescendant="rc_select_TEST_OR_SSR_list_0"
+                      aria-autocomplete="list"
+                      aria-controls="rc_select_TEST_OR_SSR_list"
+                      aria-haspopup="listbox"
+                      aria-owns="rc_select_TEST_OR_SSR_list"
+                      autoComplete="off"
+                      className="ant-input"
+                      hidden={null}
+                      id="rc_select_TEST_OR_SSR"
+                      onBlur={[Function]}
+                      onChange={[Function]}
+                      onCompositionEnd={[Function]}
+                      onCompositionStart={[Function]}
+                      onFocus={[Function]}
+                      onKeyDown={[Function]}
+                      onMouseDown={[Function]}
+                      onPaste={[Function]}
+                      placeholder="saved filter"
+                      readOnly={false}
+                      role="combobox"
+                      style={null}
+                      type="search"
+                      unselectable={null}
+                      value=""
+                    />
+                    <span
+                      className="ant-input-group-addon"
+                    >
+                      <button
+                        className="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
+                        disabled={false}
+                        onClick={[Function]}
+                        onMouseDown={[Function]}
+                        type="button"
+                      >
+                        <span
+                          aria-label="search"
+                          className="anticon anticon-search"
+                          role="img"
+                        >
+                          <svg
+                            aria-hidden="true"
+                            data-icon="search"
+                            fill="currentColor"
+                            focusable="false"
+                            height="1em"
+                            viewBox="64 64 896 896"
+                            width="1em"
+                          >
+                            <path
+                              d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0011.6 0l43.6-43.5a8.2 8.2 0 000-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"
+                            />
+                          </svg>
+                        </span>
+                      </button>
+                    </span>
+                  </span>
+                </span>
+              </span>
+              <span
+                className="ant-select-selection-placeholder"
+              />
+            </div>
+          </div>
+        </div>
       </div>
     </aside>
   </section>,
diff --git a/sapp/ui/frontend/src/__snapshots__/Runs.test.js.snap b/sapp/ui/frontend/src/__snapshots__/Runs.test.js.snap
index 76479ff5..cbfa1a84 100644
--- a/sapp/ui/frontend/src/__snapshots__/Runs.test.js.snap
+++ b/sapp/ui/frontend/src/__snapshots__/Runs.test.js.snap
@@ -2,7 +2,7 @@
 
 exports[`Renders runs 1`] = `
 Array [
-  <div
+  <nav
     className="ant-breadcrumb"
     style={
       Object {
@@ -10,19 +10,21 @@ Array [
       }
     }
   >
-    <span>
-      <span
-        className="ant-breadcrumb-link"
-      >
-        Runs
-      </span>
-      <span
-        className="ant-breadcrumb-separator"
-      >
-        /
-      </span>
-    </span>
-  </div>,
+    <ol>
+      <li>
+        <span
+          className="ant-breadcrumb-link"
+        >
+          Runs
+        </span>
+        <span
+          className="ant-breadcrumb-separator"
+        >
+          /
+        </span>
+      </li>
+    </ol>
+  </nav>,
   <div
     className="ant-row"
     style={
@@ -61,18 +63,17 @@ Array [
               className="ant-typography ant-typography-secondary"
               style={
                 Object {
-                  "WebkitLineClamp": null,
+                  "WebkitLineClamp": undefined,
                 }
               }
             >
               <span
                 aria-label="loading"
-                className="anticon anticon-loading"
+                className="anticon anticon-loading anticon-spin"
                 role="img"
               >
                 <svg
                   aria-hidden="true"
-                  className="anticon-spin"
                   data-icon="loading"
                   fill="currentColor"
                   focusable="false"
@@ -98,7 +99,7 @@ Array [
 
 exports[`Renders runs 2`] = `
 Array [
-  <div
+  <nav
     className="ant-breadcrumb"
     style={
       Object {
@@ -106,19 +107,21 @@ Array [
       }
     }
   >
-    <span>
-      <span
-        className="ant-breadcrumb-link"
-      >
-        Runs
-      </span>
-      <span
-        className="ant-breadcrumb-separator"
-      >
-        /
-      </span>
-    </span>
-  </div>,
+    <ol>
+      <li>
+        <span
+          className="ant-breadcrumb-link"
+        >
+          Runs
+        </span>
+        <span
+          className="ant-breadcrumb-separator"
+        >
+          /
+        </span>
+      </li>
+    </ol>
+  </nav>,
   <div
     className="ant-row"
     style={
@@ -162,7 +165,6 @@ Array [
               >
                 <svg
                   aria-hidden="true"
-                  className=""
                   data-icon="sync"
                   fill="currentColor"
                   focusable="false"
@@ -187,7 +189,7 @@ Array [
                 onClick={[Function]}
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -204,7 +206,7 @@ Array [
             className="ant-row"
             style={
               Object {
-                "marginBottom": 4,
+                "marginBottom": -4,
                 "marginLeft": -4,
                 "marginRight": -4,
                 "marginTop": -4,
@@ -227,7 +229,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -249,7 +251,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -257,7 +259,7 @@ Array [
                   className="ant-typography"
                   style={
                     Object {
-                      "WebkitLineClamp": null,
+                      "WebkitLineClamp": undefined,
                     }
                   }
                 >
@@ -272,7 +274,7 @@ Array [
             className="ant-row"
             style={
               Object {
-                "marginBottom": 4,
+                "marginBottom": -4,
                 "marginLeft": -4,
                 "marginRight": -4,
                 "marginTop": -4,
@@ -295,7 +297,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -317,7 +319,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -325,7 +327,7 @@ Array [
                   className="ant-typography"
                   style={
                     Object {
-                      "WebkitLineClamp": null,
+                      "WebkitLineClamp": undefined,
                     }
                   }
                 >
@@ -340,7 +342,7 @@ Array [
             className="ant-row"
             style={
               Object {
-                "marginBottom": 4,
+                "marginBottom": -4,
                 "marginLeft": -4,
                 "marginRight": -4,
                 "marginTop": -4,
@@ -363,7 +365,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -385,7 +387,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -393,7 +395,7 @@ Array [
                   className="ant-typography"
                   style={
                     Object {
-                      "WebkitLineClamp": null,
+                      "WebkitLineClamp": undefined,
                     }
                   }
                 >
@@ -408,7 +410,7 @@ Array [
             className="ant-row"
             style={
               Object {
-                "marginBottom": 4,
+                "marginBottom": -4,
                 "marginLeft": -4,
                 "marginRight": -4,
                 "marginTop": -4,
@@ -431,7 +433,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -453,7 +455,7 @@ Array [
                 className="ant-typography ant-typography-secondary"
                 style={
                   Object {
-                    "WebkitLineClamp": null,
+                    "WebkitLineClamp": undefined,
                   }
                 }
               >
@@ -461,7 +463,7 @@ Array [
                   className="ant-typography"
                   style={
                     Object {
-                      "WebkitLineClamp": null,
+                      "WebkitLineClamp": undefined,
                     }
                   }
                 >
@@ -493,7 +495,6 @@ Array [
               >
                 <svg
                   aria-hidden="true"
-                  className=""
                   data-icon="delete"
                   fill="currentColor"
                   focusable="false"
diff --git a/sapp/ui/frontend/src/__snapshots__/Traces.test.js.snap b/sapp/ui/frontend/src/__snapshots__/Traces.test.js.snap
index eb304764..e990dd6f 100644
--- a/sapp/ui/frontend/src/__snapshots__/Traces.test.js.snap
+++ b/sapp/ui/frontend/src/__snapshots__/Traces.test.js.snap
@@ -2,7 +2,7 @@
 
 exports[`Renders traces 1`] = `
 Array [
-  <div
+  <nav
     className="ant-breadcrumb"
     style={
       Object {
@@ -10,47 +10,49 @@ Array [
       }
     }
   >
-    <span>
-      <a
-        className="ant-breadcrumb-link"
-        href="/runs"
-      >
-        Runs
-      </a>
-      <span
-        className="ant-breadcrumb-separator"
-      >
-        /
-      </span>
-    </span>
-    <span>
-      <a
-        className="ant-breadcrumb-link"
-        href="/run/0"
-      >
-        Run 
-        0
-      </a>
-      <span
-        className="ant-breadcrumb-separator"
-      >
-        /
-      </span>
-    </span>
-    <span>
-      <span
-        className="ant-breadcrumb-link"
-      >
-        Issue 
-        
-      </span>
-      <span
-        className="ant-breadcrumb-separator"
-      >
-        /
-      </span>
-    </span>
-  </div>,
+    <ol>
+      <li>
+        <a
+          className="ant-breadcrumb-link"
+          href="/runs"
+        >
+          Runs
+        </a>
+        <span
+          className="ant-breadcrumb-separator"
+        >
+          /
+        </span>
+      </li>
+      <li>
+        <a
+          className="ant-breadcrumb-link"
+          href="/run/0"
+        >
+          Run 
+          0
+        </a>
+        <span
+          className="ant-breadcrumb-separator"
+        >
+          /
+        </span>
+      </li>
+      <li>
+        <span
+          className="ant-breadcrumb-link"
+        >
+          Issue 
+          
+        </span>
+        <span
+          className="ant-breadcrumb-separator"
+        >
+          /
+        </span>
+      </li>
+    </ol>
+  </nav>,
   <div
     className="ant-card ant-card-bordered"
   >
@@ -309,7 +311,7 @@ Array [
 
 exports[`Renders traces 2`] = `
 Array [
-  <div
+  <nav
     className="ant-breadcrumb"
     style={
       Object {
@@ -317,47 +319,49 @@ Array [
       }
     }
   >
-    <span>
-      <a
-        className="ant-breadcrumb-link"
-        href="/runs"
-      >
-        Runs
-      </a>
-      <span
-        className="ant-breadcrumb-separator"
-      >
-        /
-      </span>
-    </span>
-    <span>
-      <a
-        className="ant-breadcrumb-link"
-        href="/run/0"
-      >
-        Run 
-        0
-      </a>
-      <span
-        className="ant-breadcrumb-separator"
-      >
-        /
-      </span>
-    </span>
-    <span>
-      <span
-        className="ant-breadcrumb-link"
-      >
-        Issue 
-        1
-      </span>
-      <span
-        className="ant-breadcrumb-separator"
-      >
-        /
-      </span>
-    </span>
-  </div>,
+    <ol>
+      <li>
+        <a
+          className="ant-breadcrumb-link"
+          href="/runs"
+        >
+          Runs
+        </a>
+        <span
+          className="ant-breadcrumb-separator"
+        >
+          /
+        </span>
+      </li>
+      <li>
+        <a
+          className="ant-breadcrumb-link"
+          href="/run/0"
+        >
+          Run 
+          0
+        </a>
+        <span
+          className="ant-breadcrumb-separator"
+        >
+          /
+        </span>
+      </li>
+      <li>
+        <span
+          className="ant-breadcrumb-link"
+        >
+          Issue 
+          1
+        </span>
+        <span
+          className="ant-breadcrumb-separator"
+        >
+          /
+        </span>
+      </li>
+    </ol>
+  </nav>,
   <div
     className="ant-card ant-card-bordered ant-card-small"
   >
@@ -383,7 +387,6 @@ Array [
           >
             <svg
               aria-hidden="true"
-              className=""
               data-icon="fire"
               fill="currentColor"
               focusable="false"
@@ -408,7 +411,7 @@ Array [
         className="ant-row"
         style={
           Object {
-            "marginBottom": 4,
+            "marginBottom": -4,
             "marginLeft": -4,
             "marginRight": -4,
             "marginTop": -4,
@@ -431,7 +434,7 @@ Array [
             className="ant-typography ant-typography-secondary"
             style={
               Object {
-                "WebkitLineClamp": null,
+                "WebkitLineClamp": undefined,
               }
             }
           >
@@ -453,7 +456,7 @@ Array [
             className="ant-typography ant-typography-secondary"
             style={
               Object {
-                "WebkitLineClamp": null,
+                "WebkitLineClamp": undefined,
               }
             }
           >
@@ -463,7 +466,7 @@ Array [
               onMouseLeave={[Function]}
               style={
                 Object {
-                  "WebkitLineClamp": null,
+                  "WebkitLineClamp": undefined,
                 }
               }
             >
@@ -479,7 +482,7 @@ Array [
         className="ant-row"
         style={
           Object {
-            "marginBottom": 4,
+            "marginBottom": -4,
             "marginLeft": -4,
             "marginRight": -4,
             "marginTop": -4,
@@ -502,7 +505,7 @@ Array [
             className="ant-typography ant-typography-secondary"
             style={
               Object {
-                "WebkitLineClamp": null,
+                "WebkitLineClamp": undefined,
               }
             }
           >
@@ -524,7 +527,7 @@ Array [
             className="ant-typography ant-typography-secondary"
             style={
               Object {
-                "WebkitLineClamp": null,
+                "WebkitLineClamp": undefined,
               }
             }
           >
@@ -536,7 +539,7 @@ Array [
         className="ant-row"
         style={
           Object {
-            "marginBottom": 4,
+            "marginBottom": -4,
             "marginLeft": -4,
             "marginRight": -4,
             "marginTop": -4,
@@ -559,7 +562,7 @@ Array [
             className="ant-typography ant-typography-secondary"
             style={
               Object {
-                "WebkitLineClamp": null,
+                "WebkitLineClamp": undefined,
               }
             }
           >
@@ -581,7 +584,7 @@ Array [
             className="ant-typography ant-typography-secondary"
             style={
               Object {
-                "WebkitLineClamp": null,
+                "WebkitLineClamp": undefined,
               }
             }
           >
@@ -604,6 +607,7 @@ Array [
               >
                 <div
                   className="ant-select-selector"
+                  onClick={[Function]}
                   onMouseDown={[Function]}
                 >
                   <span
@@ -617,6 +621,7 @@ Array [
                       aria-owns="rc_select_TEST_OR_SSR_list"
                       autoComplete="off"
                       className="ant-select-selection-search-input"
+                      disabled={false}
                       id="rc_select_TEST_OR_SSR"
                       onChange={[Function]}
                       onCompositionEnd={[Function]}
@@ -662,7 +667,6 @@ Array [
                   >
                     <svg
                       aria-hidden="true"
-                      className=""
                       data-icon="down"
                       fill="currentColor"
                       focusable="false"
@@ -685,7 +689,7 @@ Array [
         className="ant-row"
         style={
           Object {
-            "marginBottom": 4,
+            "marginBottom": -4,
             "marginLeft": -4,
             "marginRight": -4,
             "marginTop": -4,
@@ -708,7 +712,7 @@ Array [
             className="ant-typography ant-typography-secondary"
             style={
               Object {
-                "WebkitLineClamp": null,
+                "WebkitLineClamp": undefined,
               }
             }
           >
@@ -730,7 +734,7 @@ Array [
             className="ant-typography ant-typography-secondary"
             style={
               Object {
-                "WebkitLineClamp": null,
+                "WebkitLineClamp": undefined,
               }
             }
           >
@@ -738,7 +742,7 @@ Array [
               className="ant-typography"
               style={
                 Object {
-                  "WebkitLineClamp": null,
+                  "WebkitLineClamp": undefined,
                 }
               }
             >
@@ -753,7 +757,7 @@ Array [
         className="ant-row"
         style={
           Object {
-            "marginBottom": 4,
+            "marginBottom": -4,
             "marginLeft": -4,
             "marginRight": -4,
             "marginTop": -4,
@@ -776,7 +780,7 @@ Array [
             className="ant-typography ant-typography-secondary"
             style={
               Object {
-                "WebkitLineClamp": null,
+                "WebkitLineClamp": undefined,
               }
             }
           >
@@ -798,7 +802,7 @@ Array [
             className="ant-typography ant-typography-secondary"
             style={
               Object {
-                "WebkitLineClamp": null,
+                "WebkitLineClamp": undefined,
               }
             }
           >
@@ -808,7 +812,7 @@ Array [
               onMouseLeave={[Function]}
               style={
                 Object {
-                  "WebkitLineClamp": null,
+                  "WebkitLineClamp": undefined,
                   "wordBreak": "break-all",
                 }
               }
@@ -824,7 +828,7 @@ Array [
         className="ant-row"
         style={
           Object {
-            "marginBottom": 4,
+            "marginBottom": -4,
             "marginLeft": -4,
             "marginRight": -4,
             "marginTop": -4,
@@ -847,7 +851,7 @@ Array [
             className="ant-typography ant-typography-secondary"
             style={
               Object {
-                "WebkitLineClamp": null,
+                "WebkitLineClamp": undefined,
               }
             }
           >
@@ -869,7 +873,7 @@ Array [
             className="ant-typography ant-typography-secondary"
             style={
               Object {
-                "WebkitLineClamp": null,
+                "WebkitLineClamp": undefined,
               }
             }
           >
@@ -886,7 +890,6 @@ Array [
             >
               <svg
                 aria-hidden="true"
-                className=""
                 data-icon="code"
                 fill="currentColor"
                 focusable="false"
@@ -915,7 +918,7 @@ Array [
               onMouseLeave={[Function]}
               style={
                 Object {
-                  "WebkitLineClamp": null,
+                  "WebkitLineClamp": undefined,
                   "wordBreak": "break-all",
                 }
               }
@@ -931,7 +934,7 @@ Array [
         className="ant-row"
         style={
           Object {
-            "marginBottom": 4,
+            "marginBottom": -4,
             "marginLeft": -4,
             "marginRight": -4,
             "marginTop": -4,
@@ -954,7 +957,7 @@ Array [
             className="ant-typography ant-typography-secondary"
             style={
               Object {
-                "WebkitLineClamp": null,
+                "WebkitLineClamp": undefined,
               }
             }
           >
@@ -976,7 +979,7 @@ Array [
             className="ant-typography ant-typography-secondary"
             style={
               Object {
-                "WebkitLineClamp": null,
+                "WebkitLineClamp": undefined,
               }
             }
           >
@@ -1004,7 +1007,7 @@ Array [
               onMouseLeave={[Function]}
               style={
                 Object {
-                  "WebkitLineClamp": null,
+                  "WebkitLineClamp": undefined,
                 }
               }
             >
@@ -1042,7 +1045,7 @@ Array [
         className="ant-row"
         style={
           Object {
-            "marginBottom": 4,
+            "marginBottom": -4,
             "marginLeft": -4,
             "marginRight": -4,
             "marginTop": -4,
@@ -1065,7 +1068,7 @@ Array [
             className="ant-typography ant-typography-secondary"
             style={
               Object {
-                "WebkitLineClamp": null,
+                "WebkitLineClamp": undefined,
               }
             }
           >
@@ -1087,7 +1090,7 @@ Array [
             className="ant-typography ant-typography-secondary"
             style={
               Object {
-                "WebkitLineClamp": null,
+                "WebkitLineClamp": undefined,
               }
             }
           >
@@ -1115,7 +1118,7 @@ Array [
               onMouseLeave={[Function]}
               style={
                 Object {
-                  "WebkitLineClamp": null,
+                  "WebkitLineClamp": undefined,
                 }
               }
             >
@@ -1153,7 +1156,7 @@ Array [
         className="ant-row"
         style={
           Object {
-            "marginBottom": 4,
+            "marginBottom": -4,
             "marginLeft": -4,
             "marginRight": -4,
             "marginTop": -4,
@@ -1176,7 +1179,7 @@ Array [
             className="ant-typography ant-typography-secondary"
             style={
               Object {
-                "WebkitLineClamp": null,
+                "WebkitLineClamp": undefined,
               }
             }
           >
@@ -1198,7 +1201,7 @@ Array [
             className="ant-typography ant-typography-secondary"
             style={
               Object {
-                "WebkitLineClamp": null,
+                "WebkitLineClamp": undefined,
               }
             }
           >
@@ -1224,7 +1227,7 @@ Array [
         className="ant-row"
         style={
           Object {
-            "marginBottom": 4,
+            "marginBottom": -4,
             "marginLeft": -4,
             "marginRight": -4,
             "marginTop": -4,
@@ -1247,7 +1250,7 @@ Array [
             className="ant-typography ant-typography-secondary"
             style={
               Object {
-                "WebkitLineClamp": null,
+                "WebkitLineClamp": undefined,
               }
             }
           >
@@ -1269,7 +1272,7 @@ Array [
             className="ant-typography ant-typography-secondary"
             style={
               Object {
-                "WebkitLineClamp": null,
+                "WebkitLineClamp": undefined,
               }
             }
           >
@@ -1302,7 +1305,7 @@ Array [
         className="ant-typography"
         style={
           Object {
-            "WebkitLineClamp": null,
+            "WebkitLineClamp": undefined,
           }
         }
       >
@@ -1318,7 +1321,6 @@ Array [
         >
           <svg
             aria-hidden="true"
-            className=""
             data-icon="vertical-align-top"
             fill="currentColor"
             focusable="false"
@@ -1354,7 +1356,7 @@ Array [
           onMouseLeave={[Function]}
           style={
             Object {
-              "WebkitLineClamp": null,
+              "WebkitLineClamp": undefined,
               "wordBreak": "break-all",
             }
           }
@@ -1371,7 +1373,7 @@ Array [
           onMouseLeave={[Function]}
           style={
             Object {
-              "WebkitLineClamp": null,
+              "WebkitLineClamp": undefined,
               "wordBreak": "break-all",
             }
           }
@@ -1388,6 +1390,7 @@ Array [
       >
         <span
           className="ant-divider-inner-text"
+          style={Object {}}
         >
           Traces
         </span>
@@ -1403,7 +1406,7 @@ Array [
             Object {
               "cursor": "not-allowed",
               "display": "inline-block",
-              "width": null,
+              "width": undefined,
             }
           }
         >
@@ -1425,7 +1428,6 @@ Array [
             >
               <svg
                 aria-hidden="true"
-                className=""
                 data-icon="edit"
                 fill="currentColor"
                 focusable="false"
@@ -1442,6 +1444,7 @@ Array [
         </span>
         <button
           className="ant-btn ant-btn-text ant-btn-sm ant-btn-icon-only"
+          disabled={false}
           onClick={[Function]}
           onMouseEnter={[Function]}
           onMouseLeave={[Function]}
@@ -1454,7 +1457,6 @@ Array [
           >
             <svg
               aria-hidden="true"
-              className=""
               data-icon="select"
               fill="currentColor"
               focusable="false"
@@ -1490,7 +1492,7 @@ Array [
         className="ant-typography"
         style={
           Object {
-            "WebkitLineClamp": null,
+            "WebkitLineClamp": undefined,
           }
         }
       >
@@ -1506,7 +1508,6 @@ Array [
         >
           <svg
             aria-hidden="true"
-            className=""
             data-icon="vertical-align-middle"
             fill="currentColor"
             focusable="false"
@@ -1527,7 +1528,7 @@ Array [
           onMouseLeave={[Function]}
           style={
             Object {
-              "WebkitLineClamp": null,
+              "WebkitLineClamp": undefined,
               "wordBreak": "break-all",
             }
           }
@@ -1544,7 +1545,7 @@ Array [
           onMouseLeave={[Function]}
           style={
             Object {
-              "WebkitLineClamp": null,
+              "WebkitLineClamp": undefined,
               "wordBreak": "break-all",
             }
           }
@@ -1566,7 +1567,7 @@ Array [
             Object {
               "cursor": "not-allowed",
               "display": "inline-block",
-              "width": null,
+              "width": undefined,
             }
           }
         >
@@ -1605,7 +1606,6 @@ Expected variables: {"path":"tests.js"}
             >
               <svg
                 aria-hidden="true"
-                className=""
                 data-icon="edit"
                 fill="currentColor"
                 focusable="false"
@@ -1628,7 +1628,7 @@ Expected variables: {"path":"tests.js"}
             Object {
               "cursor": "not-allowed",
               "display": "inline-block",
-              "width": null,
+              "width": undefined,
             }
           }
         >
@@ -1667,7 +1667,6 @@ Expected variables: {"path":"tests.js"}
             >
               <svg
                 aria-hidden="true"
-                className=""
                 data-icon="select"
                 fill="currentColor"
                 focusable="false"
@@ -1694,14 +1693,15 @@ Expected variables: {"path":"tests.js"}
           role="alert"
           style={Object {}}
         >
-          <span
-            className="ant-alert-message"
+          <div
+            className="ant-alert-content"
           >
-            No file found for tests.js
-          </span>
-          <span
-            className="ant-alert-description"
-          />
+            <div
+              className="ant-alert-message"
+            >
+              No file found for tests.js
+            </div>
+          </div>
         </div>
       </div>
     </div>
@@ -1718,7 +1718,7 @@ Expected variables: {"path":"tests.js"}
         className="ant-typography"
         style={
           Object {
-            "WebkitLineClamp": null,
+            "WebkitLineClamp": undefined,
           }
         }
       >
@@ -1734,7 +1734,6 @@ Expected variables: {"path":"tests.js"}
         >
           <svg
             aria-hidden="true"
-            className=""
             data-icon="vertical-align-bottom"
             fill="currentColor"
             focusable="false"
@@ -1770,7 +1769,7 @@ Expected variables: {"path":"tests.js"}
           onMouseLeave={[Function]}
           style={
             Object {
-              "WebkitLineClamp": null,
+              "WebkitLineClamp": undefined,
               "wordBreak": "break-all",
             }
           }
@@ -1799,7 +1798,7 @@ Expected variables: {"path":"tests.js"}
           onMouseLeave={[Function]}
           style={
             Object {
-              "WebkitLineClamp": null,
+              "WebkitLineClamp": undefined,
               "wordBreak": "break-all",
             }
           }
@@ -1816,6 +1815,7 @@ Expected variables: {"path":"tests.js"}
       >
         <span
           className="ant-divider-inner-text"
+          style={Object {}}
         >
           Traces
         </span>
@@ -1831,7 +1831,7 @@ Expected variables: {"path":"tests.js"}
             Object {
               "cursor": "not-allowed",
               "display": "inline-block",
-              "width": null,
+              "width": undefined,
             }
           }
         >
@@ -1853,7 +1853,6 @@ Expected variables: {"path":"tests.js"}
             >
               <svg
                 aria-hidden="true"
-                className=""
                 data-icon="edit"
                 fill="currentColor"
                 focusable="false"
@@ -1870,6 +1869,7 @@ Expected variables: {"path":"tests.js"}
         </span>
         <button
           className="ant-btn ant-btn-text ant-btn-sm ant-btn-icon-only"
+          disabled={false}
           onClick={[Function]}
           onMouseEnter={[Function]}
           onMouseLeave={[Function]}
@@ -1882,7 +1882,6 @@ Expected variables: {"path":"tests.js"}
           >
             <svg
               aria-hidden="true"
-              className=""
               data-icon="select"
               fill="currentColor"
               focusable="false"