docusaurus/packages/docusaurus-theme-common/src/utils/__tests__/tocUtils.test.ts
Erick Zhao c86dfbda61
feat(v2): allow specifying TOC max depth (themeConfig + frontMatter) (#5578)
* feat: add all TOC levels to MDX loader

* feat: add theme-level config for heading depth

* test: add remark MDX loader test

* fix: limit maxDepth validation to H2 - H6

* refactor: set default `maxDepth` using `joi`

* refactor: `maxDepth` -> `maxHeadingLevel

* refactor: invert underlying TOC depth API

* refactor: make TOC algorithm level-aware

* feat: add support for per-doc TOC heading levels

* feat: support document-level heading levels for blog

* fix: correct validation for toc level frontmatter

* fix: ensure TOC doesn't generate redundant DOM

* perf: simpler TOC heading search alg

* docs: document heading level props for `TOCInline`

* Update website/docs/guides/markdown-features/markdown-features-inline-toc.mdx

Co-authored-by: HonkingGoose <34918129+HonkingGoose@users.noreply.github.com>

* docs: fix docs (again)

* create dedicated  test file for heading searching logic: exhaustive tests will be simpler to write

* toc search: add real-world test

* fix test

* add dogfooding tests for toc min/max

* add test for min/max toc frontmatter

* reverse min/max order

* add theme minHeadingLevel + tests

* simpler TOC rendering logic

* simplify TOC implementation (temp, WIP)

* reverse unnatural order for minHeadingLevel/maxHeadingLevel

* add TOC dogfooding tests to all content plugins

* expose toc min/max heading level frontmatter to all 3 content plugins

* refactor blogLayout: accept toc ReactElement directly

* move toc utils to theme-common

* add tests for filterTOC

* create new generic TOCItems component

* useless css file copied

* fix toc highlighting className conflicts

* update doc

* fix types

Co-authored-by: HonkingGoose <34918129+HonkingGoose@users.noreply.github.com>
Co-authored-by: slorber <lorber.sebastien@gmail.com>
2021-09-29 11:19:11 +02:00

197 lines
4.4 KiB
TypeScript

/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
import {TOCItem} from '@docusaurus/types';
import {filterTOC} from '../tocUtils';
describe('filterTOC', () => {
test('filter a toc with all heading levels', () => {
const toc: TOCItem[] = [
{
id: 'alpha',
level: 1,
value: 'alpha',
children: [
{
id: 'bravo',
level: 2,
value: 'Bravo',
children: [
{
id: 'charlie',
level: 3,
value: 'Charlie',
children: [
{
id: 'delta',
level: 4,
value: 'Delta',
children: [
{
id: 'echo',
level: 5,
value: 'Echo',
children: [
{
id: 'foxtrot',
level: 6,
value: 'Foxtrot',
children: [],
},
],
},
],
},
],
},
],
},
],
},
];
expect(filterTOC({toc, minHeadingLevel: 2, maxHeadingLevel: 2})).toEqual([
{
id: 'bravo',
level: 2,
value: 'Bravo',
children: [],
},
]);
expect(filterTOC({toc, minHeadingLevel: 3, maxHeadingLevel: 3})).toEqual([
{
id: 'charlie',
level: 3,
value: 'Charlie',
children: [],
},
]);
expect(filterTOC({toc, minHeadingLevel: 2, maxHeadingLevel: 3})).toEqual([
{
id: 'bravo',
level: 2,
value: 'Bravo',
children: [
{
id: 'charlie',
level: 3,
value: 'Charlie',
children: [],
},
],
},
]);
expect(filterTOC({toc, minHeadingLevel: 2, maxHeadingLevel: 4})).toEqual([
{
id: 'bravo',
level: 2,
value: 'Bravo',
children: [
{
id: 'charlie',
level: 3,
value: 'Charlie',
children: [
{
id: 'delta',
level: 4,
value: 'Delta',
children: [],
},
],
},
],
},
]);
});
// It's not 100% clear exactly how the TOC should behave under weird heading levels provided by the user
// Adding a test so that behavior stays the same over time
test('filter invalid heading levels (but possible) TOC', () => {
const toc: TOCItem[] = [
{
id: 'charlie',
level: 3,
value: 'Charlie',
children: [],
},
{
id: 'bravo',
level: 2,
value: 'Bravo',
children: [
{
id: 'delta',
level: 4,
value: 'Delta',
children: [],
},
],
},
];
expect(filterTOC({toc, minHeadingLevel: 2, maxHeadingLevel: 2})).toEqual([
{
id: 'bravo',
level: 2,
value: 'Bravo',
children: [],
},
]);
expect(filterTOC({toc, minHeadingLevel: 3, maxHeadingLevel: 3})).toEqual([
{
id: 'charlie',
level: 3,
value: 'Charlie',
children: [],
},
]);
expect(filterTOC({toc, minHeadingLevel: 4, maxHeadingLevel: 4})).toEqual([
{
id: 'delta',
level: 4,
value: 'Delta',
children: [],
},
]);
expect(filterTOC({toc, minHeadingLevel: 2, maxHeadingLevel: 3})).toEqual([
{
id: 'charlie',
level: 3,
value: 'Charlie',
children: [],
},
{
id: 'bravo',
level: 2,
value: 'Bravo',
children: [],
},
]);
expect(filterTOC({toc, minHeadingLevel: 3, maxHeadingLevel: 4})).toEqual([
{
id: 'charlie',
level: 3,
value: 'Charlie',
children: [],
},
{
id: 'delta',
level: 4,
value: 'Delta',
children: [],
},
]);
});
});