// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`New Upgrade Helm Chart Dock Tab given a namespace is selected when navigating to the helm releases view renders 1`] = `
<body>
  <div>
    <div
      class="Animate slide-right Drawer KubeObjectDetails flex column right enter leave"
      style="--size: 725px; --enter-duration: 100ms; --leave-duration: 100ms;"
    >
      <div
        class="drawer-wrapper flex column"
      >
        <div
          class="drawer-title flex align-center"
        >
          <div
            class="drawer-title-text flex gaps align-center"
          >
            
          </div>
          <i
            class="Icon material interactive focusable"
            tabindex="0"
          >
            <span
              class="icon"
              data-icon-name="close"
            >
              close
            </span>
          </i>
          <div>
            Close
          </div>
        </div>
        <div
          class="drawer-content flex column box grow"
        />
      </div>
      <div
        class="ResizingAnchor horizontal leading"
      />
    </div>
    <div
      class="Notifications flex column align-flex-end"
    />
    <div
      class="mainLayout"
      style="--sidebar-width: 200px;"
    >
      <div
        class="sidebar"
      >
        <div
          class="flex flex-col"
          data-testid="cluster-sidebar"
        >
          <div
            class="SidebarCluster"
          >
            <div
              class="Avatar rounded loadingAvatar"
              style="width: 40px; height: 40px;"
            >
              ??
            </div>
            <div
              class="loadingClusterName"
            />
          </div>
          <div
            class="sidebarNav sidebar-active-status"
          >
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-workloads"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-workloads"
                href="/"
              >
                <i
                  class="Icon svg focusable"
                >
                  <span
                    class="icon"
                  />
                </i>
                <span>
                  Workloads
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-config"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-config"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="list"
                  >
                    list
                  </span>
                </i>
                <span>
                  Config
                </span>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-network"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-network"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="device_hub"
                  >
                    device_hub
                  </span>
                </i>
                <span>
                  Network
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-storage"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-storage"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="storage"
                  >
                    storage
                  </span>
                </i>
                <span>
                  Storage
                </span>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="true"
              data-testid="sidebar-item-helm"
            >
              <a
                aria-current="page"
                class="navItem active"
                data-testid="sidebar-item-link-for-helm"
                href="/"
              >
                <i
                  class="Icon svg focusable"
                >
                  <span
                    class="icon"
                  />
                </i>
                <span>
                  Helm
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-user-management"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-user-management"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="security"
                  >
                    security
                  </span>
                </i>
                <span>
                  Access Control
                </span>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-custom-resources"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-custom-resources"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="extension"
                  >
                    extension
                  </span>
                </i>
                <span>
                  Custom Resources
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
          </div>
        </div>
        <div
          class="ResizingAnchor horizontal trailing"
        />
      </div>
      <div
        class="contents"
      >
        <div
          class="TabLayout"
          data-testid="tab-layout"
        >
          <div
            class="Tabs center scrollable"
          >
            <div
              class="Tab flex gaps align-center"
              data-is-active-test="false"
              data-testid="tab-link-for-charts"
              role="tab"
              tabindex="0"
            >
              <div
                class="label"
              >
                Charts
              </div>
            </div>
            <div
              class="Tab flex gaps align-center active"
              data-is-active-test="true"
              data-testid="tab-link-for-releases"
              role="tab"
              tabindex="0"
            >
              <div
                class="label"
              >
                Releases
              </div>
            </div>
          </div>
          <main
            class=""
          >
            <div
              class="ItemListLayout flex column HelmReleases"
            >
              <div
                class="header flex gaps align-center"
              >
                <h5
                  class="title"
                >
                  Releases
                </h5>
                <div
                  class="info-panel box grow"
                >
                  0 items
                </div>
                <div
                  class="NamespaceSelectFilterParent"
                  data-testid="namespace-select-filter"
                >
                  <div
                    class="Select theme-dark NamespaceSelect NamespaceSelectFilter css-b62m3t-container"
                  >
                    <span
                      class="css-1f43avz-a11yText-A11yText"
                      id="react-select-namespace-select-filter-live-region"
                    />
                    <span
                      aria-atomic="false"
                      aria-live="polite"
                      aria-relevant="additions text"
                      class="css-1f43avz-a11yText-A11yText"
                    />
                    <div
                      class="Select__control css-13cymwt-control"
                    >
                      <div
                        class="Select__value-container Select__value-container--is-multi css-1fdsijx-ValueContainer"
                      >
                        <div
                          class="Select__placeholder css-1jqq78o-placeholder"
                          id="react-select-namespace-select-filter-placeholder"
                        >
                          Namespace: my-second-namespace
                        </div>
                        <div
                          class="Select__input-container css-qbdosj-Input"
                          data-value=""
                        >
                          <input
                            aria-autocomplete="list"
                            aria-describedby="react-select-namespace-select-filter-placeholder"
                            aria-expanded="false"
                            aria-haspopup="true"
                            autocapitalize="none"
                            autocomplete="off"
                            autocorrect="off"
                            class="Select__input"
                            id="namespace-select-filter"
                            role="combobox"
                            spellcheck="false"
                            style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;"
                            tabindex="0"
                            type="text"
                            value=""
                          />
                        </div>
                      </div>
                      <div
                        class="Select__indicators css-1hb7zxy-IndicatorsContainer"
                      >
                        <span
                          class="Select__indicator-separator css-1u9des2-indicatorSeparator"
                        />
                        <div
                          aria-hidden="true"
                          class="Select__indicator Select__dropdown-indicator css-1xc3v61-indicatorContainer"
                        >
                          <svg
                            aria-hidden="true"
                            class="css-tj5bde-Svg"
                            focusable="false"
                            height="20"
                            viewBox="0 0 20 20"
                            width="20"
                          >
                            <path
                              d="M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
                            />
                          </svg>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div
                  class="Input SearchInput focused"
                >
                  <label
                    class="input-area flex gaps align-center"
                    id=""
                  >
                    <input
                      class="input box grow"
                      placeholder="Search Releases..."
                      spellcheck="false"
                      value=""
                    />
                    <i
                      class="Icon material focusable small"
                    >
                      <span
                        class="icon"
                        data-icon-name="search"
                      >
                        search
                      </span>
                    </i>
                  </label>
                  <div
                    class="input-info flex gaps"
                  />
                </div>
              </div>
              <div
                class="items box grow flex column"
              >
                <div
                  class="Table flex column HelmReleases box grow dark selectable scrollable sortable autoSize virtual"
                >
                  <div
                    class="TableHead sticky nowrap topLine"
                  >
                    <div
                      class="TableCell checkbox"
                    >
                      <label
                        class="Checkbox flex align-center"
                      >
                        <input
                          type="checkbox"
                        />
                        <i
                          class="box flex align-center"
                        />
                      </label>
                    </div>
                    <div
                      class="TableCell name nowrap sorting"
                      id="name"
                    >
                      <div
                        class="content"
                      >
                        Name
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell namespace nowrap sorting"
                      id="namespace"
                    >
                      <div
                        class="content"
                      >
                        Namespace
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell chart nowrap sorting"
                      id="chart"
                    >
                      <div
                        class="content"
                      >
                        Chart
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell revision nowrap sorting"
                      id="revision"
                    >
                      <div
                        class="content"
                      >
                        Revision
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell version nowrap"
                      id="version"
                    >
                      <div
                        class="content"
                      >
                        Version
                      </div>
                    </div>
                    <div
                      class="TableCell app-version nowrap"
                      id="app-version"
                    >
                      <div
                        class="content"
                      >
                        App Version
                      </div>
                    </div>
                    <div
                      class="TableCell status nowrap sorting"
                      id="status"
                    >
                      <div
                        class="content"
                      >
                        Status
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell updated nowrap sorting"
                      id="update"
                    >
                      <div
                        class="content"
                      >
                        Updated
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell menu nowrap"
                    >
                      <div
                        class="content"
                      >
                        <i
                          class="Icon material interactive focusable"
                          id="menu-actions-for-item-object-list-content"
                          tabindex="0"
                        >
                          <span
                            class="icon"
                            data-icon-name="more_vert"
                          >
                            more_vert
                          </span>
                        </i>
                      </div>
                    </div>
                  </div>
                  <div
                    class="Spinner singleColor center"
                    data-testid="helm-releases-spinner"
                  />
                </div>
                <div
                  class="AddRemoveButtons flex gaps"
                />
              </div>
            </div>
          </main>
        </div>
      </div>
      <div
        class="footer"
      >
        <div
          class="Dock"
          tabindex="-1"
        >
          <div
            class="ResizingAnchor vertical leading disabled"
          />
          <div
            class="tabs-container flex align-center"
          >
            <div
              class="dockTabs"
              role="tablist"
            >
              <div
                class="Tabs tabs"
              />
            </div>
            <div
              class="toolbar flex gaps align-center box grow pl-0"
            >
              <div
                class="dock-menu box grow"
              >
                <i
                  class="Icon new-dock-tab material interactive focusable"
                  id="menu-actions-for-dock"
                  tabindex="0"
                >
                  <span
                    class="icon"
                    data-icon-name="add"
                  >
                    add
                  </span>
                </i>
                <div>
                  New tab
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</body>
`;

exports[`New Upgrade Helm Chart Dock Tab given a namespace is selected when navigating to the helm releases view when helm releases resolves renders 1`] = `
<body>
  <div>
    <div
      class="Animate slide-right Drawer KubeObjectDetails flex column right enter leave"
      style="--size: 725px; --enter-duration: 100ms; --leave-duration: 100ms;"
    >
      <div
        class="drawer-wrapper flex column"
      >
        <div
          class="drawer-title flex align-center"
        >
          <div
            class="drawer-title-text flex gaps align-center"
          >
            
          </div>
          <i
            class="Icon material interactive focusable"
            tabindex="0"
          >
            <span
              class="icon"
              data-icon-name="close"
            >
              close
            </span>
          </i>
          <div>
            Close
          </div>
        </div>
        <div
          class="drawer-content flex column box grow"
        />
      </div>
      <div
        class="ResizingAnchor horizontal leading"
      />
    </div>
    <div
      class="Notifications flex column align-flex-end"
    />
    <div
      class="mainLayout"
      style="--sidebar-width: 200px;"
    >
      <div
        class="sidebar"
      >
        <div
          class="flex flex-col"
          data-testid="cluster-sidebar"
        >
          <div
            class="SidebarCluster"
          >
            <div
              class="Avatar rounded loadingAvatar"
              style="width: 40px; height: 40px;"
            >
              ??
            </div>
            <div
              class="loadingClusterName"
            />
          </div>
          <div
            class="sidebarNav sidebar-active-status"
          >
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-workloads"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-workloads"
                href="/"
              >
                <i
                  class="Icon svg focusable"
                >
                  <span
                    class="icon"
                  />
                </i>
                <span>
                  Workloads
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-config"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-config"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="list"
                  >
                    list
                  </span>
                </i>
                <span>
                  Config
                </span>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-network"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-network"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="device_hub"
                  >
                    device_hub
                  </span>
                </i>
                <span>
                  Network
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-storage"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-storage"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="storage"
                  >
                    storage
                  </span>
                </i>
                <span>
                  Storage
                </span>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="true"
              data-testid="sidebar-item-helm"
            >
              <a
                aria-current="page"
                class="navItem active"
                data-testid="sidebar-item-link-for-helm"
                href="/"
              >
                <i
                  class="Icon svg focusable"
                >
                  <span
                    class="icon"
                  />
                </i>
                <span>
                  Helm
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-user-management"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-user-management"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="security"
                  >
                    security
                  </span>
                </i>
                <span>
                  Access Control
                </span>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-custom-resources"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-custom-resources"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="extension"
                  >
                    extension
                  </span>
                </i>
                <span>
                  Custom Resources
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
          </div>
        </div>
        <div
          class="ResizingAnchor horizontal trailing"
        />
      </div>
      <div
        class="contents"
      >
        <div
          class="TabLayout"
          data-testid="tab-layout"
        >
          <div
            class="Tabs center scrollable"
          >
            <div
              class="Tab flex gaps align-center"
              data-is-active-test="false"
              data-testid="tab-link-for-charts"
              role="tab"
              tabindex="0"
            >
              <div
                class="label"
              >
                Charts
              </div>
            </div>
            <div
              class="Tab flex gaps align-center active"
              data-is-active-test="true"
              data-testid="tab-link-for-releases"
              role="tab"
              tabindex="0"
            >
              <div
                class="label"
              >
                Releases
              </div>
            </div>
          </div>
          <main
            class=""
          >
            <div
              class="ItemListLayout flex column HelmReleases"
            >
              <div
                class="header flex gaps align-center"
              >
                <h5
                  class="title"
                >
                  Releases
                </h5>
                <div
                  class="info-panel box grow"
                >
                  1 item
                </div>
                <div
                  class="NamespaceSelectFilterParent"
                  data-testid="namespace-select-filter"
                >
                  <div
                    class="Select theme-dark NamespaceSelect NamespaceSelectFilter css-b62m3t-container"
                  >
                    <span
                      class="css-1f43avz-a11yText-A11yText"
                      id="react-select-namespace-select-filter-live-region"
                    />
                    <span
                      aria-atomic="false"
                      aria-live="polite"
                      aria-relevant="additions text"
                      class="css-1f43avz-a11yText-A11yText"
                    />
                    <div
                      class="Select__control css-13cymwt-control"
                    >
                      <div
                        class="Select__value-container Select__value-container--is-multi css-1fdsijx-ValueContainer"
                      >
                        <div
                          class="Select__placeholder css-1jqq78o-placeholder"
                          id="react-select-namespace-select-filter-placeholder"
                        >
                          Namespace: my-second-namespace
                        </div>
                        <div
                          class="Select__input-container css-qbdosj-Input"
                          data-value=""
                        >
                          <input
                            aria-autocomplete="list"
                            aria-describedby="react-select-namespace-select-filter-placeholder"
                            aria-expanded="false"
                            aria-haspopup="true"
                            autocapitalize="none"
                            autocomplete="off"
                            autocorrect="off"
                            class="Select__input"
                            id="namespace-select-filter"
                            role="combobox"
                            spellcheck="false"
                            style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;"
                            tabindex="0"
                            type="text"
                            value=""
                          />
                        </div>
                      </div>
                      <div
                        class="Select__indicators css-1hb7zxy-IndicatorsContainer"
                      >
                        <span
                          class="Select__indicator-separator css-1u9des2-indicatorSeparator"
                        />
                        <div
                          aria-hidden="true"
                          class="Select__indicator Select__dropdown-indicator css-1xc3v61-indicatorContainer"
                        >
                          <svg
                            aria-hidden="true"
                            class="css-tj5bde-Svg"
                            focusable="false"
                            height="20"
                            viewBox="0 0 20 20"
                            width="20"
                          >
                            <path
                              d="M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
                            />
                          </svg>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div
                  class="Input SearchInput focused"
                >
                  <label
                    class="input-area flex gaps align-center"
                    id=""
                  >
                    <input
                      class="input box grow"
                      placeholder="Search Releases..."
                      spellcheck="false"
                      value=""
                    />
                    <i
                      class="Icon material focusable small"
                    >
                      <span
                        class="icon"
                        data-icon-name="search"
                      >
                        search
                      </span>
                    </i>
                  </label>
                  <div
                    class="input-info flex gaps"
                  />
                </div>
              </div>
              <div
                class="items box grow flex column"
              >
                <div
                  class="Table flex column HelmReleases box grow dark selectable scrollable sortable autoSize virtual"
                >
                  <div
                    class="TableHead sticky nowrap topLine"
                  >
                    <div
                      class="TableCell checkbox"
                    >
                      <label
                        class="Checkbox flex align-center"
                      >
                        <input
                          type="checkbox"
                        />
                        <i
                          class="box flex align-center"
                        />
                      </label>
                    </div>
                    <div
                      class="TableCell name nowrap sorting"
                      id="name"
                    >
                      <div
                        class="content"
                      >
                        Name
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell namespace nowrap sorting"
                      id="namespace"
                    >
                      <div
                        class="content"
                      >
                        Namespace
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell chart nowrap sorting"
                      id="chart"
                    >
                      <div
                        class="content"
                      >
                        Chart
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell revision nowrap sorting"
                      id="revision"
                    >
                      <div
                        class="content"
                      >
                        Revision
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell version nowrap"
                      id="version"
                    >
                      <div
                        class="content"
                      >
                        Version
                      </div>
                    </div>
                    <div
                      class="TableCell app-version nowrap"
                      id="app-version"
                    >
                      <div
                        class="content"
                      >
                        App Version
                      </div>
                    </div>
                    <div
                      class="TableCell status nowrap sorting"
                      id="status"
                    >
                      <div
                        class="content"
                      >
                        Status
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell updated nowrap sorting"
                      id="update"
                    >
                      <div
                        class="content"
                      >
                        Updated
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell menu nowrap"
                    >
                      <div
                        class="content"
                      >
                        <i
                          class="Icon material interactive focusable"
                          id="menu-actions-for-item-object-list-content"
                          tabindex="0"
                        >
                          <span
                            class="icon"
                            data-icon-name="more_vert"
                          >
                            more_vert
                          </span>
                        </i>
                      </div>
                    </div>
                  </div>
                  <div
                    class="VirtualList HelmReleases box grow dark"
                  >
                    <div>
                      <div
                        class="list"
                        style="position: relative; height: 420000px; width: 100%; overflow: auto; will-change: transform; direction: ltr;"
                      >
                        <div
                          style="height: 33px; width: 100%;"
                        >
                          <div
                            style="position: absolute; left: 0px; top: 0px; height: 33px; width: 100%;"
                          >
                            <div
                              class="TableRow nowrap"
                              data-testid="helm-release-row-for-my-second-namespace/some-name"
                            >
                              <div
                                class="TableCell checkbox"
                              >
                                <label
                                  class="Checkbox flex align-center"
                                >
                                  <input
                                    type="checkbox"
                                  />
                                  <i
                                    class="box flex align-center"
                                  />
                                </label>
                              </div>
                              <div
                                class="TableCell name"
                              >
                                some-name
                              </div>
                              <div
                                class="TableCell namespace"
                              >
                                <div
                                  class="badge NamespaceSelectBadge flat clickable"
                                >
                                  my-second-namespace
                                </div>
                                <div>
                                  Set global namespace filter to:
                                  <b>
                                    my-second-namespace
                                  </b>
                                </div>
                              </div>
                              <div
                                class="TableCell chart"
                              >
                                some-chart
                              </div>
                              <div
                                class="TableCell revision"
                              >
                                NaN
                              </div>
                              <div
                                class="TableCell version"
                              >
                                1.0.0
                              </div>
                              <div
                                class="TableCell app-version"
                              >
                                some-app-version
                              </div>
                              <div
                                class="TableCell some-status status"
                              >
                                Some-status
                              </div>
                              <div
                                class="TableCell updated"
                              >
                                NaNy
                              </div>
                              <div
                                class="TableCell menu"
                              >
                                <div>
                                  <i
                                    class="Icon material interactive focusable"
                                    data-testid="menu-actions-icon-for-release-menu-for-my-second-namespace/some-name"
                                    id="menu-actions-for-release-menu-for-my-second-namespace/some-name"
                                    tabindex="0"
                                  >
                                    <span
                                      class="icon"
                                      data-icon-name="more_vert"
                                    >
                                      more_vert
                                    </span>
                                  </i>
                                </div>
                              </div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div
                  class="AddRemoveButtons flex gaps"
                />
              </div>
            </div>
          </main>
        </div>
      </div>
      <div
        class="footer"
      >
        <div
          class="Dock"
          tabindex="-1"
        >
          <div
            class="ResizingAnchor vertical leading disabled"
          />
          <div
            class="tabs-container flex align-center"
          >
            <div
              class="dockTabs"
              role="tablist"
            >
              <div
                class="Tabs tabs"
              />
            </div>
            <div
              class="toolbar flex gaps align-center box grow pl-0"
            >
              <div
                class="dock-menu box grow"
              >
                <i
                  class="Icon new-dock-tab material interactive focusable"
                  id="menu-actions-for-dock"
                  tabindex="0"
                >
                  <span
                    class="icon"
                    data-icon-name="add"
                  >
                    add
                  </span>
                </i>
                <div>
                  New tab
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</body>
`;

exports[`New Upgrade Helm Chart Dock Tab given a namespace is selected when navigating to the helm releases view when helm releases resolves when clicking the menu for a helm release renders 1`] = `
<body>
  <div>
    <div
      class="Animate slide-right Drawer KubeObjectDetails flex column right enter leave"
      style="--size: 725px; --enter-duration: 100ms; --leave-duration: 100ms;"
    >
      <div
        class="drawer-wrapper flex column"
      >
        <div
          class="drawer-title flex align-center"
        >
          <div
            class="drawer-title-text flex gaps align-center"
          >
            
          </div>
          <i
            class="Icon material interactive focusable"
            tabindex="0"
          >
            <span
              class="icon"
              data-icon-name="close"
            >
              close
            </span>
          </i>
          <div>
            Close
          </div>
        </div>
        <div
          class="drawer-content flex column box grow"
        />
      </div>
      <div
        class="ResizingAnchor horizontal leading"
      />
    </div>
    <div
      class="Notifications flex column align-flex-end"
    />
    <div
      class="mainLayout"
      style="--sidebar-width: 200px;"
    >
      <div
        class="sidebar"
      >
        <div
          class="flex flex-col"
          data-testid="cluster-sidebar"
        >
          <div
            class="SidebarCluster"
          >
            <div
              class="Avatar rounded loadingAvatar"
              style="width: 40px; height: 40px;"
            >
              ??
            </div>
            <div
              class="loadingClusterName"
            />
          </div>
          <div
            class="sidebarNav sidebar-active-status"
          >
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-workloads"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-workloads"
                href="/"
              >
                <i
                  class="Icon svg focusable"
                >
                  <span
                    class="icon"
                  />
                </i>
                <span>
                  Workloads
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-config"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-config"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="list"
                  >
                    list
                  </span>
                </i>
                <span>
                  Config
                </span>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-network"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-network"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="device_hub"
                  >
                    device_hub
                  </span>
                </i>
                <span>
                  Network
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-storage"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-storage"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="storage"
                  >
                    storage
                  </span>
                </i>
                <span>
                  Storage
                </span>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="true"
              data-testid="sidebar-item-helm"
            >
              <a
                aria-current="page"
                class="navItem active"
                data-testid="sidebar-item-link-for-helm"
                href="/"
              >
                <i
                  class="Icon svg focusable"
                >
                  <span
                    class="icon"
                  />
                </i>
                <span>
                  Helm
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-user-management"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-user-management"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="security"
                  >
                    security
                  </span>
                </i>
                <span>
                  Access Control
                </span>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-custom-resources"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-custom-resources"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="extension"
                  >
                    extension
                  </span>
                </i>
                <span>
                  Custom Resources
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
          </div>
        </div>
        <div
          class="ResizingAnchor horizontal trailing"
        />
      </div>
      <div
        class="contents"
      >
        <div
          class="TabLayout"
          data-testid="tab-layout"
        >
          <div
            class="Tabs center scrollable"
          >
            <div
              class="Tab flex gaps align-center"
              data-is-active-test="false"
              data-testid="tab-link-for-charts"
              role="tab"
              tabindex="0"
            >
              <div
                class="label"
              >
                Charts
              </div>
            </div>
            <div
              class="Tab flex gaps align-center active"
              data-is-active-test="true"
              data-testid="tab-link-for-releases"
              role="tab"
              tabindex="0"
            >
              <div
                class="label"
              >
                Releases
              </div>
            </div>
          </div>
          <main
            class=""
          >
            <div
              class="ItemListLayout flex column HelmReleases"
            >
              <div
                class="header flex gaps align-center"
              >
                <h5
                  class="title"
                >
                  Releases
                </h5>
                <div
                  class="info-panel box grow"
                >
                  1 item
                </div>
                <div
                  class="NamespaceSelectFilterParent"
                  data-testid="namespace-select-filter"
                >
                  <div
                    class="Select theme-dark NamespaceSelect NamespaceSelectFilter css-b62m3t-container"
                  >
                    <span
                      class="css-1f43avz-a11yText-A11yText"
                      id="react-select-namespace-select-filter-live-region"
                    />
                    <span
                      aria-atomic="false"
                      aria-live="polite"
                      aria-relevant="additions text"
                      class="css-1f43avz-a11yText-A11yText"
                    />
                    <div
                      class="Select__control css-13cymwt-control"
                    >
                      <div
                        class="Select__value-container Select__value-container--is-multi css-1fdsijx-ValueContainer"
                      >
                        <div
                          class="Select__placeholder css-1jqq78o-placeholder"
                          id="react-select-namespace-select-filter-placeholder"
                        >
                          Namespace: my-second-namespace
                        </div>
                        <div
                          class="Select__input-container css-qbdosj-Input"
                          data-value=""
                        >
                          <input
                            aria-autocomplete="list"
                            aria-describedby="react-select-namespace-select-filter-placeholder"
                            aria-expanded="false"
                            aria-haspopup="true"
                            autocapitalize="none"
                            autocomplete="off"
                            autocorrect="off"
                            class="Select__input"
                            id="namespace-select-filter"
                            role="combobox"
                            spellcheck="false"
                            style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;"
                            tabindex="0"
                            type="text"
                            value=""
                          />
                        </div>
                      </div>
                      <div
                        class="Select__indicators css-1hb7zxy-IndicatorsContainer"
                      >
                        <span
                          class="Select__indicator-separator css-1u9des2-indicatorSeparator"
                        />
                        <div
                          aria-hidden="true"
                          class="Select__indicator Select__dropdown-indicator css-1xc3v61-indicatorContainer"
                        >
                          <svg
                            aria-hidden="true"
                            class="css-tj5bde-Svg"
                            focusable="false"
                            height="20"
                            viewBox="0 0 20 20"
                            width="20"
                          >
                            <path
                              d="M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
                            />
                          </svg>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div
                  class="Input SearchInput focused"
                >
                  <label
                    class="input-area flex gaps align-center"
                    id=""
                  >
                    <input
                      class="input box grow"
                      placeholder="Search Releases..."
                      spellcheck="false"
                      value=""
                    />
                    <i
                      class="Icon material focusable small"
                    >
                      <span
                        class="icon"
                        data-icon-name="search"
                      >
                        search
                      </span>
                    </i>
                  </label>
                  <div
                    class="input-info flex gaps"
                  />
                </div>
              </div>
              <div
                class="items box grow flex column"
              >
                <div
                  class="Table flex column HelmReleases box grow dark selectable scrollable sortable autoSize virtual"
                >
                  <div
                    class="TableHead sticky nowrap topLine"
                  >
                    <div
                      class="TableCell checkbox"
                    >
                      <label
                        class="Checkbox flex align-center"
                      >
                        <input
                          type="checkbox"
                        />
                        <i
                          class="box flex align-center"
                        />
                      </label>
                    </div>
                    <div
                      class="TableCell name nowrap sorting"
                      id="name"
                    >
                      <div
                        class="content"
                      >
                        Name
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell namespace nowrap sorting"
                      id="namespace"
                    >
                      <div
                        class="content"
                      >
                        Namespace
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell chart nowrap sorting"
                      id="chart"
                    >
                      <div
                        class="content"
                      >
                        Chart
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell revision nowrap sorting"
                      id="revision"
                    >
                      <div
                        class="content"
                      >
                        Revision
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell version nowrap"
                      id="version"
                    >
                      <div
                        class="content"
                      >
                        Version
                      </div>
                    </div>
                    <div
                      class="TableCell app-version nowrap"
                      id="app-version"
                    >
                      <div
                        class="content"
                      >
                        App Version
                      </div>
                    </div>
                    <div
                      class="TableCell status nowrap sorting"
                      id="status"
                    >
                      <div
                        class="content"
                      >
                        Status
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell updated nowrap sorting"
                      id="update"
                    >
                      <div
                        class="content"
                      >
                        Updated
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell menu nowrap"
                    >
                      <div
                        class="content"
                      >
                        <i
                          class="Icon material interactive focusable"
                          id="menu-actions-for-item-object-list-content"
                          tabindex="0"
                        >
                          <span
                            class="icon"
                            data-icon-name="more_vert"
                          >
                            more_vert
                          </span>
                        </i>
                      </div>
                    </div>
                  </div>
                  <div
                    class="VirtualList HelmReleases box grow dark"
                  >
                    <div>
                      <div
                        class="list"
                        style="position: relative; height: 420000px; width: 100%; overflow: auto; will-change: transform; direction: ltr;"
                      >
                        <div
                          style="height: 33px; width: 100%;"
                        >
                          <div
                            style="position: absolute; left: 0px; top: 0px; height: 33px; width: 100%;"
                          >
                            <div
                              class="TableRow nowrap"
                              data-testid="helm-release-row-for-my-second-namespace/some-name"
                            >
                              <div
                                class="TableCell checkbox"
                              >
                                <label
                                  class="Checkbox flex align-center"
                                >
                                  <input
                                    type="checkbox"
                                  />
                                  <i
                                    class="box flex align-center"
                                  />
                                </label>
                              </div>
                              <div
                                class="TableCell name"
                              >
                                some-name
                              </div>
                              <div
                                class="TableCell namespace"
                              >
                                <div
                                  class="badge NamespaceSelectBadge flat clickable"
                                >
                                  my-second-namespace
                                </div>
                                <div>
                                  Set global namespace filter to:
                                  <b>
                                    my-second-namespace
                                  </b>
                                </div>
                              </div>
                              <div
                                class="TableCell chart"
                              >
                                some-chart
                              </div>
                              <div
                                class="TableCell revision"
                              >
                                NaN
                              </div>
                              <div
                                class="TableCell version"
                              >
                                1.0.0
                              </div>
                              <div
                                class="TableCell app-version"
                              >
                                some-app-version
                              </div>
                              <div
                                class="TableCell some-status status"
                              >
                                Some-status
                              </div>
                              <div
                                class="TableCell updated"
                              >
                                NaNy
                              </div>
                              <div
                                class="TableCell menu"
                              >
                                <div>
                                  <i
                                    class="Icon material interactive active focusable"
                                    data-testid="menu-actions-icon-for-release-menu-for-my-second-namespace/some-name"
                                    id="menu-actions-for-release-menu-for-my-second-namespace/some-name"
                                    tabindex="0"
                                  >
                                    <span
                                      class="icon"
                                      data-icon-name="more_vert"
                                    >
                                      more_vert
                                    </span>
                                  </i>
                                </div>
                              </div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div
                  class="AddRemoveButtons flex gaps"
                />
              </div>
            </div>
          </main>
        </div>
      </div>
      <div
        class="footer"
      >
        <div
          class="Dock"
          tabindex="-1"
        >
          <div
            class="ResizingAnchor vertical leading disabled"
          />
          <div
            class="tabs-container flex align-center"
          >
            <div
              class="dockTabs"
              role="tablist"
            >
              <div
                class="Tabs tabs"
              />
            </div>
            <div
              class="toolbar flex gaps align-center box grow pl-0"
            >
              <div
                class="dock-menu box grow"
              >
                <i
                  class="Icon new-dock-tab material interactive focusable"
                  id="menu-actions-for-dock"
                  tabindex="0"
                >
                  <span
                    class="icon"
                    data-icon-name="add"
                  >
                    add
                  </span>
                </i>
                <div>
                  New tab
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <ul
    class="Animate opacity Menu MenuActions flex HelmReleaseMenu right bottom portal enter"
    id="menu-actions-for-release-menu-for-my-second-namespace/some-name"
    style="--enter-duration: 100ms; --leave-duration: 100ms;"
  >
    <li
      class="MenuItem"
      data-testid="upgrade-chart-menu-item-for-my-second-namespace/some-name"
      tabindex="0"
    >
      <i
        class="Icon material focusable"
      >
        <span
          class="icon"
          data-icon-name="refresh"
        >
          refresh
        </span>
      </i>
      <div>
        Upgrade
      </div>
      <span
        class="title"
      >
        Upgrade
      </span>
    </li>
    <li
      class="MenuItem"
      data-testid="menu-action-remove"
      tabindex="0"
    >
      <i
        class="Icon material focusable"
      >
        <span
          class="icon"
          data-icon-name="delete"
        >
          delete
        </span>
      </i>
      <div>
        Delete
      </div>
      <span
        class="title"
      >
        Delete
      </span>
    </li>
  </ul>
