xref: /expo/docs/components/base/code.test.tsx (revision 46dc8e76) 
1import { cleanCopyValue } from './code';
2
3describe('cleanCopyValue', () => {
4  it('SlashComments - preserves the fully annotated line', () => {
5    expect(
6      cleanCopyValue(
7        `/* @info Import FontAwesome. */import FontAwesome from "@expo/vector-icons/FontAwesome";/* @end */`
8      )
9    ).toBe(`import FontAwesome from "@expo/vector-icons/FontAwesome";`);
10  });
11
12  it('SlashComments - removes the annotation mid-line', () => {
13    expect(
14      cleanCopyValue(
15        `export default function Button({ label,/* @info The prop theme to detect the button variant. */ theme/* @end */ }) {`
16      )
17    ).toBe(`export default function Button({ label, theme }) {`);
18  });
19
20  it('SlashComments - preserves the line wrapped with annotations', () => {
21    expect(
22      cleanCopyValue(
23        `        /* @info This text will be shown onHover */
24        return x + 1;
25        /* @end */`
26      )
27    ).toBe(`        return x + 1;`);
28  });
29
30  it('SlashComments - removes @hide line', () => {
31    expect(
32      cleanCopyValue(`const styles = StyleSheet.create({
33  /* @hide // Styles that are unchanged from previous step are hidden for brevity. */
34  container: {`)
35    ).toBe(`const styles = StyleSheet.create({
36  container: {`);
37  });
38
39  it('SlashComments - removes annotation with # in content', () => {
40    expect(
41      cleanCopyValue(`    /* @info Replace the default value of backgroundColor property with '#25292e'. */
42    backgroundColor: '#25292e',
43    /* @end */`)
44    ).toBe(`    backgroundColor: '#25292e',`);
45  });
46
47  it('HashComments - preserves the fully annotated line', () => {
48    expect(
49      cleanCopyValue(
50        `# @info Import FontAwesome. #import FontAwesome from "@expo/vector-icons/FontAwesome";# @end #`
51      )
52    ).toBe(`import FontAwesome from "@expo/vector-icons/FontAwesome";`);
53  });
54
55  it('HashComments - removes the annotation mid-line', () => {
56    expect(
57      cleanCopyValue(
58        `export default function Button({ label,# @info The prop theme to detect the button variant. # theme# @end # }) {`
59      )
60    ).toBe(`export default function Button({ label, theme }) {`);
61  });
62
63  it('HashComments - preserves the line wrapped with annotations', () => {
64    expect(
65      cleanCopyValue(
66        `        # @info This text will be shown onHover #
67        return x + 1;
68        # @end #`
69      )
70    ).toBe(`        return x + 1;`);
71  });
72
73  it('HashComments - removes @hide line', () => {
74    expect(
75      cleanCopyValue(`const styles = StyleSheet.create({
76  # @hide // Styles that are unchanged from previous step are hidden for brevity. #
77  container: {`)
78    ).toBe(`const styles = StyleSheet.create({
79  container: {`);
80  });
81
82  it('XMLComments - preserves the fully annotated line', () => {
83    expect(
84      cleanCopyValue(
85        `<!-- @info Import FontAwesome. -->import FontAwesome from "@expo/vector-icons/FontAwesome";<!-- @end -->`
86      )
87    ).toBe(`import FontAwesome from "@expo/vector-icons/FontAwesome";`);
88  });
89
90  it('XMLComments - removes the annotation mid-line', () => {
91    expect(
92      cleanCopyValue(
93        `export default function Button({ label,<!-- @info The prop theme to detect the button variant. --> theme<!-- @end --> }) {`
94      )
95    ).toBe(`export default function Button({ label, theme }) {`);
96  });
97
98  it('XMLComments - preserves the line wrapped with annotations', () => {
99    expect(
100      cleanCopyValue(
101        `        <!-- @info This text will be shown onHover -->
102        return x + 1;
103        <!-- @end -->`
104      )
105    ).toBe(`        return x + 1;`);
106  });
107
108  it('XMLComments - removes @hide line', () => {
109    expect(
110      cleanCopyValue(`const styles = StyleSheet.create({
111  <!-- @hide // Styles that are unchanged from previous step are hidden for brevity. -->
112  container: {`)
113    ).toBe(`const styles = StyleSheet.create({
114  container: {`);
115  });
116});
117