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

Cleaning up

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2021-03-12 09:58:14 +03:00
parent 7d9317bdae
commit f7c4d4cf64
2 changed files with 18 additions and 17 deletions

View File

@ -39,11 +39,11 @@ describe("<ScrollSpy/>", () => {
expect(observe).toHaveBeenCalled();
});
it("renders navigation component", async () => {
const { queryByTestId } = render(<ScrollSpy render={navigation => (
it("renders dataTree component", async () => {
const { queryByTestId } = render(<ScrollSpy render={dataTree => (
<div>
<nav>
<RecursiveTreeView data={navigation}/>
<RecursiveTreeView data={dataTree}/>
</nav>
<section id="application">
<h1>Application</h1>
@ -74,12 +74,12 @@ describe("<ScrollSpy/>", () => {
});
describe("<TreeView/> navigation inside <ScrollSpy/>", () => {
describe("<TreeView/> dataTree inside <ScrollSpy/>", () => {
it("contains links to all sections", async () => {
const { queryByTitle } = render(<ScrollSpy render={navigation => (
const { queryByTitle } = render(<ScrollSpy render={dataTree => (
<div>
<nav>
<RecursiveTreeView data={navigation}/>
<RecursiveTreeView data={dataTree}/>
</nav>
<section id="application">
<h1>Application</h1>
@ -102,10 +102,10 @@ describe("<TreeView/> navigation inside <ScrollSpy/>", () => {
});
it("not showing links to sections without id", async () => {
const { queryByTitle } = render(<ScrollSpy render={navigation => (
const { queryByTitle } = render(<ScrollSpy render={dataTree => (
<div>
<nav>
<RecursiveTreeView data={navigation}/>
<RecursiveTreeView data={dataTree}/>
</nav>
<section id="application">
<h1>Application</h1>
@ -127,10 +127,10 @@ describe("<TreeView/> navigation inside <ScrollSpy/>", () => {
});
it("expands parent sections", async () => {
const { queryByTitle } = render(<ScrollSpy render={navigation => (
const { queryByTitle } = render(<ScrollSpy render={dataTree => (
<div>
<nav>
<RecursiveTreeView data={navigation}/>
<RecursiveTreeView data={dataTree}/>
</nav>
<section id="application">
<h1>Application</h1>
@ -160,10 +160,10 @@ describe("<TreeView/> navigation inside <ScrollSpy/>", () => {
});
it("skips sections without headings", async () => {
const { queryByTitle } = render(<ScrollSpy render={navigation => (
const { queryByTitle } = render(<ScrollSpy render={dataTree => (
<div>
<nav>
<RecursiveTreeView data={navigation}/>
<RecursiveTreeView data={dataTree}/>
</nav>
<section id="application">
<h1>Application</h1>

View File

@ -7,6 +7,12 @@ interface Props extends React.DOMAttributes<HTMLElement> {
rootMargin?: string // https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#creating_an_intersection_observer
}
ScrollSpy.defaultProps = {
// Shrinking root area from the bottom
// Allows to fire observer event only if target scrolled up to top of the page)
rootMargin: "0px 0px -85%"
};
export function ScrollSpy(props: Props) {
const parent = useRef<HTMLDivElement>();
const sections = useRef<NodeListOf<HTMLElement>>();
@ -93,8 +99,3 @@ export function ScrollSpy(props: Props) {
);
}
ScrollSpy.defaultProps = {
// Shrinking root area from the bottom
// Allows to fire observer event only if target scrolled up to top of the page)
rootMargin: "0px 0px -85%"
};