</body>
`;

exports[`New Upgrade Helm Chart Dock Tab given a namespace is selected when navigating to the helm releases view when helm releases resolves when clicking the menu for a helm release when clicking the upgrade chart menu item renders 1`] = `
<body>
  <div>
    <div
      class="Notifications flex column align-flex-end"
    />
    <div
      class="mainLayout"
      style="--sidebar-width: 200px;"
    >
      <div
        class="sidebar"
      >
        <div
          class="flex flex-col"
          data-testid="cluster-sidebar"
        >
          <div
            class="SidebarCluster"
          >
            <div
              class="Avatar rounded loadingAvatar"
              style="width: 40px; height: 40px;"
            >
              ??
            </div>
            <div
              class="loadingClusterName"
            />
          </div>
          <div
            class="sidebarNav sidebar-active-status"
          >
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-workloads"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-workloads"
                href="/"
              >
                <i
                  class="Icon svg focusable"
                >
                  <span
                    class="icon"
                  />
                </i>
                <span>
                  Workloads
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-config"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-config"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="list"
                  >
                    list
                  </span>
                </i>
                <span>
                  Config
                </span>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-network"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-network"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="device_hub"
                  >
                    device_hub
                  </span>
                </i>
                <span>
                  Network
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-storage"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-storage"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="storage"
                  >
                    storage
                  </span>
                </i>
                <span>
                  Storage
                </span>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="true"
              data-testid="sidebar-item-helm"
            >
              <a
                aria-current="page"
                class="navItem active"
                data-testid="sidebar-item-link-for-helm"
                href="/"
              >
                <i
                  class="Icon svg focusable"
                >
                  <span
                    class="icon"
                  />
                </i>
                <span>
                  Helm
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-user-management"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-user-management"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="security"
                  >
                    security
                  </span>
                </i>
                <span>
                  Access Control
                </span>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-custom-resources"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-custom-resources"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="extension"
                  >
                    extension
                  </span>
                </i>
                <span>
                  Custom Resources
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
          </div>
        </div>
        <div
          class="ResizingAnchor horizontal trailing"
        />
      </div>
      <div
        class="contents"
      >
        <div
          class="TabLayout"
          data-testid="tab-layout"
        >
          <div
            class="Tabs center scrollable"
          >
            <div
              class="Tab flex gaps align-center"
              data-is-active-test="false"
              data-testid="tab-link-for-charts"
              role="tab"
              tabindex="0"
            >
              <div
                class="label"
              >
                Charts
              </div>
            </div>
            <div
              class="Tab flex gaps align-center active"
              data-is-active-test="true"
              data-testid="tab-link-for-releases"
              role="tab"
              tabindex="0"
            >
              <div
                class="label"
              >
                Releases
              </div>
            </div>
          </div>
          <main
            class=""
          >
            <div
              class="ItemListLayout flex column HelmReleases"
            >
              <div
                class="header flex gaps align-center"
              >
                <h5
                  class="title"
                >
                  Releases
                </h5>
                <div
                  class="info-panel box grow"
                >
                  1 item
                </div>
                <div
                  class="NamespaceSelectFilterParent"
                  data-testid="namespace-select-filter"
                >
                  <div
                    class="Select theme-dark NamespaceSelect NamespaceSelectFilter css-b62m3t-container"
                  >
                    <span
                      class="css-1f43avz-a11yText-A11yText"
                      id="react-select-namespace-select-filter-live-region"
                    />
                    <span
                      aria-atomic="false"
                      aria-live="polite"
                      aria-relevant="additions text"
                      class="css-1f43avz-a11yText-A11yText"
                    />
                    <div
                      class="Select__control css-13cymwt-control"
                    >
                      <div
                        class="Select__value-container Select__value-container--is-multi css-1fdsijx-ValueContainer"
                      >
                        <div
                          class="Select__placeholder css-1jqq78o-placeholder"
                          id="react-select-namespace-select-filter-placeholder"
                        >
                          Namespace: my-second-namespace
                        </div>
                        <div
                          class="Select__input-container css-qbdosj-Input"
                          data-value=""
                        >
                          <input
                            aria-autocomplete="list"
                            aria-describedby="react-select-namespace-select-filter-placeholder"
                            aria-expanded="false"
                            aria-haspopup="true"
                            autocapitalize="none"
                            autocomplete="off"
                            autocorrect="off"
                            class="Select__input"
                            id="namespace-select-filter"
                            role="combobox"
                            spellcheck="false"
                            style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;"
                            tabindex="0"
                            type="text"
                            value=""
                          />
                        </div>
                      </div>
                      <div
                        class="Select__indicators css-1hb7zxy-IndicatorsContainer"
                      >
                        <span
                          class="Select__indicator-separator css-1u9des2-indicatorSeparator"
                        />
                        <div
                          aria-hidden="true"
                          class="Select__indicator Select__dropdown-indicator css-1xc3v61-indicatorContainer"
                        >
                          <svg
                            aria-hidden="true"
                            class="css-tj5bde-Svg"
                            focusable="false"
                            height="20"
                            viewBox="0 0 20 20"
                            width="20"
                          >
                            <path
                              d="M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
                            />
                          </svg>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div
                  class="Input SearchInput"
                >
                  <label
                    class="input-area flex gaps align-center"
                    id=""
                  >
                    <input
                      class="input box grow"
                      placeholder="Search Releases..."
                      spellcheck="false"
                      value=""
                    />
                    <i
                      class="Icon material focusable small"
                    >
                      <span
                        class="icon"
                        data-icon-name="search"
                      >
                        search
                      </span>
                    </i>
                  </label>
                  <div
                    class="input-info flex gaps"
                  />
                </div>
              </div>
              <div
                class="items box grow flex column"
              >
                <div
                  class="Table flex column HelmReleases box grow dark selectable scrollable sortable autoSize virtual"
                >
                  <div
                    class="TableHead sticky nowrap topLine"
                  >
                    <div
                      class="TableCell checkbox"
                    >
                      <label
                        class="Checkbox flex align-center"
                      >
                        <input
                          type="checkbox"
                        />
                        <i
                          class="box flex align-center"
                        />
                      </label>
                    </div>
                    <div
                      class="TableCell name nowrap sorting"
                      id="name"
                    >
                      <div
                        class="content"
                      >
                        Name
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell namespace nowrap sorting"
                      id="namespace"
                    >
                      <div
                        class="content"
                      >
                        Namespace
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell chart nowrap sorting"
                      id="chart"
                    >
                      <div
                        class="content"
                      >
                        Chart
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell revision nowrap sorting"
                      id="revision"
                    >
                      <div
                        class="content"
                      >
                        Revision
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell version nowrap"
                      id="version"
                    >
                      <div
                        class="content"
                      >
                        Version
                      </div>
                    </div>
                    <div
                      class="TableCell app-version nowrap"
                      id="app-version"
                    >
                      <div
                        class="content"
                      >
                        App Version
                      </div>
                    </div>
                    <div
                      class="TableCell status nowrap sorting"
                      id="status"
                    >
                      <div
                        class="content"
                      >
                        Status
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell updated nowrap sorting"
                      id="update"
                    >
                      <div
                        class="content"
                      >
                        Updated
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell menu nowrap"
                    >
                      <div
                        class="content"
                      >
                        <i
                          class="Icon material interactive focusable"
                          id="menu-actions-for-item-object-list-content"
                          tabindex="0"
                        >
                          <span
                            class="icon"
                            data-icon-name="more_vert"
                          >
                            more_vert
                          </span>
                        </i>
                      </div>
                    </div>
                  </div>
                  <div
                    class="VirtualList HelmReleases box grow dark"
                  >
                    <div>
                      <div
                        class="list"
                        style="position: relative; height: 420000px; width: 100%; overflow: auto; will-change: transform; direction: ltr;"
                      >
                        <div
                          style="height: 33px; width: 100%;"
                        >
                          <div
                            style="position: absolute; left: 0px; top: 0px; height: 33px; width: 100%;"
                          >
                            <div
                              class="TableRow nowrap"
                              data-testid="helm-release-row-for-my-second-namespace/some-name"
                            >
                              <div
                                class="TableCell checkbox"
                              >
                                <label
                                  class="Checkbox flex align-center"
                                >
                                  <input
                                    type="checkbox"
                                  />
                                  <i
                                    class="box flex align-center"
                                  />
                                </label>
                              </div>
                              <div
                                class="TableCell name"
                              >
                                some-name
                              </div>
                              <div
                                class="TableCell namespace"
                              >
                                <div
                                  class="badge NamespaceSelectBadge flat clickable"
                                >
                                  my-second-namespace
                                </div>
                                <div>
                                  Set global namespace filter to:
                                  <b>
                                    my-second-namespace
                                  </b>
                                </div>
                              </div>
                              <div
                                class="TableCell chart"
                              >
                                some-chart
                              </div>
                              <div
                                class="TableCell revision"
                              >
                                NaN
                              </div>
                              <div
                                class="TableCell version"
                              >
                                1.0.0
                              </div>
                              <div
                                class="TableCell app-version"
                              >
                                some-app-version
                              </div>
                              <div
                                class="TableCell some-status status"
                              >
                                Some-status
                              </div>
                              <div
                                class="TableCell updated"
                              >
                                NaNy
                              </div>
                              <div
                                class="TableCell menu"
                              >
                                <div>
                                  <i
                                    class="Icon material interactive focusable"
                                    data-testid="menu-actions-icon-for-release-menu-for-my-second-namespace/some-name"
                                    id="menu-actions-for-release-menu-for-my-second-namespace/some-name"
                                    tabindex="0"
                                  >
                                    <span
                                      class="icon"
                                      data-icon-name="more_vert"
                                    >
                                      more_vert
                                    </span>
                                  </i>
                                </div>
                              </div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div
                  class="AddRemoveButtons flex gaps"
                />
              </div>
            </div>
          </main>
        </div>
      </div>
      <div
        class="footer"
      >
        <div
          class="Dock isOpen"
          tabindex="-1"
        >
          <div
            class="ResizingAnchor vertical leading"
          />
          <div
            class="tabs-container flex align-center"
          >
            <div
              class="dockTabs"
              role="tablist"
            >
              <div
                class="Tabs tabs"
              >
                <div
                  class="Tab flex gaps align-center DockTab active"
                  data-testid="dock-tab-for-some-irrelevant-random-id"
                  id="tab-some-irrelevant-random-id"
                  role="tab"
                  tabindex="0"
                >
                  <i
                    class="Icon material focusable small"
                  >
                    <span
                      class="icon"
                      data-icon-name="install_desktop"
                    >
                      install_desktop
                    </span>
                  </i>
                  <div
                    class="label"
                  >
                    <div
                      class="flex align-center"
                    >
                      <span
                        class="title"
                      >
                        Helm Upgrade: some-name
                      </span>
                      <div
                        class="close"
                      >
                        <i
                          class="Icon material interactive focusable small"
                          data-testid="dock-tab-close-for-some-irrelevant-random-id"
                          tabindex="0"
                        >
                          <span
                            class="icon"
                            data-icon-name="close"
                          >
                            close
                          </span>
                        </i>
                        <div
                          data-testid="tooltip-content-for-dock-tab-close-for-some-irrelevant-random-id"
                        >
                          Close ⌘+W
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div
              class="toolbar flex gaps align-center box grow"
            >
              <div
                class="dock-menu box grow"
              >
                <i
                  class="Icon new-dock-tab material interactive focusable"
                  id="menu-actions-for-dock"
                  tabindex="0"
                >
                  <span
                    class="icon"
                    data-icon-name="add"
                  >
                    add
                  </span>
                </i>
                <div>
                  New tab
                </div>
              </div>
              <i
                class="Icon material interactive focusable"
                tabindex="0"
              >
                <span
                  class="icon"
                  data-icon-name="fullscreen"
                >
                  fullscreen
                </span>
              </i>
              <div>
                Fit to window
              </div>
              <i
                class="Icon material interactive focusable"
                tabindex="0"
              >
                <span
                  class="icon"
                  data-icon-name="keyboard_arrow_down"
                >
                  keyboard_arrow_down
                </span>
              </i>
              <div>
                Minimize
              </div>
            </div>
          </div>
          <div
            class="tab-content upgrade-chart"
            data-testid="dock-tab-content-for-some-irrelevant-random-id"
            style="flex-basis: 300px;"
          >
            <div
              class="Spinner singleColor center"
            />
          </div>
        </div>
      </div>
    </div>
  </div>
