1import { spacing } from '@expo/styleguide-base';
2import { render, screen } from '@testing-library/react';
3
4import { getHeadingIndent, getHeadingInfo } from './TableOfContents';
5
6describe(getHeadingIndent, () => {
7  const paddingFactor = spacing[2];
8
9  // This shouldn't be included in the table of contents, but it's nice to test anyways
10  it('returns no padding for h1 heading', () => {
11    expect(getHeadingIndent(makeHeading('h1'))).toHaveProperty('paddingLeft', 0);
12  });
13
14  it('returns no padding for h2 heading', () => {
15    expect(getHeadingIndent(makeHeading('h2'))).toHaveProperty('paddingLeft', 0);
16  });
17
18  it('returns 1x padding for h3 heading', () => {
19    expect(getHeadingIndent(makeHeading('h3'))).toHaveProperty('paddingLeft', paddingFactor);
20  });
21
22  it('returns 2x padding for h4 heading', () => {
23    expect(getHeadingIndent(makeHeading('h4'))).toHaveProperty('paddingLeft', paddingFactor * 2);
24  });
25
26  it('returns 3x padding for h5 heading', () => {
27    expect(getHeadingIndent(makeHeading('h5'))).toHaveProperty('paddingLeft', paddingFactor * 3);
28  });
29
30  it('returns 4x padding for h6 heading', () => {
31    expect(getHeadingIndent(makeHeading('h6'))).toHaveProperty('paddingLeft', paddingFactor * 4);
32  });
33});
34
35describe(getHeadingInfo, () => {
36  it('returns normal text from h1 heading', () => {
37    expect(getHeadingInfo(makeHeading('h1', 'Hello'))).toMatchObject({
38      type: 'text',
39      text: 'Hello',
40    });
41  });
42
43  it('returns normal text from h2 heading', () => {
44    expect(getHeadingInfo(makeHeading('h2', 'Hello World'))).toMatchObject({
45      type: 'text',
46      text: 'Hello World',
47    });
48  });
49
50  it('returns normal text from h3 heading with platform specification', () => {
51    expect(getHeadingInfo(makeHeading('h3', 'Cool stuff (Android only)'))).toMatchObject({
52      type: 'text',
53      text: 'Cool stuff (Android only)',
54    });
55  });
56
57  it('returns code text from h4 heading with function name', () => {
58    expect(getHeadingInfo(makeHeading('h4', 'getCoolStuffAsync()'))).toMatchObject({
59      type: 'code',
60      text: 'getCoolStuffAsync',
61    });
62  });
63
64  it('returns code text from h5 heading with function name and args', () => {
65    expect(getHeadingInfo(makeHeading('h5', 'getTransformAsync(input: string)'))).toMatchObject({
66      type: 'code',
67      text: 'getTransformAsync',
68    });
69  });
70
71  it('returns code text from h6 heading with function name, args, and return type', () => {
72    expect(
73      getHeadingInfo(makeHeading('h6', 'getTransformAsync(input: string): Promise<string>'))
74    ).toMatchObject({
75      type: 'code',
76      text: 'getTransformAsync',
77    });
78  });
79});
80
81function makeHeading(Tag: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6', text = 'Hello World') {
82  render(<Tag data-testid="heading">{text}</Tag>);
83  return screen.getByTestId('heading') as HTMLHeadingElement;
84}
85