hendrik/lens
1
0 Fork 0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
Code Issues Projects Releases Wiki Activity

Split root and cluster frames in smaller pieces (#5737)

Browse Source 
* Make root frame child components comply with open closed principle and include it in the behavioural unit tests

Signed-off-by: Janne Savolainen <janne.savolainen@live.fi>

* Make cluster frame child components comply with open closed principle and include it in behavioural unit tests

Signed-off-by: Janne Savolainen <janne.savolainen@live.fi>

* Remove duplication

Signed-off-by: Janne Savolainen <janne.savolainen@live.fi>

* Simplify test

Signed-off-by: Janne Savolainen <janne.savolainen@live.fi>

* Make a component more determistic in unit tests

Signed-off-by: Janne Savolainen <janne.savolainen@live.fi>

* Mock uninterested, non-deterministic third party library in unit tests

Co-authored-by: Mikko Aspiala <mikko.aspiala@gmail.com>

Signed-off-by: Janne Savolainen <janne.savolainen@live.fi>

* Optimize registration of injectables in unit tests to make tests faster

Signed-off-by: Janne Savolainen <janne.savolainen@live.fi>

* Update snapshots

Signed-off-by: Janne Savolainen <janne.savolainen@live.fi>

* Remove import time side-effect causing memory leak

Signed-off-by: Janne Savolainen <janne.savolainen@live.fi>
This commit is contained in:
Janne SavolainenandMikko Aspiala authored and GitHub committed 2022-07-04 09:38:29 -07:00
1 parent 1a9fa699c9
commit 14d5a1c3cc
66 files changed
+48472 -35711
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/behaviours/__snapshots__/extension-special-characters-in-page-registrations.test.tsx.snap
+299 -112
View File
@@ -3,71 +3,206 @@
exports[`extension special characters in page registrations renders 1`] = `
<div>
<div
class="topBar"
class="ClusterManager"
>
<div
class="items"
>
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
<span
class="icon"
data-icon-name="home"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<span
class="icon"
data-icon-name="arrow_back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="items"
/>
</div>
<div
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
class="topBar"
>
<div
class="item"
class="items"
>
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
<span
class="icon"
data-icon-name="home"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<span
class="icon"
data-icon-name="arrow_back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="items"
/>
</div>
<main>
<div
id="lens-views"
/>
<div
class="flex justify-center Welcome align-center"
data-testid="welcome-page"
>
<div
data-testid="app-update-not-available"
data-testid="welcome-banner-container"
style="width: 320px;"
>
No new updates available
<i
class="Icon logo svg focusable"
>
<span
class="icon"
/>
</i>
<div
class="flex justify-center"
>
<div
data-testid="welcome-text-container"
style="width: 320px;"
>
<h2>
Welcome to OpenLens 5!
</h2>
<p>
To get you started we have auto-detected your clusters in your
kubeconfig file and added them to the catalog, your centralized
view for managing all your cloud-native resources.
<br />
<br />
If you have any questions or feedback, please join our
<a
class="link"
href="https://join.slack.com/t/k8slens/shared_invite/zt-wcl8jq3k-68R5Wcmk1o95MLBE5igUDQ"
rel="noreferrer"
target="_blank"
>
Lens Community slack channel
</a>
.
</p>
<ul
class="block"
data-testid="welcome-menu-container"
style="width: 320px;"
>
<li
class="flex grid-12"
>
<i
class="Icon box col-1 material focusable"
>
<span
class="icon"
data-icon-name="view_list"
>
view_list
</span>
</i>
<a
class="box col-10"
>
Browse Clusters in Catalog
</a>
<i
class="Icon box col-1 material focusable"
>
<span
class="icon"
data-icon-name="navigate_next"
>
navigate_next
</span>
</i>
</li>
</ul>
</div>
</div>
</div>
</div>
</main>
<div
class="HotbarMenu flex column"
>
<div
class="HotbarItems flex column gaps"
/>
<div
class="HotbarSelector"
>
<i
class="Icon Icon previous material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_left"
>
arrow_left
</span>
</i>
<div
class="HotbarIndex"
>
<div
class="badge Badge small clickable"
id="hotbarIndex"
>
0
</div>
</div>
<i
class="Icon material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_right"
>
arrow_right
</span>
</i>
</div>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
/>
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
>
<div
class="item"
>
<div
data-testid="app-update-not-available"
>
No new updates available
</div>
</div>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
/>
</div>
</div>
<div
class="Notifications flex column align-flex-end"
@@ -78,74 +213,126 @@ exports[`extension special characters in page registrations renders 1`] = `
exports[`extension special characters in page registrations when navigating to route with ID having special characters renders 1`] = `
<div>
<div
class="topBar"
class="ClusterManager"
>
<div
class="items"
>
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
<span
class="icon"
data-icon-name="home"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<span
class="icon"
data-icon-name="arrow_back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="items"
/>
</div>
<div
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
class="topBar"
>
<div
class="item"
class="items"
>
<div
data-testid="app-update-not-available"
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
No new updates available
<span
class="icon"
data-icon-name="home"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<span
class="icon"
data-icon-name="arrow_back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="items"
/>
</div>
<main>
<div
id="lens-views"
/>
<div>
Some page
</div>
</main>
<div
class="HotbarMenu flex column"
>
<div
class="HotbarItems flex column gaps"
/>
<div
class="HotbarSelector"
>
<i
class="Icon Icon previous material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_left"
>
arrow_left
</span>
</i>
<div
class="HotbarIndex"
>
<div
class="badge Badge small clickable"
id="hotbarIndex"
>
0
</div>
</div>
<i
class="Icon material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_right"
>
arrow_right
</span>
</i>
</div>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
/>
</div>
<div>
Some page
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
>
<div
class="item"
>
<div
data-testid="app-update-not-available"
>
No new updates available
</div>
</div>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
/>
</div>
</div>
<div
class="Notifications flex column align-flex-end"
src/behaviours/__snapshots__/navigate-to-extension-page.test.tsx.snap
+674 -331
View File
File diff suppressed because it is too large. Load diff
src/behaviours/__snapshots__/navigating-between-routes.test.tsx.snap
+223 -119
View File
@@ -3,78 +3,130 @@
exports[`navigating between routes given route with optional path parameters when navigating to route with path parameters renders 1`] = `
<div>
<div
class="topBar"
class="ClusterManager"
>
<div
class="items"
>
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
<span
class="icon"
data-icon-name="home"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<span
class="icon"
data-icon-name="arrow_back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="items"
/>
</div>
<div
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
class="topBar"
>
<div
class="item"
class="items"
>
<div
data-testid="app-update-not-available"
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
No new updates available
</div>
<span
class="icon"
data-icon-name="home"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<span
class="icon"
data-icon-name="arrow_back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="items"
/>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
/>
</div>
<pre>
{
<main>
<div
id="lens-views"
/>
<pre>
{
"someParameter": "some-value",
"someOtherParameter": "some-other-value"
}
</pre>
</pre>
</main>
<div
class="HotbarMenu flex column"
>
<div
class="HotbarItems flex column gaps"
/>
<div
class="HotbarSelector"
>
<i
class="Icon Icon previous material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_left"
>
arrow_left
</span>
</i>
<div
class="HotbarIndex"
>
<div
class="badge Badge small clickable"
id="hotbarIndex"
>
0
</div>
</div>
<i
class="Icon material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_right"
>
arrow_right
</span>
</i>
</div>
</div>
<div
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
>
<div
class="item"
>
<div
data-testid="app-update-not-available"
>
No new updates available
</div>
</div>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
/>
</div>
</div>
<div
class="Notifications flex column align-flex-end"
/>
@@ -84,74 +136,126 @@ exports[`navigating between routes given route with optional path parameters whe
exports[`navigating between routes given route without path parameters when navigating to route renders 1`] = `
<div>
<div
class="topBar"
class="ClusterManager"
>
<div
class="items"
>
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
<span
class="icon"
data-icon-name="home"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<span
class="icon"
data-icon-name="arrow_back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="items"
/>
</div>
<div
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
class="topBar"
>
<div
class="item"
class="items"
>
<div
data-testid="app-update-not-available"
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
No new updates available
<span
class="icon"
data-icon-name="home"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<span
class="icon"
data-icon-name="arrow_back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="items"
/>
</div>
<main>
<div
id="lens-views"
/>
<div>
Some component
</div>
</main>
<div
class="HotbarMenu flex column"
>
<div
class="HotbarItems flex column gaps"
/>
<div
class="HotbarSelector"
>
<i
class="Icon Icon previous material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_left"
>
arrow_left
</span>
</i>
<div
class="HotbarIndex"
>
<div
class="badge Badge small clickable"
id="hotbarIndex"
>
0
</div>
</div>
<i
class="Icon material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_right"
>
arrow_right
</span>
</i>
</div>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
/>
</div>
<div>
Some component
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
>
<div
class="item"
>
<div
data-testid="app-update-not-available"
>
No new updates available
</div>
</div>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
/>
</div>
</div>
<div
class="Notifications flex column align-flex-end"
src/behaviours/add-cluster/__snapshots__/navigation-using-application-menu.test.tsx.snap
+365 -178
View File
@@ -3,71 +3,206 @@
exports[`add-cluster - navigation using application menu renders 1`] = `
<div>
<div
class="topBar"
class="ClusterManager"
>
<div
class="items"
>
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
<span
class="icon"
data-icon-name="home"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<span
class="icon"
data-icon-name="arrow_back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="items"
/>
</div>
<div
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
class="topBar"
>
<div
class="item"
class="items"
>
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
<span
class="icon"
data-icon-name="home"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<span
class="icon"
data-icon-name="arrow_back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="items"
/>
</div>
<main>
<div
id="lens-views"
/>
<div
class="flex justify-center Welcome align-center"
data-testid="welcome-page"
>
<div
data-testid="app-update-not-available"
data-testid="welcome-banner-container"
style="width: 320px;"
>
No new updates available
<i
class="Icon logo svg focusable"
>
<span
class="icon"
/>
</i>
<div
class="flex justify-center"
>
<div
data-testid="welcome-text-container"
style="width: 320px;"
>
<h2>
Welcome to OpenLens 5!
</h2>
<p>
To get you started we have auto-detected your clusters in your
kubeconfig file and added them to the catalog, your centralized
view for managing all your cloud-native resources.
<br />
<br />
If you have any questions or feedback, please join our
<a
class="link"
href="https://join.slack.com/t/k8slens/shared_invite/zt-wcl8jq3k-68R5Wcmk1o95MLBE5igUDQ"
rel="noreferrer"
target="_blank"
>
Lens Community slack channel
</a>
.
</p>
<ul
class="block"
data-testid="welcome-menu-container"
style="width: 320px;"
>
<li
class="flex grid-12"
>
<i
class="Icon box col-1 material focusable"
>
<span
class="icon"
data-icon-name="view_list"
>
view_list
</span>
</i>
<a
class="box col-10"
>
Browse Clusters in Catalog
</a>
<i
class="Icon box col-1 material focusable"
>
<span
class="icon"
data-icon-name="navigate_next"
>
navigate_next
</span>
</i>
</li>
</ul>
</div>
</div>
</div>
</div>
</main>
<div
class="HotbarMenu flex column"
>
<div
class="HotbarItems flex column gaps"
/>
<div
class="HotbarSelector"
>
<i
class="Icon Icon previous material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_left"
>
arrow_left
</span>
</i>
<div
class="HotbarIndex"
>
<div
class="badge Badge small clickable"
id="hotbarIndex"
>
0
</div>
</div>
<i
class="Icon material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_right"
>
arrow_right
</span>
</i>
</div>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
/>
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
>
<div
class="item"
>
<div
data-testid="app-update-not-available"
>
No new updates available
</div>
</div>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
/>
</div>
</div>
<div
class="Notifications flex column align-flex-end"
@@ -78,151 +213,203 @@ exports[`add-cluster - navigation using application menu renders 1`] = `
exports[`add-cluster - navigation using application menu when navigating to add cluster using application menu renders 1`] = `
<div>
<div
class="topBar"
class="ClusterManager"
>
<div
class="items"
>
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
<span
class="icon"
data-icon-name="home"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<span
class="icon"
data-icon-name="arrow_back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="items"
/>
</div>
<div
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
class="topBar"
>
<div
class="item"
class="items"
>
<div
data-testid="app-update-not-available"
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
No new updates available
</div>
</div>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
/>
</div>
<div
class="SettingLayout AddClusters"
data-testid="add-cluster-page"
>
<div
class="contentRegion"
id="ScrollSpyRoot"
>
<div
class="content flex column gaps"
>
<h2>
Add Clusters from Kubeconfig
</h2>
<p>
Clusters added here are
<b>
not
</b>
merged into the
<code>
~/.kube/config
</code>
file.
<a
href="https://docs.k8slens.dev/main/catalog/add-cluster/"
rel="noreferrer"
target="_blank"
<span
class="icon"
data-icon-name="home"
>
Read more about adding clusters.
</a>
</p>
<div
class="flex column"
/>
<div
class="actions-panel"
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<button
class="Button primary"
disabled=""
type="button"
<span
class="icon"
data-icon-name="arrow_back"
>
Add clusters
</button>
</div>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="toolsRegion"
class="items"
/>
</div>
<main>
<div
id="lens-views"
/>
<div
class="SettingLayout AddClusters"
data-testid="add-cluster-page"
>
<div
class="fixed top-[60px]"
class="contentRegion"
id="ScrollSpyRoot"
>
<div>
<div
aria-label="Close"
class="closeButton"
role="button"
>
<i
class="Icon icon material focusable"
<div
class="content flex column gaps"
>
<h2>
Add Clusters from Kubeconfig
</h2>
<p>
Clusters added here are
<b>
not
</b>
merged into the
<code>
~/.kube/config
</code>
file.
<a
href="https://docs.k8slens.dev/main/catalog/add-cluster/"
rel="noreferrer"
target="_blank"
>
<span
class="icon"
data-icon-name="close"
>
close
</span>
</i>
</div>
Read more about adding clusters.
</a>
</p>
<div
aria-hidden="true"
class="esc"
class="flex column"
/>
<div
class="actions-panel"
>
ESC
<button
class="Button primary"
disabled=""
type="button"
>
Add clusters
</button>
</div>
</div>
<div
class="toolsRegion"
>
<div
class="fixed top-[60px]"
>
<div>
<div
aria-label="Close"
class="closeButton"
role="button"
>
<i
class="Icon icon material focusable"
>
<span
class="icon"
data-icon-name="close"
>
close
</span>
</i>
</div>
<div
aria-hidden="true"
class="esc"
>
ESC
</div>
</div>
</div>
</div>
</div>
</div>
</main>
<div
class="HotbarMenu flex column"
>
<div
class="HotbarItems flex column gaps"
/>
<div
class="HotbarSelector"
>
<i
class="Icon Icon previous material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_left"
>
arrow_left
</span>
</i>
<div
class="HotbarIndex"
>
<div
class="badge Badge small clickable"
id="hotbarIndex"
>
0
</div>
</div>
<i
class="Icon material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_right"
>
arrow_right
</span>
</i>
</div>
</div>
<div
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
>
<div
class="item"
>
<div
data-testid="app-update-not-available"
>
No new updates available
</div>
</div>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
/>
</div>
</div>
<div
src/behaviours/add-cluster/navigation-using-application-menu.test.tsx
-4
View File
@@ -9,10 +9,6 @@ import { getApplicationBuilder } from "../../renderer/components/test-utils/get-
import React from "react";
// TODO: Make components free of side effects by making them deterministic
jest.mock("../../renderer/components/tooltip/tooltip", () => ({
Tooltip: () => null,
}));
jest.mock("../../renderer/components/tooltip/withTooltip", () => ({
withTooltip: (Target: any) => ({ tooltip, tooltipOverrideDisabled, ...props }: any) => <Target {...props} />,
}));
src/behaviours/application-update/__snapshots__/installing-update-using-topbar-button.test.tsx.snap
+189 -54
View File
@@ -4,71 +4,206 @@ exports[`encourage user to update when sufficient time passed since update was d
<body>
<div>
<div
class="topBar"
class="ClusterManager"
>
<div
class="items"
>
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
<span
class="icon"
data-icon-name="home"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<span
class="icon"
data-icon-name="arrow_back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="items"
/>
</div>
<div
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
class="topBar"
>
<div
class="item"
class="items"
>
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
<span
class="icon"
data-icon-name="home"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<span
class="icon"
data-icon-name="arrow_back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="items"
/>
</div>
<main>
<div
id="lens-views"
/>
<div
class="flex justify-center Welcome align-center"
data-testid="welcome-page"
>
<div
data-testid="app-update-not-available"
data-testid="welcome-banner-container"
style="width: 320px;"
>
No new updates available
<i
class="Icon logo svg focusable"
>
<span
class="icon"
/>
</i>
<div
class="flex justify-center"
>
<div
data-testid="welcome-text-container"
style="width: 320px;"
>
<h2>
Welcome to OpenLens 5!
</h2>
<p>
To get you started we have auto-detected your clusters in your
kubeconfig file and added them to the catalog, your centralized
view for managing all your cloud-native resources.
<br />
<br />
If you have any questions or feedback, please join our
<a
class="link"
href="https://join.slack.com/t/k8slens/shared_invite/zt-wcl8jq3k-68R5Wcmk1o95MLBE5igUDQ"
rel="noreferrer"
target="_blank"
>
Lens Community slack channel
</a>
.
</p>
<ul
class="block"
data-testid="welcome-menu-container"
style="width: 320px;"
>
<li
class="flex grid-12"
>
<i
class="Icon box col-1 material focusable"
>
<span
class="icon"
data-icon-name="view_list"
>
view_list
</span>
</i>
<a
class="box col-10"
>
Browse Clusters in Catalog
</a>
<i
class="Icon box col-1 material focusable"
>
<span
class="icon"
data-icon-name="navigate_next"
>
navigate_next
</span>
</i>
</li>
</ul>
</div>
</div>
</div>
</div>
</main>
<div
class="HotbarMenu flex column"
>
<div
class="HotbarItems flex column gaps"
/>
<div
class="HotbarSelector"
>
<i
class="Icon Icon previous material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_left"
>
arrow_left
</span>
</i>
<div
class="HotbarIndex"
>
<div
class="badge Badge small clickable"
id="hotbarIndex"
>
0
</div>
</div>
<i
class="Icon material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_right"
>
arrow_right
</span>
</i>
</div>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
/>
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
>
<div
class="item"
>
<div
data-testid="app-update-not-available"
>
No new updates available
</div>
</div>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
/>
</div>
</div>
<div
class="Notifications flex column align-flex-end"
src/behaviours/application-update/__snapshots__/installing-update-using-tray.test.ts.snap
+1159 -349
View File
File diff suppressed because it is too large. Load diff
src/behaviours/application-update/__snapshots__/installing-update.test.ts.snap
+1159 -349
View File
File diff suppressed because it is too large. Load diff
src/behaviours/application-update/__snapshots__/periodical-checking-of-updates.test.ts.snap
+189 -54
View File
@@ -4,71 +4,206 @@ exports[`periodical checking of updates given updater is enabled and configurati
<body>
<div>
<div
class="topBar"
class="ClusterManager"
>
<div
class="items"
>
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
<span
class="icon"
data-icon-name="home"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<span
class="icon"
data-icon-name="arrow_back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="items"
/>
</div>
<div
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
class="topBar"
>
<div
class="item"
class="items"
>
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
<span
class="icon"
data-icon-name="home"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<span
class="icon"
data-icon-name="arrow_back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="items"
/>
</div>
<main>
<div
id="lens-views"
/>
<div
class="flex justify-center Welcome align-center"
data-testid="welcome-page"
>
<div
data-testid="app-update-not-available"
data-testid="welcome-banner-container"
style="width: 320px;"
>
No new updates available
<i
class="Icon logo svg focusable"
>
<span
class="icon"
/>
</i>
<div
class="flex justify-center"
>
<div
data-testid="welcome-text-container"
style="width: 320px;"
>
<h2>
Welcome to OpenLens 5!
</h2>
<p>
To get you started we have auto-detected your clusters in your
kubeconfig file and added them to the catalog, your centralized
view for managing all your cloud-native resources.
<br />
<br />
If you have any questions or feedback, please join our
<a
class="link"
href="https://join.slack.com/t/k8slens/shared_invite/zt-wcl8jq3k-68R5Wcmk1o95MLBE5igUDQ"
rel="noreferrer"
target="_blank"
>
Lens Community slack channel
</a>
.
</p>
<ul
class="block"
data-testid="welcome-menu-container"
style="width: 320px;"
>
<li
class="flex grid-12"
>
<i
class="Icon box col-1 material focusable"
>
<span
class="icon"
data-icon-name="view_list"
>
view_list
</span>
</i>
<a
class="box col-10"
>
Browse Clusters in Catalog
</a>
<i
class="Icon box col-1 material focusable"
>
<span
class="icon"
data-icon-name="navigate_next"
>
navigate_next
</span>
</i>
</li>
</ul>
</div>
</div>
</div>
</div>
</main>
<div
class="HotbarMenu flex column"
>
<div
class="HotbarItems flex column gaps"
/>
<div
class="HotbarSelector"
>
<i
class="Icon Icon previous material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_left"
>
arrow_left
</span>
</i>
<div
class="HotbarIndex"
>
<div
class="badge Badge small clickable"
id="hotbarIndex"
>
0
</div>
</div>
<i
class="Icon material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_right"
>
arrow_right
</span>
</i>
</div>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
/>
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
>
<div
class="item"
>
<div
data-testid="app-update-not-available"
>
No new updates available
</div>
</div>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
/>
</div>
</div>
<div
class="Notifications flex column align-flex-end"
src/behaviours/application-update/__snapshots__/selection-of-update-stability.test.ts.snap
+189 -54
View File
@@ -4,71 +4,206 @@ exports[`selection of update stability when started renders 1`] = `
<body>
<div>
<div
class="topBar"
class="ClusterManager"
>
<div
class="items"
>
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
<span
class="icon"
data-icon-name="home"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<span
class="icon"
data-icon-name="arrow_back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="items"
/>
</div>
<div
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
class="topBar"
>
<div
class="item"
class="items"
>
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
<span
class="icon"
data-icon-name="home"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<span
class="icon"
data-icon-name="arrow_back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="items"
/>
</div>
<main>
<div
id="lens-views"
/>
<div
class="flex justify-center Welcome align-center"
data-testid="welcome-page"
>
<div
data-testid="app-update-not-available"
data-testid="welcome-banner-container"
style="width: 320px;"
>
No new updates available
<i
class="Icon logo svg focusable"
>
<span
class="icon"
/>
</i>
<div
class="flex justify-center"
>
<div
data-testid="welcome-text-container"
style="width: 320px;"
>
<h2>
Welcome to OpenLens 5!
</h2>
<p>
To get you started we have auto-detected your clusters in your
kubeconfig file and added them to the catalog, your centralized
view for managing all your cloud-native resources.
<br />
<br />
If you have any questions or feedback, please join our
<a
class="link"
href="https://join.slack.com/t/k8slens/shared_invite/zt-wcl8jq3k-68R5Wcmk1o95MLBE5igUDQ"
rel="noreferrer"
target="_blank"
>
Lens Community slack channel
</a>
.
</p>
<ul
class="block"
data-testid="welcome-menu-container"
style="width: 320px;"
>
<li
class="flex grid-12"
>
<i
class="Icon box col-1 material focusable"
>
<span
class="icon"
data-icon-name="view_list"
>
view_list
</span>
</i>
<a
class="box col-10"
>
Browse Clusters in Catalog
</a>
<i
class="Icon box col-1 material focusable"
>
<span
class="icon"
data-icon-name="navigate_next"
>
navigate_next
</span>
</i>
</li>
</ul>
</div>
</div>
</div>
</div>
</main>
<div
class="HotbarMenu flex column"
>
<div
class="HotbarItems flex column gaps"
/>
<div
class="HotbarSelector"
>
<i
class="Icon Icon previous material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_left"
>
arrow_left
</span>
</i>
<div
class="HotbarIndex"
>
<div
class="badge Badge small clickable"
id="hotbarIndex"
>
0
</div>
</div>
<i
class="Icon material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_right"
>
arrow_right
</span>
</i>
</div>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
/>
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
>
<div
class="item"
>
<div
data-testid="app-update-not-available"
>
No new updates available
</div>
</div>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
/>
</div>
</div>
<div
class="Notifications flex column align-flex-end"
src/behaviours/cluster/__snapshots__/order-of-sidebar-items.test.tsx.snap
+1124 -612
View File
File diff suppressed because it is too large. Load diff
src/behaviours/cluster/__snapshots__/sidebar-and-tab-navigation-for-core.test.tsx.snap
+3329 -1779
View File
File diff suppressed because it is too large. Load diff
src/behaviours/cluster/__snapshots__/sidebar-and-tab-navigation-for-extensions.test.tsx.snap
+3906 -2245
View File
File diff suppressed because it is too large. Load diff
src/behaviours/cluster/__snapshots__/visibility-of-sidebar-items.test.tsx.snap
+992 -480
View File
File diff suppressed because it is too large. Load diff
src/behaviours/cluster/sidebar-and-tab-navigation-for-core.test.tsx
+8 -5
View File
@@ -22,6 +22,7 @@ import pathExistsInjectable from "../../common/fs/path-exists.injectable";
import readJsonFileInjectable from "../../common/fs/read-json-file.injectable";
import { navigateToRouteInjectionToken } from "../../common/front-end-routing/navigate-to-route-injection-token";
import sidebarStorageInjectable from "../../renderer/components/layout/sidebar-storage/sidebar-storage.injectable";
import hostedClusterIdInjectable from "../../renderer/cluster-frame-context/hosted-cluster-id.injectable";
import { advanceFakeTime, useFakeTime } from "../../common/test-utils/use-fake-time";
describe("cluster - sidebar and tab navigation for core", () => {
@@ -38,6 +39,8 @@ describe("cluster - sidebar and tab navigation for core", () => {
applicationBuilder.setEnvironmentToClusterFrame();
applicationBuilder.beforeApplicationStart(({ rendererDi }) => {
rendererDi.override(hostedClusterIdInjectable, () => "some-hosted-cluster-id");
rendererDi.override(
directoryForLensLocalStorageInjectable,
() => "/some-directory-for-lens-local-storage",
@@ -94,7 +97,7 @@ describe("cluster - sidebar and tab navigation for core", () => {
const writeJsonFileFake = rendererDi.inject(writeJsonFileInjectable);
await writeJsonFileFake(
"/some-directory-for-lens-local-storage/app.json",
"/some-directory-for-lens-local-storage/some-hosted-cluster-id.json",
{
sidebar: {
expanded: { "some-parent-id": true },
@@ -136,7 +139,7 @@ describe("cluster - sidebar and tab navigation for core", () => {
const writeJsonFileFake = rendererDi.inject(writeJsonFileInjectable);
await writeJsonFileFake(
"/some-directory-for-lens-local-storage/app.json",
"/some-directory-for-lens-local-storage/some-hosted-cluster-id.json",
{
sidebar: {
expanded: { "some-unknown-parent-id": true },
@@ -166,7 +169,7 @@ describe("cluster - sidebar and tab navigation for core", () => {
const writeJsonFileFake = rendererDi.inject(writeJsonFileInjectable);
await writeJsonFileFake(
"/some-directory-for-lens-local-storage/app.json",
"/some-directory-for-lens-local-storage/some-hosted-cluster-id.json",
{
someThingButSidebar: {},
},
@@ -268,7 +271,7 @@ describe("cluster - sidebar and tab navigation for core", () => {
const pathExistsFake = rendererDi.inject(pathExistsInjectable);
const actual = await pathExistsFake(
"/some-directory-for-lens-local-storage/app.json",
"/some-directory-for-lens-local-storage/some-hosted-cluster-id.json",
);
expect(actual).toBe(false);
@@ -280,7 +283,7 @@ describe("cluster - sidebar and tab navigation for core", () => {
const readJsonFileFake = rendererDi.inject(readJsonFileInjectable);
const actual = await readJsonFileFake(
"/some-directory-for-lens-local-storage/app.json",
"/some-directory-for-lens-local-storage/some-hosted-cluster-id.json",
);
expect(actual).toEqual({
src/behaviours/cluster/sidebar-and-tab-navigation-for-extensions.test.tsx
+13 -5
View File
@@ -18,8 +18,14 @@ import { navigateToRouteInjectionToken } from "../../common/front-end-routing/na
import assert from "assert";
import type { FakeExtensionData } from "../../renderer/components/test-utils/get-renderer-extension-fake";
import { getRendererExtensionFakeFor } from "../../renderer/components/test-utils/get-renderer-extension-fake";
import hostedClusterIdInjectable from "../../renderer/cluster-frame-context/hosted-cluster-id.injectable";
import { advanceFakeTime, useFakeTime } from "../../common/test-utils/use-fake-time";
// TODO: Make tooltips free of side effects by making it deterministic
jest.mock("../../renderer/components/tooltip/withTooltip", () => ({
withTooltip: (target: any) => target,
}));
describe("cluster - sidebar and tab navigation for extensions", () => {
let applicationBuilder: ApplicationBuilder;
let rendererDi: DiContainer;
@@ -34,6 +40,8 @@ describe("cluster - sidebar and tab navigation for extensions", () => {
applicationBuilder.setEnvironmentToClusterFrame();
applicationBuilder.beforeApplicationStart(({ rendererDi }) => {
rendererDi.override(hostedClusterIdInjectable, () => "some-hosted-cluster-id");
rendererDi.override(
directoryForLensLocalStorageInjectable,
() => "/some-directory-for-lens-local-storage",
@@ -96,7 +104,7 @@ describe("cluster - sidebar and tab navigation for extensions", () => {
const writeJsonFileFake = rendererDi.inject(writeJsonFileInjectable);
await writeJsonFileFake(
"/some-directory-for-lens-local-storage/app.json",
"/some-directory-for-lens-local-storage/some-hosted-cluster-id.json",
{
sidebar: {
expanded: { "some-extension-name-some-parent-id": true },
@@ -132,7 +140,7 @@ describe("cluster - sidebar and tab navigation for extensions", () => {
const writeJsonFileFake = rendererDi.inject(writeJsonFileInjectable);
await writeJsonFileFake(
"/some-directory-for-lens-local-storage/app.json",
"/some-directory-for-lens-local-storage/some-hosted-cluster-id.json",
{
sidebar: {
expanded: { "some-extension-name-some-unknown-parent-id": true },
@@ -162,7 +170,7 @@ describe("cluster - sidebar and tab navigation for extensions", () => {
const writeJsonFileFake = rendererDi.inject(writeJsonFileInjectable);
await writeJsonFileFake(
"/some-directory-for-lens-local-storage/app.json",
"/some-directory-for-lens-local-storage/some-hosted-cluster-id.json",
{
someThingButSidebar: {},
},
@@ -284,7 +292,7 @@ describe("cluster - sidebar and tab navigation for extensions", () => {
const pathExistsFake = rendererDi.inject(pathExistsInjectable);
const actual = await pathExistsFake(
"/some-directory-for-lens-local-storage/app.json",
"/some-directory-for-lens-local-storage/some-hosted-cluster-id.json",
);
expect(actual).toBe(false);
@@ -296,7 +304,7 @@ describe("cluster - sidebar and tab navigation for extensions", () => {
const readJsonFileFake = rendererDi.inject(readJsonFileInjectable);
const actual = await readJsonFileFake(
"/some-directory-for-lens-local-storage/app.json",
"/some-directory-for-lens-local-storage/some-hosted-cluster-id.json",
);
expect(actual).toEqual({
src/behaviours/extensions/__snapshots__/navigation-using-application-menu.test.ts.snap
+402 -215
View File
@@ -3,71 +3,206 @@
exports[`extensions - navigation using application menu renders 1`] = `
<div>
<div
class="topBar"
class="ClusterManager"
>
<div
class="items"
>
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
<span
class="icon"
data-icon-name="home"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<span
class="icon"
data-icon-name="arrow_back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="items"
/>
</div>
<div
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
class="topBar"
>
<div
class="item"
class="items"
>
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
<span
class="icon"
data-icon-name="home"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<span
class="icon"
data-icon-name="arrow_back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="items"
/>
</div>
<main>
<div
id="lens-views"
/>
<div
class="flex justify-center Welcome align-center"
data-testid="welcome-page"
>
<div
data-testid="app-update-not-available"
data-testid="welcome-banner-container"
style="width: 320px;"
>
No new updates available
<i
class="Icon logo svg focusable"
>
<span
class="icon"
/>
</i>
<div
class="flex justify-center"
>
<div
data-testid="welcome-text-container"
style="width: 320px;"
>
<h2>
Welcome to OpenLens 5!
</h2>
<p>
To get you started we have auto-detected your clusters in your
kubeconfig file and added them to the catalog, your centralized
view for managing all your cloud-native resources.
<br />
<br />
If you have any questions or feedback, please join our
<a
class="link"
href="https://join.slack.com/t/k8slens/shared_invite/zt-wcl8jq3k-68R5Wcmk1o95MLBE5igUDQ"
rel="noreferrer"
target="_blank"
>
Lens Community slack channel
</a>
.
</p>
<ul
class="block"
data-testid="welcome-menu-container"
style="width: 320px;"
>
<li
class="flex grid-12"
>
<i
class="Icon box col-1 material focusable"
>
<span
class="icon"
data-icon-name="view_list"
>
view_list
</span>
</i>
<a
class="box col-10"
>
Browse Clusters in Catalog
</a>
<i
class="Icon box col-1 material focusable"
>
<span
class="icon"
data-icon-name="navigate_next"
>
navigate_next
</span>
</i>
</li>
</ul>
</div>
</div>
</div>
</div>
</main>
<div
class="HotbarMenu flex column"
>
<div
class="HotbarItems flex column gaps"
/>
<div
class="HotbarSelector"
>
<i
class="Icon Icon previous material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_left"
>
arrow_left
</span>
</i>
<div
class="HotbarIndex"
>
<div
class="badge Badge small clickable"
id="hotbarIndex"
>
0
</div>
</div>
<i
class="Icon material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_right"
>
arrow_right
</span>
</i>
</div>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
/>
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
>
<div
class="item"
>
<div
data-testid="app-update-not-available"
>
No new updates available
</div>
</div>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
/>
</div>
</div>
<div
class="Notifications flex column align-flex-end"
@@ -78,184 +213,236 @@ exports[`extensions - navigation using application menu renders 1`] = `
exports[`extensions - navigation using application menu when navigating to extensions using application menu renders 1`] = `
<div>
<div
class="topBar"
class="ClusterManager"
>
<div
class="items"
>
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
<span
class="icon"
data-icon-name="home"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<span
class="icon"
data-icon-name="arrow_back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="items"
/>
</div>
<div
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
class="topBar"
>
<div
class="item"
class="items"
>
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
<span
class="icon"
data-icon-name="home"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<span
class="icon"
data-icon-name="arrow_back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="items"
/>
</div>
<main>
<div
id="lens-views"
/>
<div
class="SettingLayout DropFileInput Extensions"
data-testid="extensions-page"
>
<div
data-testid="app-update-not-available"
class="contentRegion"
id="ScrollSpyRoot"
>
No new updates available
</div>
</div>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
/>
</div>
<div
class="SettingLayout DropFileInput Extensions"
data-testid="extensions-page"
>
<div
class="contentRegion"
id="ScrollSpyRoot"
>
<div
class="content"
>
<section>
<h1>
Extensions
</h1>
<div
class="notice mb-14 mt-3"
class="content"
>
<p>
Add new features via Lens Extensions. Check out the
<a
href="https://docs.k8slens.dev/main/extensions/"
rel="noreferrer"
target="_blank"
>
docs
</a>
and list of
<a
href="https://github.com/lensapp/lens-extensions/blob/main/README.md"
rel="noreferrer"
target="_blank"
>
available extensions
</a>
.
</p>
</div>
<section
class="mt-2"
>
<div
class="SubTitle"
>
Name or file path or URL to an extension package (tar, tgz)
</div>
<div
class="flex"
>
<section>
<h1>
Extensions
</h1>
<div
class="flex-1"
/>
<div
class="flex-initial"
class="notice mb-14 mt-3"
>
<button
class="Button w-80 h-full primary"
type="button"
<p>
Add new features via Lens Extensions. Check out the
<a
href="https://docs.k8slens.dev/main/extensions/"
rel="noreferrer"
target="_blank"
>
docs
</a>
and list of
<a
href="https://github.com/lensapp/lens-extensions/blob/main/README.md"
rel="noreferrer"
target="_blank"
>
available extensions
</a>
.
</p>
</div>
<section
class="mt-2"
>
<div
class="SubTitle"
>
Install
</button>
Name or file path or URL to an extension package (tar, tgz)
</div>
<div
class="flex"
>
<div
class="flex-1"
/>
<div
class="flex-initial"
>
<button
class="Button w-80 h-full primary"
type="button"
>
Install
</button>
</div>
</div>
<small
class="mt-3"
>
<b>
Pro-Tip
</b>
: you can drag-n-drop tarball-file to this area
</small>
</section>
<div>
<div
class="Spinner singleColor center"
/>
</div>
</section>
</div>
<div
class="toolsRegion"
>
<div
class="fixed top-[60px]"
>
<div>
<div
aria-label="Close"
class="closeButton"
role="button"
>
<i
class="Icon icon material focusable"
>
<span
class="icon"
data-icon-name="close"
>
close
</span>
</i>
</div>
<div
aria-hidden="true"
class="esc"
>
ESC
</div>
</div>
</div>
<small
class="mt-3"
>
<b>
Pro-Tip
</b>
: you can drag-n-drop tarball-file to this area
</small>
</section>
<div>
<div
class="Spinner singleColor center"
/>
</div>
</section>
</div>
<div
class="toolsRegion"
>
<div
class="fixed top-[60px]"
>
<div>
<div
aria-label="Close"
class="closeButton"
role="button"
>
<i
class="Icon icon material focusable"
>
<span
class="icon"
data-icon-name="close"
>
close
</span>
</i>
</div>
<div
aria-hidden="true"
class="esc"
>
ESC
</div>
</div>
</div>
</div>
</main>
<div
class="HotbarMenu flex column"
>
<div
class="HotbarItems flex column gaps"
/>
<div
class="HotbarSelector"
>
<i
class="Icon Icon previous material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_left"
>
arrow_left
</span>
</i>
<div
class="HotbarIndex"
>
<div
class="badge Badge small clickable"
id="hotbarIndex"
>
0
</div>
</div>
<i
class="Icon material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_right"
>
arrow_right
</span>
</i>
</div>
</div>
<div
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
>
<div
class="item"
>
<div
data-testid="app-update-not-available"
>
No new updates available
</div>
</div>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
/>
</div>
</div>
<div
src/behaviours/helm-charts/__snapshots__/add-custom-helm-repository-in-preferences.test.ts.snap
+5523 -4899
View File
File diff suppressed because it is too large. Load diff
src/behaviours/helm-charts/__snapshots__/add-helm-repository-from-list-in-preferences.test.ts.snap
+5223 -4703
View File
File diff suppressed because it is too large. Load diff
src/behaviours/helm-charts/__snapshots__/listing-active-helm-repositories-in-preferences.test.ts.snap
+4453 -3933
View File
File diff suppressed because it is too large. Load diff
src/behaviours/helm-charts/__snapshots__/navigation-to-helm-charts.test.ts.snap
+532 -397
View File
@@ -3,451 +3,586 @@
exports[`helm-charts - navigation to Helm charts when navigating to Helm charts renders 1`] = `
<div>
<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="nav-item flex gaps align-center expandable"
data-testid="sidebar-item-link-for-workloads"
href="/"
>
<i
class="Icon svg focusable"
>
<span
class="icon"
/>
</i>
<span
class="link-text box grow"
>
Workloads
</span>
<i
class="Icon expand-icon box right 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="nav-item flex gaps align-center"
data-testid="sidebar-item-link-for-config"
href="/"
>
<i
class="Icon material focusable"
>
<span
class="icon"
data-icon-name="list"
>
list
</span>
</i>
<span
class="link-text box grow"
>
Config
</span>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
data-testid="sidebar-item-network"
>
<a
class="nav-item flex gaps align-center expandable"
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
class="link-text box grow"
>
Network
</span>
<i
class="Icon expand-icon box right 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="nav-item flex gaps align-center"
data-testid="sidebar-item-link-for-storage"
href="/"
>
<i
class="Icon material focusable"
>
<span
class="icon"
data-icon-name="storage"
>
storage
</span>
</i>
<span
class="link-text box grow"
>
Storage
</span>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="true"
data-testid="sidebar-item-helm"
>
<a
aria-current="page"
class="nav-item flex gaps align-center expandable active"
data-testid="sidebar-item-link-for-helm"
href="/"
>
<i
class="Icon svg focusable"
>
<span
class="icon"
/>
</i>
<span
class="link-text box grow"
>
Helm
</span>
<i
class="Icon expand-icon box right 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="nav-item flex gaps align-center"
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
class="link-text box grow"
>
Access Control
</span>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
data-testid="sidebar-item-custom-resources"
>
<a
class="nav-item flex gaps align-center expandable"
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
class="link-text box grow"
>
Custom Resources
</span>
<i
class="Icon expand-icon box right material focusable"
>
<span
class="icon"
data-icon-name="keyboard_arrow_down"
>
keyboard_arrow_down
</span>
</i>
</a>
</div>
</div>
</div>
class="Notifications flex column align-flex-end"
/>
<div
class="TabLayout"
data-testid="tab-layout"
class="mainLayout"
style="--sidebar-width: 200px;"
>
<div
class="Tabs center scrollable"
class="sidebar"
>
<div
class="Tab flex gaps align-center active"
data-is-active-test="true"
data-testid="tab-link-for-charts"
role="tab"
tabindex="0"
class="flex flex-col"
data-testid="cluster-sidebar"
>
<div
class="label"
>
Charts
</div>
</div>
<div
class="Tab flex gaps align-center"
data-is-active-test="false"
data-testid="tab-link-for-releases"
role="tab"
tabindex="0"
>
<div
class="label"
>
Releases
</div>
</div>
</div>
<main>
<div
data-testid="page-for-helm-charts"
style="display: none;"
/>
<div
class="ItemListLayout flex column HelmCharts"
>
<div
class="header flex gaps align-center"
class="SidebarCluster"
>
<div
class="Input SearchInput focused"
class="Avatar rounded loadingAvatar"
style="width: 40px; height: 40px;"
>
<label
class="input-area flex gaps align-center"
id=""
??
</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="nav-item flex gaps align-center expandable"
data-testid="sidebar-item-link-for-workloads"
href="/"
>
<input
class="input box grow"
placeholder="Search Helm Charts..."
spellcheck="false"
value=""
/>
<i
class="Icon material focusable small"
class="Icon svg focusable"
>
<span
class="icon"
data-icon-name="search"
/>
</i>
<span
class="link-text box grow"
>
Workloads
</span>
<i
class="Icon expand-icon box right material focusable"
>
<span
class="icon"
data-icon-name="keyboard_arrow_down"
>
search
keyboard_arrow_down
</span>
</i>
</label>
<div
class="input-info flex gaps"
/>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
data-testid="sidebar-item-config"
>
<a
class="nav-item flex gaps align-center"
data-testid="sidebar-item-link-for-config"
href="/"
>
<i
class="Icon material focusable"
>
<span
class="icon"
data-icon-name="list"
>
list
</span>
</i>
<span
class="link-text box grow"
>
Config
</span>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
data-testid="sidebar-item-network"
>
<a
class="nav-item flex gaps align-center expandable"
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
class="link-text box grow"
>
Network
</span>
<i
class="Icon expand-icon box right 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="nav-item flex gaps align-center"
data-testid="sidebar-item-link-for-storage"
href="/"
>
<i
class="Icon material focusable"
>
<span
class="icon"
data-icon-name="storage"
>
storage
</span>
</i>
<span
class="link-text box grow"
>
Storage
</span>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="true"
data-testid="sidebar-item-helm"
>
<a
aria-current="page"
class="nav-item flex gaps align-center expandable active"
data-testid="sidebar-item-link-for-helm"
href="/"
>
<i
class="Icon svg focusable"
>
<span
class="icon"
/>
</i>
<span
class="link-text box grow"
>
Helm
</span>
<i
class="Icon expand-icon box right 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="nav-item flex gaps align-center"
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
class="link-text box grow"
>
Access Control
</span>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
data-testid="sidebar-item-custom-resources"
>
<a
class="nav-item flex gaps align-center expandable"
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
class="link-text box grow"
>
Custom Resources
</span>
<i
class="Icon expand-icon box right 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="items box grow flex column"
class="Tabs center scrollable"
>
<div
class="Table flex column HelmCharts box grow dark selectable scrollable sortable autoSize virtual"
class="Tab flex gaps align-center active"
data-is-active-test="true"
data-testid="tab-link-for-charts"
role="tab"
tabindex="0"
>
<div
class="TableHead sticky nowrap topLine"
class="label"
>
Charts
</div>
</div>
<div
class="Tab flex gaps align-center"
data-is-active-test="false"
data-testid="tab-link-for-releases"
role="tab"
tabindex="0"
>
<div
class="label"
>
Releases
</div>
</div>
</div>
<main>
<div
data-testid="page-for-helm-charts"
style="display: none;"
/>
<div
class="ItemListLayout flex column HelmCharts"
>
<div
class="header flex gaps align-center"
>
<div
class="TableCell icon nowrap"
class="Input SearchInput focused"
>
<div
class="content"
/>
</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 description nowrap"
id="description"
>
<div
class="content"
>
Description
</div>
</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 repository nowrap sorting"
id="repo"
>
<div
class="content"
>
Repository
</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"
<label
class="input-area flex gaps align-center"
id=""
>
<input
class="input box grow"
placeholder="Search Helm Charts..."
spellcheck="false"
value=""
/>
<i
class="Icon material interactive focusable"
id="menu_actions_17"
tabindex="0"
class="Icon material focusable small"
>
<span
class="icon"
data-icon-name="more_vert"
data-icon-name="search"
>
more_vert
search
</span>
</i>
</div>
</label>
<div
class="input-info flex gaps"
/>
</div>
</div>
<div
class="NoItems flex box grow"
class="items box grow flex column"
>
<div
class="box center"
class="Table flex column HelmCharts box grow dark selectable scrollable sortable autoSize virtual"
>
Item list is empty
<div
class="TableHead sticky nowrap topLine"
>
<div
class="TableCell icon nowrap"
>
<div
class="content"
/>
</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 description nowrap"
id="description"
>
<div
class="content"
>
Description
</div>
</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 repository nowrap sorting"
id="repo"
>
<div
class="content"
>
Repository
</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_27"
tabindex="0"
>
<span
class="icon"
data-icon-name="more_vert"
>
more_vert
</span>
</i>
</div>
</div>
</div>
<div
class="NoItems flex box grow"
>
<div
class="box center"
>
Item list is empty
</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"
/>
<div
class="tabs-container flex align-center"
>
<div
class="dockTabs"
role="tablist"
>
<div
class="Tabs tabs"
>
<div
class="Tab flex gaps align-center DockTab TerminalTab active"
id="tab-terminal"
role="tab"
tabindex="0"
>
<i
class="Icon material focusable"
>
<span
class="icon"
data-icon-name="terminal"
>
terminal
</span>
</i>
<div
class="label"
>
<div
class="flex align-center"
>
<span
class="title"
>
Terminal
</span>
<div
class="close"
>
<i
class="Icon material interactive focusable small"
id="tooltip_target_13"
tabindex="0"
>
<span
class="icon"
data-icon-name="close"
>
close
</span>
<div />
</i>
</div>
</div>
</div>
</div>
</div>
</div>
<div
class="AddRemoveButtons flex gaps"
/>
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_14"
tabindex="0"
>
<span
class="icon"
data-icon-name="add"
>
add
</span>
<div />
</i>
</div>
<i
class="Icon material interactive focusable"
id="tooltip_target_16"
tabindex="0"
>
<span
class="icon"
data-icon-name="fullscreen"
>
fullscreen
</span>
<div />
</i>
<i
class="Icon material interactive focusable"
id="tooltip_target_17"
tabindex="0"
>
<span
class="icon"
data-icon-name="keyboard_arrow_up"
>
keyboard_arrow_up
</span>
<div />
</i>
</div>
</div>
</div>
</main>
</div>
</div>
<div
class="Notifications flex column align-flex-end"
/>
</div>
`;
src/behaviours/helm-charts/__snapshots__/remove-helm-repository-from-list-of-active-repository-in-preferences.test.ts.snap
+2094 -1886
View File
File diff suppressed because it is too large. Load diff
src/behaviours/preferences/__snapshots__/closing-preferences.test.tsx.snap
+2388 -1972
View File
File diff suppressed because it is too large. Load diff
src/behaviours/preferences/__snapshots__/navigation-to-application-preferences.test.ts.snap
+900 -796
View File
File diff suppressed because it is too large. Load diff
src/behaviours/preferences/__snapshots__/navigation-to-editor-preferences.test.ts.snap
+1037 -933
View File
File diff suppressed because it is too large. Load diff
src/behaviours/preferences/__snapshots__/navigation-to-extension-specific-preferences.test.tsx.snap
+3567 -3047
View File
File diff suppressed because it is too large. Load diff
src/behaviours/preferences/__snapshots__/navigation-to-kubernetes-preferences.test.ts.snap
+1053 -949
View File
File diff suppressed because it is too large. Load diff
src/behaviours/preferences/__snapshots__/navigation-to-proxy-preferences.test.ts.snap
+900 -796
View File
File diff suppressed because it is too large. Load diff
src/behaviours/preferences/__snapshots__/navigation-to-telemetry-preferences.test.tsx.snap
+2002 -1742
View File
File diff suppressed because it is too large. Load diff
src/behaviours/preferences/__snapshots__/navigation-to-terminal-preferences.test.ts.snap
+1067 -963
View File
File diff suppressed because it is too large. Load diff
src/behaviours/preferences/__snapshots__/navigation-using-application-menu.test.ts.snap
+805 -618
View File
File diff suppressed because it is too large. Load diff
src/behaviours/preferences/__snapshots__/navigation-using-tray.test.ts.snap
+805 -618
View File
File diff suppressed because it is too large. Load diff
src/behaviours/status-bar/__snapshots__/status-bar-items-originating-from-extensions.test.tsx.snap
+213 -78
View File
@@ -4,115 +4,250 @@ exports[`status-bar-items-originating-from-extensions when application starts wh
<body>
<div>
<div
class="topBar"
class="ClusterManager"
>
<div
class="items"
class="topBar"
>
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
<div
class="items"
>
<span
class="icon"
data-icon-name="home"
<i
class="Icon material interactive focusable"
data-testid="home-button"
tabindex="0"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
<span
class="icon"
data-icon-name="arrow_back"
<span
class="icon"
data-icon-name="home"
>
home
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
<span
class="icon"
data-icon-name="arrow_forward"
<span
class="icon"
data-icon-name="arrow_back"
>
arrow_back
</span>
</i>
<i
class="Icon material interactive disabled focusable"
data-testid="history-forward"
>
arrow_forward
</span>
</i>
<span
class="icon"
data-icon-name="arrow_forward"
>
arrow_forward
</span>
</i>
</div>
<div
class="items"
/>
</div>
<main>
<div
id="lens-views"
/>
<div
class="flex justify-center Welcome align-center"
data-testid="welcome-page"
>
<div
data-testid="welcome-banner-container"
style="width: 320px;"
>
<i
class="Icon logo svg focusable"
>
<span
class="icon"
/>
</i>
<div
class="flex justify-center"
>
<div
data-testid="welcome-text-container"
style="width: 320px;"
>
<h2>
Welcome to OpenLens 5!
</h2>
<p>
To get you started we have auto-detected your clusters in your
kubeconfig file and added them to the catalog, your centralized
view for managing all your cloud-native resources.
<br />
<br />
If you have any questions or feedback, please join our
<a
class="link"
href="https://join.slack.com/t/k8slens/shared_invite/zt-wcl8jq3k-68R5Wcmk1o95MLBE5igUDQ"
rel="noreferrer"
target="_blank"
>
Lens Community slack channel
</a>
.
</p>
<ul
class="block"
data-testid="welcome-menu-container"
style="width: 320px;"
>
<li
class="flex grid-12"
>
<i
class="Icon box col-1 material focusable"
>
<span
class="icon"
data-icon-name="view_list"
>
view_list
</span>
</i>
<a
class="box col-10"
>
Browse Clusters in Catalog
</a>
<i
class="Icon box col-1 material focusable"
>
<span
class="icon"
data-icon-name="navigate_next"
>
navigate_next
</span>
</i>
</li>
</ul>
</div>
</div>
</div>
</div>
</main>
<div
class="items"
/>
</div>
<div
class="StatusBar"
>
<div
class="leftSide"
data-testid="status-bar-left"
class="HotbarMenu flex column"
>
<div
class="item"
>
<div
data-testid="app-update-not-available"
>
No new updates available
</div>
</div>
class="HotbarItems flex column gaps"
/>
<div
class="item"
class="HotbarSelector"
>
<div
data-testid="some-testId"
<i
class="Icon Icon previous material interactive focusable"
tabindex="0"
>
left1
</div>
</div>
<div
class="item"
>
<span
class="icon"
data-icon-name="arrow_left"
>
arrow_left
</span>
</i>
<div
data-testid="some-testId"
class="HotbarIndex"
>
left2
<div
class="badge Badge small clickable"
id="hotbarIndex"
>
0
</div>
</div>
<i
class="Icon material interactive focusable"
tabindex="0"
>
<span
class="icon"
data-icon-name="arrow_right"
>
arrow_right
</span>
</i>
</div>
</div>
<div
class="rightSide"
data-testid="status-bar-right"
class="StatusBar"
>
<div
class="item"
class="leftSide"
data-testid="status-bar-left"
>
<div
data-testid="some-testId"
class="item"
>
right3
<div
data-testid="app-update-not-available"
>
No new updates available
</div>
</div>
<div
class="item"
>
<div
data-testid="some-testId"
>
left1
</div>
</div>
<div
class="item"
>
<div
data-testid="some-testId"
>
left2
</div>
</div>
</div>
<div
class="item"
class="rightSide"
data-testid="status-bar-right"
>
<span
data-testid="some-testId"
<div
class="item"
>
right2
</span>
</div>
<div
class="item"
>
<span
data-testid="some-testId"
<div
data-testid="some-testId"
>
right3
</div>
</div>
<div
class="item"
>
right1
</span>
<span
data-testid="some-testId"
>
right2
</span>
</div>
<div
class="item"
>
<span
data-testid="some-testId"
>
right1
</span>
</div>
</div>
</div>
</div>
src/behaviours/welcome/__snapshots__/navigation-using-application-menu.test.ts.snap
+1020 -183
View File
File diff suppressed because it is too large. Load diff
src/behaviours/welcome/navigation-using-application-menu.test.ts
+25 -9
View File
@@ -21,25 +21,41 @@ describe("welcome - navigation using application menu", () => {
expect(rendered.container).toMatchSnapshot();
});
it("does not show welcome page yet", () => {
const actual = rendered.queryByTestId("welcome-page");
it("shows welcome page being front page", () => {
const actual = rendered.getByTestId("welcome-page");
expect(actual).toBeNull();
expect(actual).not.toBeNull();
});
describe("when navigating to welcome using application menu", () => {
describe("when navigated somewhere else", () => {
beforeEach(() => {
applicationBuilder.applicationMenu.click("help.welcome");
applicationBuilder.applicationMenu.click("root.preferences");
});
it("renders", () => {
expect(rendered.container).toMatchSnapshot();
expect(rendered.baseElement).toMatchSnapshot();
});
it("shows welcome page", () => {
const actual = rendered.getByTestId("welcome-page");
it("does not show welcome page", () => {
const actual = rendered.queryByTestId("welcome-page");
expect(actual).not.toBeNull();
expect(actual).toBeNull();
});
describe("when navigated to welcome using application menu", () => {
beforeEach(() => {
applicationBuilder.applicationMenu.click("help.welcome");
});
it("renders", () => {
expect(rendered.container).toMatchSnapshot();
});
it("shows welcome page", () => {
const actual = rendered.getByTestId("welcome-page");
expect(actual).not.toBeNull();
});
});
});
});