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