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:
parent
558b337256
commit
ceafd03308
@ -2084,3 +2084,361 @@ exports[`preferences - navigation to extension specific preferences given in pre
|
||||
/>
|
||||
</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 type { FakeExtensionData } 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", () => {
|
||||
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 = {
|
||||
@ -450,3 +512,21 @@ const extensionStubWithWithSameRegisteredTab: FakeExtensionData = {
|
||||
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