1
0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00

Fix CPU spike when opening PodDetails from MonacoEditor (#5642)

This commit is contained in:
Sebastian Malton 2022-08-02 09:41:23 -07:00 committed by GitHub
parent 83232440dc
commit 95ed0dda1b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 199 additions and 2 deletions

View File

@ -0,0 +1,134 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`<DrawerParamToggler /> after clicking the toggle after clicking the toggle again renders 1`] = `
<body>
<div>
<div
class="DrawerParamToggler"
>
<div
class="flex gaps align-center params"
>
<div
class="param-label"
>
Foo
</div>
<div
class="param-link"
data-testid="drawer-param-toggler"
>
<span
class="param-link-text"
>
Show
</span>
<i
class="Icon material focusable"
>
<span
class="icon"
data-icon-name="arrow_drop_down"
>
arrow_drop_down
</span>
</i>
</div>
</div>
<div
class="param-content"
/>
</div>
</div>
</body>
`;
exports[`<DrawerParamToggler /> after clicking the toggle renders 1`] = `
<body>
<div>
<div
class="DrawerParamToggler"
>
<div
class="flex gaps align-center params"
>
<div
class="param-label"
>
Foo
</div>
<div
class="param-link"
data-testid="drawer-param-toggler"
>
<span
class="param-link-text"
>
Hide
</span>
<i
class="Icon material focusable"
>
<span
class="icon"
data-icon-name="arrow_drop_up"
>
arrow_drop_up
</span>
</i>
</div>
</div>
<div
class="param-content open"
>
<div
data-testid="drawer-child"
/>
</div>
</div>
</div>
</body>
`;
exports[`<DrawerParamToggler /> renders 1`] = `
<body>
<div>
<div
class="DrawerParamToggler"
>
<div
class="flex gaps align-center params"
>
<div
class="param-label"
>
Foo
</div>
<div
class="param-link"
data-testid="drawer-param-toggler"
>
<span
class="param-link-text"
>
Show
</span>
<i
class="Icon material focusable"
>
<span
class="icon"
data-icon-name="arrow_drop_down"
>
arrow_drop_down
</span>
</i>
</div>
</div>
<div
class="param-content"
/>
</div>
</div>
</body>
`;

View File

@ -0,0 +1,59 @@
/**
* Copyright (c) OpenLens Authors. All rights reserved.
* Licensed under MIT License. See LICENSE in root directory for more information.
*/
import type { RenderResult } from "@testing-library/react";
import { render } from "@testing-library/react";
import React from "react";
import { DrawerParamToggler } from "./drawer-param-toggler";
describe("<DrawerParamToggler />", () => {
let result: RenderResult;
beforeEach(() => {
result = render((
<DrawerParamToggler
label="Foo"
>
<div data-testid="drawer-child"></div>
</DrawerParamToggler>
));
});
it("renders", () => {
expect(result.baseElement).toMatchSnapshot();
});
it("does not render children by default", () => {
expect(result.queryByTestId("drawer-child")).toBeNull();
});
describe("after clicking the toggle", () => {
beforeEach(() => {
result.getByTestId("drawer-param-toggler").click();
});
it("renders", () => {
expect(result.baseElement).toMatchSnapshot();
});
it("renders children", () => {
expect(result.queryByTestId("drawer-child")).not.toBeNull();
});
describe("after clicking the toggle again", () => {
beforeEach(() => {
result.getByTestId("drawer-param-toggler").click();
});
it("renders", () => {
expect(result.baseElement).toMatchSnapshot();
});
it("does not children", () => {
expect(result.queryByTestId("drawer-child")).toBeNull();
});
});
});
});

View File

@ -33,13 +33,17 @@ export class DrawerParamToggler extends React.Component<DrawerParamTogglerProps,
<div className="DrawerParamToggler">
<div className="flex gaps align-center params">
<div className="param-label">{label}</div>
<div className="param-link" onClick={this.toggle}>
<div
className="param-link"
onClick={this.toggle}
data-testid="drawer-param-toggler"
>
<span className="param-link-text">{link}</span>
<Icon material={icon}/>
</div>
</div>
<div className={cssNames("param-content", { open })}>
{children}
{open && children}
</div>
</div>
);