</body>
`;

exports[`New Upgrade Helm Chart Dock Tab given a namespace is selected when navigating to the helm releases view when helm releases resolves when clicking the menu for a helm release when clicking the upgrade chart menu item when request for all helm charts resolves when the requests of versions of the helm charts resolves renders 1`] = `
<body>
  <div>
    <div
      class="Notifications flex column align-flex-end"
    />
    <div
      class="mainLayout"
      style="--sidebar-width: 200px;"
    >
      <div
        class="sidebar"
      >
        <div
          class="flex flex-col"
          data-testid="cluster-sidebar"
        >
          <div
            class="SidebarCluster"
          >
            <div
              class="Avatar rounded loadingAvatar"
              style="width: 40px; height: 40px;"
            >
              ??
            </div>
            <div
              class="loadingClusterName"
            />
          </div>
          <div
            class="sidebarNav sidebar-active-status"
          >
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-workloads"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-workloads"
                href="/"
              >
                <i
                  class="Icon svg focusable"
                >
                  <span
                    class="icon"
                  />
                </i>
                <span>
                  Workloads
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-config"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-config"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="list"
                  >
                    list
                  </span>
                </i>
                <span>
                  Config
                </span>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-network"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-network"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="device_hub"
                  >
                    device_hub
                  </span>
                </i>
                <span>
                  Network
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-storage"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-storage"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="storage"
                  >
                    storage
                  </span>
                </i>
                <span>
                  Storage
                </span>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="true"
              data-testid="sidebar-item-helm"
            >
              <a
                aria-current="page"
                class="navItem active"
                data-testid="sidebar-item-link-for-helm"
                href="/"
              >
                <i
                  class="Icon svg focusable"
                >
                  <span
                    class="icon"
                  />
                </i>
                <span>
                  Helm
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-user-management"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-user-management"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="security"
                  >
                    security
                  </span>
                </i>
                <span>
                  Access Control
                </span>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-custom-resources"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-custom-resources"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="extension"
                  >
                    extension
                  </span>
                </i>
                <span>
                  Custom Resources
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
          </div>
        </div>
        <div
          class="ResizingAnchor horizontal trailing"
        />
      </div>
      <div
        class="contents"
      >
        <div
          class="TabLayout"
          data-testid="tab-layout"
        >
          <div
            class="Tabs center scrollable"
          >
            <div
              class="Tab flex gaps align-center"
              data-is-active-test="false"
              data-testid="tab-link-for-charts"
              role="tab"
              tabindex="0"
            >
              <div
                class="label"
              >
                Charts
              </div>
            </div>
            <div
              class="Tab flex gaps align-center active"
              data-is-active-test="true"
              data-testid="tab-link-for-releases"
              role="tab"
              tabindex="0"
            >
              <div
                class="label"
              >
                Releases
              </div>
            </div>
          </div>
          <main
            class=""
          >
            <div
              class="ItemListLayout flex column HelmReleases"
            >
              <div
                class="header flex gaps align-center"
              >
                <h5
                  class="title"
                >
                  Releases
                </h5>
                <div
                  class="info-panel box grow"
                >
                  1 item
                </div>
                <div
                  class="NamespaceSelectFilterParent"
                  data-testid="namespace-select-filter"
                >
                  <div
                    class="Select theme-dark NamespaceSelect NamespaceSelectFilter css-b62m3t-container"
                  >
                    <span
                      class="css-1f43avz-a11yText-A11yText"
                      id="react-select-namespace-select-filter-live-region"
                    />
                    <span
                      aria-atomic="false"
                      aria-live="polite"
                      aria-relevant="additions text"
                      class="css-1f43avz-a11yText-A11yText"
                    />
                    <div
                      class="Select__control css-13cymwt-control"
                    >
                      <div
                        class="Select__value-container Select__value-container--is-multi css-1fdsijx-ValueContainer"
                      >
                        <div
                          class="Select__placeholder css-1jqq78o-placeholder"
                          id="react-select-namespace-select-filter-placeholder"
                        >
                          Namespace: my-second-namespace
                        </div>
                        <div
                          class="Select__input-container css-qbdosj-Input"
                          data-value=""
                        >
                          <input
                            aria-autocomplete="list"
                            aria-describedby="react-select-namespace-select-filter-placeholder"
                            aria-expanded="false"
                            aria-haspopup="true"
                            autocapitalize="none"
                            autocomplete="off"
                            autocorrect="off"
                            class="Select__input"
                            id="namespace-select-filter"
                            role="combobox"
                            spellcheck="false"
                            style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;"
                            tabindex="0"
                            type="text"
                            value=""
                          />
                        </div>
                      </div>
                      <div
                        class="Select__indicators css-1hb7zxy-IndicatorsContainer"
                      >
                        <span
                          class="Select__indicator-separator css-1u9des2-indicatorSeparator"
                        />
                        <div
                          aria-hidden="true"
                          class="Select__indicator Select__dropdown-indicator css-1xc3v61-indicatorContainer"
                        >
                          <svg
                            aria-hidden="true"
                            class="css-tj5bde-Svg"
                            focusable="false"
                            height="20"
                            viewBox="0 0 20 20"
                            width="20"
                          >
                            <path
                              d="M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
                            />
                          </svg>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div
                  class="Input SearchInput"
                >
                  <label
                    class="input-area flex gaps align-center"
                    id=""
                  >
                    <input
                      class="input box grow"
                      placeholder="Search Releases..."
                      spellcheck="false"
                      value=""
                    />
                    <i
                      class="Icon material focusable small"
                    >
                      <span
                        class="icon"
                        data-icon-name="search"
                      >
                        search
                      </span>
                    </i>
                  </label>
                  <div
                    class="input-info flex gaps"
                  />
                </div>
              </div>
              <div
                class="items box grow flex column"
              >
                <div
                  class="Table flex column HelmReleases box grow dark selectable scrollable sortable autoSize virtual"
                >
                  <div
                    class="TableHead sticky nowrap topLine"
                  >
                    <div
                      class="TableCell checkbox"
                    >
                      <label
                        class="Checkbox flex align-center"
                      >
                        <input
                          type="checkbox"
                        />
                        <i
                          class="box flex align-center"
                        />
                      </label>
                    </div>
                    <div
                      class="TableCell name nowrap sorting"
                      id="name"
                    >
                      <div
                        class="content"
                      >
                        Name
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell namespace nowrap sorting"
                      id="namespace"
                    >
                      <div
                        class="content"
                      >
                        Namespace
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell chart nowrap sorting"
                      id="chart"
                    >
                      <div
                        class="content"
                      >
                        Chart
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell revision nowrap sorting"
                      id="revision"
                    >
                      <div
                        class="content"
                      >
                        Revision
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell version nowrap"
                      id="version"
                    >
                      <div
                        class="content"
                      >
                        Version
                      </div>
                    </div>
                    <div
                      class="TableCell app-version nowrap"
                      id="app-version"
                    >
                      <div
                        class="content"
                      >
                        App Version
                      </div>
                    </div>
                    <div
                      class="TableCell status nowrap sorting"
                      id="status"
                    >
                      <div
                        class="content"
                      >
                        Status
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell updated nowrap sorting"
                      id="update"
                    >
                      <div
                        class="content"
                      >
                        Updated
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell menu nowrap"
                    >
                      <div
                        class="content"
                      >
                        <i
                          class="Icon material interactive focusable"
                          id="menu-actions-for-item-object-list-content"
                          tabindex="0"
                        >
                          <span
                            class="icon"
                            data-icon-name="more_vert"
                          >
                            more_vert
                          </span>
                        </i>
                      </div>
                    </div>
                  </div>
                  <div
                    class="VirtualList HelmReleases box grow dark"
                  >
                    <div>
                      <div
                        class="list"
                        style="position: relative; height: 420000px; width: 100%; overflow: auto; will-change: transform; direction: ltr;"
                      >
                        <div
                          style="height: 33px; width: 100%;"
                        >
                          <div
                            style="position: absolute; left: 0px; top: 0px; height: 33px; width: 100%;"
                          >
                            <div
                              class="TableRow nowrap"
                              data-testid="helm-release-row-for-my-second-namespace/some-name"
                            >
                              <div
                                class="TableCell checkbox"
                              >
                                <label
                                  class="Checkbox flex align-center"
                                >
                                  <input
                                    type="checkbox"
                                  />
                                  <i
                                    class="box flex align-center"
                                  />
                                </label>
                              </div>
                              <div
                                class="TableCell name"
                              >
                                some-name
                              </div>
                              <div
                                class="TableCell namespace"
                              >
                                <div
                                  class="badge NamespaceSelectBadge flat clickable"
                                >
                                  my-second-namespace
                                </div>
                                <div>
                                  Set global namespace filter to:
                                  <b>
                                    my-second-namespace
                                  </b>
                                </div>
                              </div>
                              <div
                                class="TableCell chart"
                              >
                                some-chart
                              </div>
                              <div
                                class="TableCell revision"
                              >
                                NaN
                              </div>
                              <div
                                class="TableCell version"
                              >
                                1.0.0
                              </div>
                              <div
                                class="TableCell app-version"
                              >
                                some-app-version
                              </div>
                              <div
                                class="TableCell some-status status"
                              >
                                Some-status
                              </div>
                              <div
                                class="TableCell updated"
                              >
                                NaNy
                              </div>
                              <div
                                class="TableCell menu"
                              >
                                <div>
                                  <i
                                    class="Icon material interactive focusable"
                                    data-testid="menu-actions-icon-for-release-menu-for-my-second-namespace/some-name"
                                    id="menu-actions-for-release-menu-for-my-second-namespace/some-name"
                                    tabindex="0"
                                  >
                                    <span
                                      class="icon"
                                      data-icon-name="more_vert"
                                    >
                                      more_vert
                                    </span>
                                  </i>
                                </div>
                              </div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div
                  class="AddRemoveButtons flex gaps"
                />
              </div>
            </div>
          </main>
        </div>
      </div>
      <div
        class="footer"
      >
        <div
          class="Dock isOpen"
          tabindex="-1"
        >
          <div
            class="ResizingAnchor vertical leading"
          />
          <div
            class="tabs-container flex align-center"
          >
            <div
              class="dockTabs"
              role="tablist"
            >
              <div
                class="Tabs tabs"
              >
                <div
                  class="Tab flex gaps align-center DockTab active"
                  data-testid="dock-tab-for-some-irrelevant-random-id"
                  id="tab-some-irrelevant-random-id"
                  role="tab"
                  tabindex="0"
                >
                  <i
                    class="Icon material focusable small"
                  >
                    <span
                      class="icon"
                      data-icon-name="install_desktop"
                    >
                      install_desktop
                    </span>
                  </i>
                  <div
                    class="label"
                  >
                    <div
                      class="flex align-center"
                    >
                      <span
                        class="title"
                      >
                        Helm Upgrade: some-name
                      </span>
                      <div
                        class="close"
                      >
                        <i
                          class="Icon material interactive focusable small"
                          data-testid="dock-tab-close-for-some-irrelevant-random-id"
                          tabindex="0"
                        >
                          <span
                            class="icon"
                            data-icon-name="close"
                          >
                            close
                          </span>
                        </i>
                        <div
                          data-testid="tooltip-content-for-dock-tab-close-for-some-irrelevant-random-id"
                        >
                          Close ⌘+W
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div
              class="toolbar flex gaps align-center box grow"
            >
              <div
                class="dock-menu box grow"
              >
                <i
                  class="Icon new-dock-tab material interactive focusable"
                  id="menu-actions-for-dock"
                  tabindex="0"
                >
                  <span
                    class="icon"
                    data-icon-name="add"
                  >
                    add
                  </span>
                </i>
                <div>
                  New tab
                </div>
              </div>
              <i
                class="Icon material interactive focusable"
                tabindex="0"
              >
                <span
                  class="icon"
                  data-icon-name="fullscreen"
                >
                  fullscreen
                </span>
              </i>
              <div>
                Fit to window
              </div>
              <i
                class="Icon material interactive focusable"
                tabindex="0"
              >
                <span
                  class="icon"
                  data-icon-name="keyboard_arrow_down"
                >
                  keyboard_arrow_down
                </span>
              </i>
              <div>
                Minimize
              </div>
            </div>
          </div>
          <div
            class="tab-content upgrade-chart"
            data-testid="dock-tab-content-for-some-irrelevant-random-id"
            style="flex-basis: 300px;"
          >
            <div
              class="UpgradeChart flex column"
              data-testid="upgrade-chart-dock-tab-contents-for-my-second-namespace/some-name"
            >
              <div
                class="InfoPanel flex gaps align-center"
              >
                <div
                  class="controls"
                >
                  <div
                    class="upgrade flex gaps align-center"
                  >
                    <span>
                      Release
                    </span>
                     
                    <div
                      class="badge"
                    >
                      some-name
                    </div>
                    <span>
                      Namespace
                    </span>
                     
                    <div
                      class="badge"
                    >
                      my-second-namespace
                    </div>
                    <span>
                      Version
                    </span>
                     
                    <div
                      class="badge"
                    >
                      1.0.0
                    </div>
                    <span>
                      Upgrade version
                    </span>
                    <div
                      class="Select theme-dark chart-version css-b62m3t-container"
                    >
                      <span
                        class="css-1f43avz-a11yText-A11yText"
                        id="react-select-char-version-input-live-region"
                      />
                      <span
                        aria-atomic="false"
                        aria-live="polite"
                        aria-relevant="additions text"
                        class="css-1f43avz-a11yText-A11yText"
                      />
                      <div
                        class="Select__control css-13cymwt-control"
                      >
                        <div
                          class="Select__value-container Select__value-container--has-value css-1fdsijx-ValueContainer"
                        >
                          <div
                            class="Select__single-value css-1dimb5e-singleValue"
                          >
                            some-repo/some-chart-1.0.1
                          </div>
                          <div
                            class="Select__input-container css-qbdosj-Input"
                            data-value=""
                          >
                            <input
                              aria-autocomplete="list"
                              aria-expanded="false"
                              aria-haspopup="true"
                              autocapitalize="none"
                              autocomplete="off"
                              autocorrect="off"
                              class="Select__input"
                              id="char-version-input"
                              role="combobox"
                              spellcheck="false"
                              style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;"
                              tabindex="0"
                              type="text"
                              value=""
                            />
                          </div>
                        </div>
                        <div
                          class="Select__indicators css-1hb7zxy-IndicatorsContainer"
                        >
                          <span
                            class="Select__indicator-separator css-1u9des2-indicatorSeparator"
                          />
                          <div
                            aria-hidden="true"
                            class="Select__indicator Select__dropdown-indicator css-1xc3v61-indicatorContainer"
                          >
                            <svg
                              aria-hidden="true"
                              class="css-tj5bde-Svg"
                              focusable="false"
                              height="20"
                              viewBox="0 0 20 20"
                              width="20"
                            >
                              <path
                                d="M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
                              />
                            </svg>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div
                  class="flex gaps align-center"
                />
                <button
                  class="Button plain"
                  type="button"
                >
                  Cancel
                </button>
                <button
                  class="Button active outlined"
                  type="button"
                >
                  Upgrade
                </button>
                <button
                  class="Button primary active"
                  type="button"
                >
                  Upgrade & Close
                </button>
              </div>
              <textarea
                data-testid="monaco-editor-for-some-irrelevant-random-id"
              />
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</body>
`;

exports[`New Upgrade Helm Chart Dock Tab given a namespace is selected when navigating to the helm releases view when helm releases resolves when clicking the menu for a helm release when clicking the upgrade chart menu item when request for all helm charts resolves when the requests of versions of the helm charts resolves when the configuration request resolves renders 1`] = `
<body>
  <div>
    <div
      class="Notifications flex column align-flex-end"
    />
    <div
      class="mainLayout"
      style="--sidebar-width: 200px;"
    >
      <div
        class="sidebar"
      >
        <div
          class="flex flex-col"
          data-testid="cluster-sidebar"
        >
          <div
            class="SidebarCluster"
          >
            <div
              class="Avatar rounded loadingAvatar"
              style="width: 40px; height: 40px;"
            >
              ??
            </div>
            <div
              class="loadingClusterName"
            />
          </div>
          <div
            class="sidebarNav sidebar-active-status"
          >
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-workloads"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-workloads"
                href="/"
              >
                <i
                  class="Icon svg focusable"
                >
                  <span
                    class="icon"
                  />
                </i>
                <span>
                  Workloads
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-config"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-config"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="list"
                  >
                    list
                  </span>
                </i>
                <span>
                  Config
                </span>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-network"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-network"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="device_hub"
                  >
                    device_hub
                  </span>
                </i>
                <span>
                  Network
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-storage"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-storage"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="storage"
                  >
                    storage
                  </span>
                </i>
                <span>
                  Storage
                </span>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="true"
              data-testid="sidebar-item-helm"
            >
              <a
                aria-current="page"
                class="navItem active"
                data-testid="sidebar-item-link-for-helm"
                href="/"
              >
                <i
                  class="Icon svg focusable"
                >
                  <span
                    class="icon"
                  />
                </i>
                <span>
                  Helm
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-user-management"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-user-management"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="security"
                  >
                    security
                  </span>
                </i>
                <span>
                  Access Control
                </span>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-custom-resources"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-custom-resources"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="extension"
                  >
                    extension
                  </span>
                </i>
                <span>
                  Custom Resources
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
          </div>
        </div>
        <div
          class="ResizingAnchor horizontal trailing"
        />
      </div>
      <div
        class="contents"
      >
        <div
          class="TabLayout"
          data-testid="tab-layout"
        >
          <div
            class="Tabs center scrollable"
          >
            <div
              class="Tab flex gaps align-center"
              data-is-active-test="false"
              data-testid="tab-link-for-charts"
              role="tab"
              tabindex="0"
            >
              <div
                class="label"
              >
                Charts
              </div>
            </div>
            <div
              class="Tab flex gaps align-center active"
              data-is-active-test="true"
              data-testid="tab-link-for-releases"
              role="tab"
              tabindex="0"
            >
              <div
                class="label"
              >
                Releases
              </div>
            </div>
          </div>
          <main
            class=""
          >
            <div
              class="ItemListLayout flex column HelmReleases"
            >
              <div
                class="header flex gaps align-center"
              >
                <h5
                  class="title"
                >
                  Releases
                </h5>
                <div
                  class="info-panel box grow"
                >
                  1 item
                </div>
                <div
                  class="NamespaceSelectFilterParent"
                  data-testid="namespace-select-filter"
                >
                  <div
                    class="Select theme-dark NamespaceSelect NamespaceSelectFilter css-b62m3t-container"
                  >
                    <span
                      class="css-1f43avz-a11yText-A11yText"
                      id="react-select-namespace-select-filter-live-region"
                    />
                    <span
                      aria-atomic="false"
                      aria-live="polite"
                      aria-relevant="additions text"
                      class="css-1f43avz-a11yText-A11yText"
                    />
                    <div
                      class="Select__control css-13cymwt-control"
                    >
                      <div
                        class="Select__value-container Select__value-container--is-multi css-1fdsijx-ValueContainer"
                      >
                        <div
                          class="Select__placeholder css-1jqq78o-placeholder"
                          id="react-select-namespace-select-filter-placeholder"
                        >
                          Namespace: my-second-namespace
                        </div>
                        <div
                          class="Select__input-container css-qbdosj-Input"
                          data-value=""
                        >
                          <input
                            aria-autocomplete="list"
                            aria-describedby="react-select-namespace-select-filter-placeholder"
                            aria-expanded="false"
                            aria-haspopup="true"
                            autocapitalize="none"
                            autocomplete="off"
                            autocorrect="off"
                            class="Select__input"
                            id="namespace-select-filter"
                            role="combobox"
                            spellcheck="false"
                            style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;"
                            tabindex="0"
                            type="text"
                            value=""
                          />
                        </div>
                      </div>
                      <div
                        class="Select__indicators css-1hb7zxy-IndicatorsContainer"
                      >
                        <span
                          class="Select__indicator-separator css-1u9des2-indicatorSeparator"
                        />
                        <div
                          aria-hidden="true"
                          class="Select__indicator Select__dropdown-indicator css-1xc3v61-indicatorContainer"
                        >
                          <svg
                            aria-hidden="true"
                            class="css-tj5bde-Svg"
                            focusable="false"
                            height="20"
                            viewBox="0 0 20 20"
                            width="20"
                          >
                            <path
                              d="M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
                            />
                          </svg>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div
                  class="Input SearchInput"
                >
                  <label
                    class="input-area flex gaps align-center"
                    id=""
                  >
                    <input
                      class="input box grow"
                      placeholder="Search Releases..."
                      spellcheck="false"
                      value=""
                    />
                    <i
                      class="Icon material focusable small"
                    >
                      <span
                        class="icon"
                        data-icon-name="search"
                      >
                        search
                      </span>
                    </i>
                  </label>
                  <div
                    class="input-info flex gaps"
                  />
                </div>
              </div>
              <div
                class="items box grow flex column"
              >
                <div
                  class="Table flex column HelmReleases box grow dark selectable scrollable sortable autoSize virtual"
                >
                  <div
                    class="TableHead sticky nowrap topLine"
                  >
                    <div
                      class="TableCell checkbox"
                    >
                      <label
                        class="Checkbox flex align-center"
                      >
                        <input
                          type="checkbox"
                        />
                        <i
                          class="box flex align-center"
                        />
                      </label>
                    </div>
                    <div
                      class="TableCell name nowrap sorting"
                      id="name"
                    >
                      <div
                        class="content"
                      >
                        Name
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell namespace nowrap sorting"
                      id="namespace"
                    >
                      <div
                        class="content"
                      >
                        Namespace
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell chart nowrap sorting"
                      id="chart"
                    >
                      <div
                        class="content"
                      >
                        Chart
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell revision nowrap sorting"
                      id="revision"
                    >
                      <div
                        class="content"
                      >
                        Revision
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell version nowrap"
                      id="version"
                    >
                      <div
                        class="content"
                      >
                        Version
                      </div>
                    </div>
                    <div
                      class="TableCell app-version nowrap"
                      id="app-version"
                    >
                      <div
                        class="content"
                      >
                        App Version
                      </div>
                    </div>
                    <div
                      class="TableCell status nowrap sorting"
                      id="status"
                    >
                      <div
                        class="content"
                      >
                        Status
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell updated nowrap sorting"
                      id="update"
                    >
                      <div
                        class="content"
                      >
                        Updated
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell menu nowrap"
                    >
                      <div
                        class="content"
                      >
                        <i
                          class="Icon material interactive focusable"
                          id="menu-actions-for-item-object-list-content"
                          tabindex="0"
                        >
                          <span
                            class="icon"
                            data-icon-name="more_vert"
                          >
                            more_vert
                          </span>
                        </i>
                      </div>
                    </div>
                  </div>
                  <div
                    class="VirtualList HelmReleases box grow dark"
                  >
                    <div>
                      <div
                        class="list"
                        style="position: relative; height: 420000px; width: 100%; overflow: auto; will-change: transform; direction: ltr;"
                      >
                        <div
                          style="height: 33px; width: 100%;"
                        >
                          <div
                            style="position: absolute; left: 0px; top: 0px; height: 33px; width: 100%;"
                          >
                            <div
                              class="TableRow nowrap"
                              data-testid="helm-release-row-for-my-second-namespace/some-name"
                            >
                              <div
                                class="TableCell checkbox"
                              >
                                <label
                                  class="Checkbox flex align-center"
                                >
                                  <input
                                    type="checkbox"
                                  />
                                  <i
                                    class="box flex align-center"
                                  />
                                </label>
                              </div>
                              <div
                                class="TableCell name"
                              >
                                some-name
                              </div>
                              <div
                                class="TableCell namespace"
                              >
                                <div
                                  class="badge NamespaceSelectBadge flat clickable"
                                >
                                  my-second-namespace
                                </div>
                                <div>
                                  Set global namespace filter to:
                                  <b>
                                    my-second-namespace
                                  </b>
                                </div>
                              </div>
                              <div
                                class="TableCell chart"
                              >
                                some-chart
                              </div>
                              <div
                                class="TableCell revision"
                              >
                                NaN
                              </div>
                              <div
                                class="TableCell version"
                              >
                                1.0.0
                              </div>
                              <div
                                class="TableCell app-version"
                              >
                                some-app-version
                              </div>
                              <div
                                class="TableCell some-status status"
                              >
                                Some-status
                              </div>
                              <div
                                class="TableCell updated"
                              >
                                NaNy
                              </div>
                              <div
                                class="TableCell menu"
                              >
                                <div>
                                  <i
                                    class="Icon material interactive focusable"
                                    data-testid="menu-actions-icon-for-release-menu-for-my-second-namespace/some-name"
                                    id="menu-actions-for-release-menu-for-my-second-namespace/some-name"
                                    tabindex="0"
                                  >
                                    <span
                                      class="icon"
                                      data-icon-name="more_vert"
                                    >
                                      more_vert
                                    </span>
                                  </i>
                                </div>
                              </div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div
                  class="AddRemoveButtons flex gaps"
                />
              </div>
            </div>
          </main>
        </div>
      </div>
      <div
        class="footer"
      >
        <div
          class="Dock isOpen"
          tabindex="-1"
        >
          <div
            class="ResizingAnchor vertical leading"
          />
          <div
            class="tabs-container flex align-center"
          >
            <div
              class="dockTabs"
              role="tablist"
            >
              <div
                class="Tabs tabs"
              >
                <div
                  class="Tab flex gaps align-center DockTab active"
                  data-testid="dock-tab-for-some-irrelevant-random-id"
                  id="tab-some-irrelevant-random-id"
                  role="tab"
                  tabindex="0"
                >
                  <i
                    class="Icon material focusable small"
                  >
                    <span
                      class="icon"
                      data-icon-name="install_desktop"
                    >
                      install_desktop
                    </span>
                  </i>
                  <div
                    class="label"
                  >
                    <div
                      class="flex align-center"
                    >
                      <span
                        class="title"
                      >
                        Helm Upgrade: some-name
                      </span>
                      <div
                        class="close"
                      >
                        <i
                          class="Icon material interactive focusable small"
                          data-testid="dock-tab-close-for-some-irrelevant-random-id"
                          tabindex="0"
                        >
                          <span
                            class="icon"
                            data-icon-name="close"
                          >
                            close
                          </span>
                        </i>
                        <div
                          data-testid="tooltip-content-for-dock-tab-close-for-some-irrelevant-random-id"
                        >
                          Close ⌘+W
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div
              class="toolbar flex gaps align-center box grow"
            >
              <div
                class="dock-menu box grow"
              >
                <i
                  class="Icon new-dock-tab material interactive focusable"
                  id="menu-actions-for-dock"
                  tabindex="0"
                >
                  <span
                    class="icon"
                    data-icon-name="add"
                  >
                    add
                  </span>
                </i>
                <div>
                  New tab
                </div>
              </div>
              <i
                class="Icon material interactive focusable"
                tabindex="0"
              >
                <span
                  class="icon"
                  data-icon-name="fullscreen"
                >
                  fullscreen
                </span>
              </i>
              <div>
                Fit to window
              </div>
              <i
                class="Icon material interactive focusable"
                tabindex="0"
              >
                <span
                  class="icon"
                  data-icon-name="keyboard_arrow_down"
                >
                  keyboard_arrow_down
                </span>
              </i>
              <div>
                Minimize
              </div>
            </div>
          </div>
          <div
            class="tab-content upgrade-chart"
            data-testid="dock-tab-content-for-some-irrelevant-random-id"
            style="flex-basis: 300px;"
          >
            <div
              class="UpgradeChart flex column"
              data-testid="upgrade-chart-dock-tab-contents-for-my-second-namespace/some-name"
            >
              <div
                class="InfoPanel flex gaps align-center"
              >
                <div
                  class="controls"
                >
                  <div
                    class="upgrade flex gaps align-center"
                  >
                    <span>
                      Release
                    </span>
                     
                    <div
                      class="badge"
                    >
                      some-name
                    </div>
                    <span>
                      Namespace
                    </span>
                     
                    <div
                      class="badge"
                    >
                      my-second-namespace
                    </div>
                    <span>
                      Version
                    </span>
                     
                    <div
                      class="badge"
                    >
                      1.0.0
                    </div>
                    <span>
                      Upgrade version
                    </span>
                    <div
                      class="Select theme-dark chart-version css-b62m3t-container"
                    >
                      <span
                        class="css-1f43avz-a11yText-A11yText"
                        id="react-select-char-version-input-live-region"
                      />
                      <span
                        aria-atomic="false"
                        aria-live="polite"
                        aria-relevant="additions text"
                        class="css-1f43avz-a11yText-A11yText"
                      />
                      <div
                        class="Select__control css-13cymwt-control"
                      >
                        <div
                          class="Select__value-container Select__value-container--has-value css-1fdsijx-ValueContainer"
                        >
                          <div
                            class="Select__single-value css-1dimb5e-singleValue"
                          >
                            some-repo/some-chart-1.0.1
                          </div>
                          <div
                            class="Select__input-container css-qbdosj-Input"
                            data-value=""
                          >
                            <input
                              aria-autocomplete="list"
                              aria-expanded="false"
                              aria-haspopup="true"
                              autocapitalize="none"
                              autocomplete="off"
                              autocorrect="off"
                              class="Select__input"
                              id="char-version-input"
                              role="combobox"
                              spellcheck="false"
                              style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;"
                              tabindex="0"
                              type="text"
                              value=""
                            />
                          </div>
                        </div>
                        <div
                          class="Select__indicators css-1hb7zxy-IndicatorsContainer"
                        >
                          <span
                            class="Select__indicator-separator css-1u9des2-indicatorSeparator"
                          />
                          <div
                            aria-hidden="true"
                            class="Select__indicator Select__dropdown-indicator css-1xc3v61-indicatorContainer"
                          >
                            <svg
                              aria-hidden="true"
                              class="css-tj5bde-Svg"
                              focusable="false"
                              height="20"
                              viewBox="0 0 20 20"
                              width="20"
                            >
                              <path
                                d="M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
                              />
                            </svg>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div
                  class="flex gaps align-center"
                />
                <button
                  class="Button plain"
                  type="button"
                >
                  Cancel
                </button>
                <button
                  class="Button active outlined"
                  type="button"
                >
                  Upgrade
                </button>
                <button
                  class="Button primary active"
                  type="button"
                >
                  Upgrade & Close
                </button>
              </div>
              <textarea
                data-testid="monaco-editor-for-some-irrelevant-random-id"
              >
                some confiration for the helm release
              </textarea>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</body>
