mirror of
https://github.com/lensapp/lens.git
synced 2025-05-20 05:10:56 +00:00
Add tests navigating to extension specific tabs
Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev
parent
558b337256
commit
ceafd03308
@ -2084,3 +2084,361 @@ exports[`preferences - navigation to extension specific preferences given in pre
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
`;
|
`;
|
||||||
|
|
||||||
|
exports[`preferences - navigation to extension specific preferences when navigating to extension specific tab renders 1`] = `
|
||||||
|
<div>
|
||||||
|
<div
|
||||||
|
class="SettingLayout showNavigation Preferences"
|
||||||
|
data-testid="extension-preferences-page"
|
||||||
|
>
|
||||||
|
<nav
|
||||||
|
class="sidebarRegion"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="sidebar"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="Tabs flex column"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="header"
|
||||||
|
>
|
||||||
|
Preferences
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="Tab flex gaps align-center"
|
||||||
|
data-testid="tab-link-for-application"
|
||||||
|
role="tab"
|
||||||
|
tabindex="0"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="label"
|
||||||
|
>
|
||||||
|
App
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="Tab flex gaps align-center"
|
||||||
|
data-testid="tab-link-for-proxy"
|
||||||
|
role="tab"
|
||||||
|
tabindex="0"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="label"
|
||||||
|
>
|
||||||
|
Proxy
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="Tab flex gaps align-center"
|
||||||
|
data-testid="tab-link-for-kubernetes"
|
||||||
|
role="tab"
|
||||||
|
tabindex="0"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="label"
|
||||||
|
>
|
||||||
|
Kubernetes
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="Tab flex gaps align-center"
|
||||||
|
data-testid="tab-link-for-editor"
|
||||||
|
role="tab"
|
||||||
|
tabindex="0"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="label"
|
||||||
|
>
|
||||||
|
Editor
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="Tab flex gaps align-center"
|
||||||
|
data-testid="tab-link-for-terminal"
|
||||||
|
role="tab"
|
||||||
|
tabindex="0"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="label"
|
||||||
|
>
|
||||||
|
Terminal
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="Tab flex gaps align-center active"
|
||||||
|
data-testid="tab-link-for-extension-duplicated-tab-page-id-nav-item-metrics-extension-tab"
|
||||||
|
role="tab"
|
||||||
|
tabindex="0"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="label"
|
||||||
|
>
|
||||||
|
Metrics tab
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
<div
|
||||||
|
class="contentRegion"
|
||||||
|
id="ScrollSpyRoot"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="content"
|
||||||
|
>
|
||||||
|
<section
|
||||||
|
id="extensions"
|
||||||
|
>
|
||||||
|
<h2>
|
||||||
|
duplicated-tab-page-id
|
||||||
|
|
||||||
|
preferences
|
||||||
|
</h2>
|
||||||
|
<section
|
||||||
|
class="small"
|
||||||
|
data-testid="extension-preference-item-for-another-metrics-preference-item-id"
|
||||||
|
id="another-metrics-preference-item-id"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="SubTitle"
|
||||||
|
>
|
||||||
|
Another metrics
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
data-testid="another-metrics-preference-item-input"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
class="hint"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
data-testid="another-metrics-preference-item-hint"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<hr
|
||||||
|
class="small"
|
||||||
|
/>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="toolsRegion"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="fixed top-[60px]"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
data-testid="close-preferences"
|
||||||
|
>
|
||||||
|
<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>
|
||||||
|
<div
|
||||||
|
class="Notifications flex column align-flex-end"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
|
||||||
|
exports[`preferences - navigation to extension specific preferences when navigating to someone else extension specific tab renders 1`] = `
|
||||||
|
<div>
|
||||||
|
<div
|
||||||
|
class="SettingLayout showNavigation Preferences"
|
||||||
|
data-testid="extension-preferences-page"
|
||||||
|
>
|
||||||
|
<nav
|
||||||
|
class="sidebarRegion"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="sidebar"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="Tabs flex column"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="header"
|
||||||
|
>
|
||||||
|
Preferences
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="Tab flex gaps align-center"
|
||||||
|
data-testid="tab-link-for-application"
|
||||||
|
role="tab"
|
||||||
|
tabindex="0"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="label"
|
||||||
|
>
|
||||||
|
App
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="Tab flex gaps align-center"
|
||||||
|
data-testid="tab-link-for-proxy"
|
||||||
|
role="tab"
|
||||||
|
tabindex="0"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="label"
|
||||||
|
>
|
||||||
|
Proxy
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="Tab flex gaps align-center"
|
||||||
|
data-testid="tab-link-for-kubernetes"
|
||||||
|
role="tab"
|
||||||
|
tabindex="0"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="label"
|
||||||
|
>
|
||||||
|
Kubernetes
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="Tab flex gaps align-center"
|
||||||
|
data-testid="tab-link-for-editor"
|
||||||
|
role="tab"
|
||||||
|
tabindex="0"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="label"
|
||||||
|
>
|
||||||
|
Editor
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="Tab flex gaps align-center"
|
||||||
|
data-testid="tab-link-for-terminal"
|
||||||
|
role="tab"
|
||||||
|
tabindex="0"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="label"
|
||||||
|
>
|
||||||
|
Terminal
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="Tab flex gaps align-center active"
|
||||||
|
data-testid="tab-link-for-extension-duplicated-tab-page-id-nav-item-metrics-extension-tab"
|
||||||
|
role="tab"
|
||||||
|
tabindex="0"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="label"
|
||||||
|
>
|
||||||
|
Metrics tab
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
<div
|
||||||
|
class="contentRegion"
|
||||||
|
id="ScrollSpyRoot"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="content"
|
||||||
|
>
|
||||||
|
<section
|
||||||
|
id="extensions"
|
||||||
|
>
|
||||||
|
<h2>
|
||||||
|
extension-using-someone-else-tab-id
|
||||||
|
|
||||||
|
preferences
|
||||||
|
</h2>
|
||||||
|
<section
|
||||||
|
class="small"
|
||||||
|
data-testid="extension-preference-item-for-my-preferences-item-id"
|
||||||
|
id="my-preferences-item-id"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="SubTitle"
|
||||||
|
>
|
||||||
|
My preferences
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
data-testid="my-preferences-item-input"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
class="hint"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
data-testid="my-preferences-item-hint"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<hr
|
||||||
|
class="small"
|
||||||
|
/>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="toolsRegion"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="fixed top-[60px]"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
data-testid="close-preferences"
|
||||||
|
>
|
||||||
|
<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>
|
||||||
|
<div
|
||||||
|
class="Notifications flex column align-flex-end"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
|||||||
@ -9,6 +9,9 @@ import React from "react";
|
|||||||
import "@testing-library/jest-dom/extend-expect";
|
import "@testing-library/jest-dom/extend-expect";
|
||||||
import type { FakeExtensionData } from "../../renderer/components/test-utils/get-renderer-extension-fake";
|
import type { FakeExtensionData } from "../../renderer/components/test-utils/get-renderer-extension-fake";
|
||||||
import { getRendererExtensionFakeFor } from "../../renderer/components/test-utils/get-renderer-extension-fake";
|
import { getRendererExtensionFakeFor } from "../../renderer/components/test-utils/get-renderer-extension-fake";
|
||||||
|
import type { DiContainer } from "@ogre-tools/injectable";
|
||||||
|
import { getDiForUnitTesting } from "../../renderer/getDiForUnitTesting";
|
||||||
|
import extensionPreferencesRouteInjectable from "../../common/front-end-routing/routes/preferences/extension/extension-preferences-route.injectable";
|
||||||
|
|
||||||
describe("preferences - navigation to extension specific preferences", () => {
|
describe("preferences - navigation to extension specific preferences", () => {
|
||||||
let applicationBuilder: ApplicationBuilder;
|
let applicationBuilder: ApplicationBuilder;
|
||||||
@ -276,6 +279,65 @@ describe("preferences - navigation to extension specific preferences", () => {
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
describe("when navigating to extension specific tab", () => {
|
||||||
|
let rendered: RenderResult;
|
||||||
|
let di: DiContainer;
|
||||||
|
|
||||||
|
beforeEach(async () => {
|
||||||
|
di = getDiForUnitTesting({ doGeneralOverrides: true });
|
||||||
|
|
||||||
|
const getRendererExtensionFake = getRendererExtensionFakeFor(applicationBuilder);
|
||||||
|
const extension = getRendererExtensionFake(extensionStubWithWithSameRegisteredTab);
|
||||||
|
|
||||||
|
applicationBuilder.beforeRender(() => {
|
||||||
|
const extensionRoute = di.inject(extensionPreferencesRouteInjectable);
|
||||||
|
const params = { parameters: {
|
||||||
|
extensionId: "duplicated-tab-page-id",
|
||||||
|
tabId: "metrics-extension-tab",
|
||||||
|
}};
|
||||||
|
|
||||||
|
applicationBuilder.preferences.navigateTo(extensionRoute, params);
|
||||||
|
});
|
||||||
|
|
||||||
|
await applicationBuilder.addExtensions(extension);
|
||||||
|
rendered = await applicationBuilder.render();
|
||||||
|
});
|
||||||
|
|
||||||
|
it("renders", () => {
|
||||||
|
expect(rendered.container).toMatchSnapshot();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe("when navigating to someone else extension specific tab", () => {
|
||||||
|
let rendered: RenderResult;
|
||||||
|
let di: DiContainer;
|
||||||
|
|
||||||
|
beforeEach(async () => {
|
||||||
|
di = getDiForUnitTesting({ doGeneralOverrides: true });
|
||||||
|
|
||||||
|
const getRendererExtensionFake = getRendererExtensionFakeFor(applicationBuilder);
|
||||||
|
const extension = getRendererExtensionFake(extensionStubWithWithSameRegisteredTab);
|
||||||
|
const extensionUsingOtherTab = getRendererExtensionFake(extensionUsingSomeoneElseTab);
|
||||||
|
|
||||||
|
applicationBuilder.beforeRender(() => {
|
||||||
|
const extensionRoute = di.inject(extensionPreferencesRouteInjectable);
|
||||||
|
const params = { parameters: {
|
||||||
|
extensionId: "extension-using-someone-else-tab-id",
|
||||||
|
tabId: "metrics-extension-tab",
|
||||||
|
}};
|
||||||
|
|
||||||
|
applicationBuilder.preferences.navigateTo(extensionRoute, params);
|
||||||
|
});
|
||||||
|
|
||||||
|
await applicationBuilder.addExtensions(extension, extensionUsingOtherTab);
|
||||||
|
rendered = await applicationBuilder.render();
|
||||||
|
});
|
||||||
|
|
||||||
|
it("renders", () => {
|
||||||
|
expect(rendered.container).toMatchSnapshot();
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
const extensionStubWithExtensionSpecificPreferenceItems: FakeExtensionData = {
|
const extensionStubWithExtensionSpecificPreferenceItems: FakeExtensionData = {
|
||||||
@ -450,3 +512,21 @@ const extensionStubWithWithSameRegisteredTab: FakeExtensionData = {
|
|||||||
orderNumber: 100,
|
orderNumber: 100,
|
||||||
}],
|
}],
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const extensionUsingSomeoneElseTab: FakeExtensionData = {
|
||||||
|
id: "extension-using-someone-else-tab-id",
|
||||||
|
name: "extension-using-someone-else-tab-id",
|
||||||
|
|
||||||
|
appPreferences: [
|
||||||
|
{
|
||||||
|
title: "My preferences",
|
||||||
|
id: "my-preferences-item-id",
|
||||||
|
showInPreferencesTab: "metrics-extension-tab",
|
||||||
|
|
||||||
|
components: {
|
||||||
|
Hint: () => <div data-testid="my-preferences-item-hint" />,
|
||||||
|
Input: () => <div data-testid="my-preferences-item-input" />,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
};
|
||||||
Loading…
Reference in New Issue
Block a user