`;

exports[`New Upgrade Helm Chart Dock Tab given a namespace is selected when navigating to the helm releases view when helm releases resolves when clicking the menu for a helm release when clicking the upgrade chart menu item when request for all helm charts resolves when the requests of versions of the helm charts resolves when the configuration request resolves when closing the upgrade chart tab renders 1`] = `
<body>
  <div>
    <div
      class="Notifications flex column align-flex-end"
    />
    <div
      class="mainLayout"
      style="--sidebar-width: 200px;"
    >
      <div
        class="sidebar"
      >
        <div
          class="flex flex-col"
          data-testid="cluster-sidebar"
        >
          <div
            class="SidebarCluster"
          >
            <div
              class="Avatar rounded loadingAvatar"
              style="width: 40px; height: 40px;"
            >
              ??
            </div>
            <div
              class="loadingClusterName"
            />
          </div>
          <div
            class="sidebarNav sidebar-active-status"
          >
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-workloads"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-workloads"
                href="/"
              >
                <i
                  class="Icon svg focusable"
                >
                  <span
                    class="icon"
                  />
                </i>
                <span>
                  Workloads
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-config"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-config"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="list"
                  >
                    list
                  </span>
                </i>
                <span>
                  Config
                </span>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-network"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-network"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="device_hub"
                  >
                    device_hub
                  </span>
                </i>
                <span>
                  Network
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-storage"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-storage"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="storage"
                  >
                    storage
                  </span>
                </i>
                <span>
                  Storage
                </span>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="true"
              data-testid="sidebar-item-helm"
            >
              <a
                aria-current="page"
                class="navItem active"
                data-testid="sidebar-item-link-for-helm"
                href="/"
              >
                <i
                  class="Icon svg focusable"
                >
                  <span
                    class="icon"
                  />
                </i>
                <span>
                  Helm
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-user-management"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-user-management"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="security"
                  >
                    security
                  </span>
                </i>
                <span>
                  Access Control
                </span>
              </a>
            </div>
            <div
              class="SidebarItem"
              data-is-active-test="false"
              data-testid="sidebar-item-custom-resources"
            >
              <a
                class="navItem"
                data-testid="sidebar-item-link-for-custom-resources"
                href="/"
              >
                <i
                  class="Icon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="extension"
                  >
                    extension
                  </span>
                </i>
                <span>
                  Custom Resources
                </span>
                <i
                  class="Icon expandIcon material focusable"
                >
                  <span
                    class="icon"
                    data-icon-name="keyboard_arrow_down"
                  >
                    keyboard_arrow_down
                  </span>
                </i>
              </a>
            </div>
          </div>
        </div>
        <div
          class="ResizingAnchor horizontal trailing"
        />
      </div>
      <div
        class="contents"
      >
        <div
          class="TabLayout"
          data-testid="tab-layout"
        >
          <div
            class="Tabs center scrollable"
          >
            <div
              class="Tab flex gaps align-center"
              data-is-active-test="false"
              data-testid="tab-link-for-charts"
              role="tab"
              tabindex="0"
            >
              <div
                class="label"
              >
                Charts
              </div>
            </div>
            <div
              class="Tab flex gaps align-center active"
              data-is-active-test="true"
              data-testid="tab-link-for-releases"
              role="tab"
              tabindex="0"
            >
              <div
                class="label"
              >
                Releases
              </div>
            </div>
          </div>
          <main
            class=""
          >
            <div
              class="ItemListLayout flex column HelmReleases"
            >
              <div
                class="header flex gaps align-center"
              >
                <h5
                  class="title"
                >
                  Releases
                </h5>
                <div
                  class="info-panel box grow"
                >
                  1 item
                </div>
                <div
                  class="NamespaceSelectFilterParent"
                  data-testid="namespace-select-filter"
                >
                  <div
                    class="Select theme-dark NamespaceSelect NamespaceSelectFilter css-b62m3t-container"
                  >
                    <span
                      class="css-1f43avz-a11yText-A11yText"
                      id="react-select-namespace-select-filter-live-region"
                    />
                    <span
                      aria-atomic="false"
                      aria-live="polite"
                      aria-relevant="additions text"
                      class="css-1f43avz-a11yText-A11yText"
                    />
                    <div
                      class="Select__control css-13cymwt-control"
                    >
                      <div
                        class="Select__value-container Select__value-container--is-multi css-1fdsijx-ValueContainer"
                      >
                        <div
                          class="Select__placeholder css-1jqq78o-placeholder"
                          id="react-select-namespace-select-filter-placeholder"
                        >
                          Namespace: my-second-namespace
                        </div>
                        <div
                          class="Select__input-container css-qbdosj-Input"
                          data-value=""
                        >
                          <input
                            aria-autocomplete="list"
                            aria-describedby="react-select-namespace-select-filter-placeholder"
                            aria-expanded="false"
                            aria-haspopup="true"
                            autocapitalize="none"
                            autocomplete="off"
                            autocorrect="off"
                            class="Select__input"
                            id="namespace-select-filter"
                            role="combobox"
                            spellcheck="false"
                            style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;"
                            tabindex="0"
                            type="text"
                            value=""
                          />
                        </div>
                      </div>
                      <div
                        class="Select__indicators css-1hb7zxy-IndicatorsContainer"
                      >
                        <span
                          class="Select__indicator-separator css-1u9des2-indicatorSeparator"
                        />
                        <div
                          aria-hidden="true"
                          class="Select__indicator Select__dropdown-indicator css-1xc3v61-indicatorContainer"
                        >
                          <svg
                            aria-hidden="true"
                            class="css-tj5bde-Svg"
                            focusable="false"
                            height="20"
                            viewBox="0 0 20 20"
                            width="20"
                          >
                            <path
                              d="M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
                            />
                          </svg>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div
                  class="Input SearchInput"
                >
                  <label
                    class="input-area flex gaps align-center"
                    id=""
                  >
                    <input
                      class="input box grow"
                      placeholder="Search Releases..."
                      spellcheck="false"
                      value=""
                    />
                    <i
                      class="Icon material focusable small"
                    >
                      <span
                        class="icon"
                        data-icon-name="search"
                      >
                        search
                      </span>
                    </i>
                  </label>
                  <div
                    class="input-info flex gaps"
                  />
                </div>
              </div>
              <div
                class="items box grow flex column"
              >
                <div
                  class="Table flex column HelmReleases box grow dark selectable scrollable sortable autoSize virtual"
                >
                  <div
                    class="TableHead sticky nowrap topLine"
                  >
                    <div
                      class="TableCell checkbox"
                    >
                      <label
                        class="Checkbox flex align-center"
                      >
                        <input
                          type="checkbox"
                        />
                        <i
                          class="box flex align-center"
                        />
                      </label>
                    </div>
                    <div
                      class="TableCell name nowrap sorting"
                      id="name"
                    >
                      <div
                        class="content"
                      >
                        Name
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell namespace nowrap sorting"
                      id="namespace"
                    >
                      <div
                        class="content"
                      >
                        Namespace
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell chart nowrap sorting"
                      id="chart"
                    >
                      <div
                        class="content"
                      >
                        Chart
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell revision nowrap sorting"
                      id="revision"
                    >
                      <div
                        class="content"
                      >
                        Revision
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell version nowrap"
                      id="version"
                    >
                      <div
                        class="content"
                      >
                        Version
                      </div>
                    </div>
                    <div
                      class="TableCell app-version nowrap"
                      id="app-version"
                    >
                      <div
                        class="content"
                      >
                        App Version
                      </div>
                    </div>
                    <div
                      class="TableCell status nowrap sorting"
                      id="status"
                    >
                      <div
                        class="content"
                      >
                        Status
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell updated nowrap sorting"
                      id="update"
                    >
                      <div
                        class="content"
                      >
                        Updated
                      </div>
                      <i
                        class="Icon sortIcon material focusable"
                      >
                        <span
                          class="icon"
                          data-icon-name="arrow_drop_down"
                        >
                          arrow_drop_down
                        </span>
                      </i>
                    </div>
                    <div
                      class="TableCell menu nowrap"
                    >
                      <div
                        class="content"
                      >
                        <i
                          class="Icon material interactive focusable"
                          id="menu-actions-for-item-object-list-content"
                          tabindex="0"
                        >
                          <span
                            class="icon"
                            data-icon-name="more_vert"
                          >
                            more_vert
                          </span>
                        </i>
                      </div>
                    </div>
                  </div>
                  <div
                    class="VirtualList HelmReleases box grow dark"
                  >
                    <div>
                      <div
                        class="list"
                        style="position: relative; height: 420000px; width: 100%; overflow: auto; will-change: transform; direction: ltr;"
                      >
                        <div
                          style="height: 33px; width: 100%;"
                        >
                          <div
                            style="position: absolute; left: 0px; top: 0px; height: 33px; width: 100%;"
                          >
                            <div
                              class="TableRow nowrap"
                              data-testid="helm-release-row-for-my-second-namespace/some-name"
                            >
                              <div
                                class="TableCell checkbox"
                              >
                                <label
                                  class="Checkbox flex align-center"
                                >
                                  <input
                                    type="checkbox"
                                  />
                                  <i
                                    class="box flex align-center"
                                  />
                                </label>
                              </div>
                              <div
                                class="TableCell name"
                              >
                                some-name
                              </div>
                              <div
                                class="TableCell namespace"
                              >
                                <div
                                  class="badge NamespaceSelectBadge flat clickable"
                                >
                                  my-second-namespace
                                </div>
                                <div>
                                  Set global namespace filter to:
                                  <b>
                                    my-second-namespace
                                  </b>
                                </div>
                              </div>
                              <div
                                class="TableCell chart"
                              >
                                some-chart
                              </div>
                              <div
                                class="TableCell revision"
                              >
                                NaN
                              </div>
                              <div
                                class="TableCell version"
                              >
                                1.0.0
                              </div>
                              <div
                                class="TableCell app-version"
                              >
                                some-app-version
                              </div>
                              <div
                                class="TableCell some-status status"
                              >
                                Some-status
                              </div>
                              <div
                                class="TableCell updated"
                              >
                                NaNy
                              </div>
                              <div
                                class="TableCell menu"
                              >
                                <div>
                                  <i
                                    class="Icon material interactive focusable"
                                    data-testid="menu-actions-icon-for-release-menu-for-my-second-namespace/some-name"
                                    id="menu-actions-for-release-menu-for-my-second-namespace/some-name"
                                    tabindex="0"
                                  >
                                    <span
                                      class="icon"
                                      data-icon-name="more_vert"
                                    >
                                      more_vert
                                    </span>
                                  </i>
                                </div>
                              </div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div
                  class="AddRemoveButtons flex gaps"
                />
              </div>
            </div>
          </main>
        </div>
      </div>
      <div
        class="footer"
      >
        <div
          class="Dock"
          tabindex="-1"
        >
          <div
            class="ResizingAnchor vertical leading disabled"
          />
          <div
            class="tabs-container flex align-center"
          >
            <div
              class="dockTabs"
              role="tablist"
            >
              <div
                class="Tabs tabs"
              />
            </div>
            <div
              class="toolbar flex gaps align-center box grow pl-0"
            >
              <div
                class="dock-menu box grow"
              >
                <i
                  class="Icon new-dock-tab material interactive focusable"
                  id="menu-actions-for-dock"
                  tabindex="0"
                >
                  <span
                    class="icon"
                    data-icon-name="add"
                  >
                    add
                  </span>
                </i>
                <div>
                  New tab
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</body>
`;
