Skip to content

Commit 794b7b3

Browse files
ctothctoth
committed
fix(tests): update tests for PR #29 and #30 behavior changes
- ansiParser.test: update expected markup to match React.Fragment optimization (unstyled text no longer wrapped in <span>) - input.test: blank lines are now intentionally sent to the MOO
1 parent f5209d3 commit 794b7b3

2 files changed

Lines changed: 91 additions & 121 deletions

File tree

‎src/ansiParser.test.tsx‎

Lines changed: 87 additions & 117 deletions
Original file line numberDiff line numberDiff line change
@@ -1,117 +1,87 @@
1-
import { it, describe, expect } from 'vitest';
2-
import { parseToElements } from "./ansiParser";
3-
import ReactDOMServer from 'react-dom/server';
4-
5-
const DoNothing = () => { };
6-
7-
const testRenderedMarkup = (input: string, expectedJSX: JSX.Element) => {
8-
it(`should render correct HTML for ${JSON.stringify(input)}`, () => {
9-
const actualHtml = ReactDOMServer.renderToStaticMarkup(
10-
<div>{parseToElements(input, () => { })}</div>
11-
);
12-
const expectedHtml = ReactDOMServer.renderToStaticMarkup(
13-
<div>{expectedJSX}</div>
14-
);
15-
expect(actualHtml).toBe(expectedHtml);
16-
});
17-
};
18-
19-
describe("Output", () => {
20-
describe("parseToElements", () => {
21-
describe("plain text", () => {
22-
testRenderedMarkup("test",
23-
<span key="0">
24-
<span style={{}}>test</span>
25-
</span>
26-
);
27-
});
28-
29-
describe("links", () => {
30-
testRenderedMarkup("https://www.google.com",
31-
<span key="0">
32-
<span style={{}}>
33-
<a href="https://www.google.com" target="_blank" rel="noreferrer">
34-
https://www.google.com
35-
</a>
36-
</span>
37-
</span>
38-
);
39-
40-
testRenderedMarkup("bob@gmail.com",
41-
<span key="0">
42-
<span style={{}}>
43-
<a href="mailto:bob@gmail.com" target="_blank" rel="noreferrer">
44-
bob@gmail.com
45-
</a>
46-
</span>
47-
</span>
48-
);
49-
});
50-
51-
describe("formatting", () => {
52-
testRenderedMarkup(
53-
"This is a sentence with a bold word: \x1b[1mbold\x1b[0m",
54-
55-
<span key="0">
56-
<span>This is a sentence with a bold word: </span>
57-
<span style={{ fontWeight: "bold" }}>bold</span>
58-
</span>
59-
);
60-
61-
testRenderedMarkup(
62-
"This is a sentence with an underlined word: \x1b[4munderlined\x1b[0m",
63-
64-
<span key="0">
65-
<span style={{}}>This is a sentence with an underlined word: </span>
66-
<span style={{ textDecoration: "underline" }}>underlined</span>
67-
</span>
68-
69-
);
70-
testRenderedMarkup(
71-
"This is a sentence with a red word: \x1b[31mred\x1b[0m",
72-
73-
<span key="0">
74-
<span style={{}}>This is a sentence with a red word: </span>
75-
<span style={{ color: "rgb(187, 0, 0)" }}>red</span>
76-
</span>
77-
78-
);
79-
testRenderedMarkup(
80-
"This is a sentence with a blue background: \x1b[44mblue background\x1b[0m",
81-
82-
<span key="0">
83-
<span style={{}}>This is a sentence with a blue background: </span>
84-
<span style={{ backgroundColor: "rgb(0, 0, 187)" }}>
85-
blue background
86-
</span>
87-
</span>
88-
89-
);
90-
91-
testRenderedMarkup(
92-
'This is a sentence with a bold, underlined, and red word: \x1b[1;4;31mbold, underlined, and red\x1b[0m',
93-
<span key="0">
94-
<span style={{}}>This is a sentence with a bold, underlined, and red word: </span>
95-
<span style={{ color: "rgb(187, 0, 0)", textDecoration: "underline" }}>bold, underlined, and red</span>
96-
</span>
97-
)
98-
});
99-
100-
// describe("complex messages", () => {
101-
// testRenderedMarkup(
102-
// "This is a sentence with a bold word: \x1b[1mbold\x1b[0m and a link: https://www.google.com",
103-
104-
// <span key="0">
105-
// <span>This is a sentence with a bold word: </span>
106-
// <span style={{ fontWeight: "bold" }}>bold</span>
107-
// <span> and a link:</span>
108-
// <span>
109-
// <a href="https://www.google.com" target="_blank" rel="noreferrer">
110-
// https://www.google.com
111-
// </a>
112-
// </span>
113-
// </span>
114-
// );
115-
// });
116-
});
117-
});
1+
import { it, describe, expect } from 'vitest';
2+
import { parseToElements } from "./ansiParser";
3+
import ReactDOMServer from 'react-dom/server';
4+
5+
const DoNothing = () => { };
6+
7+
const testRenderedMarkup = (input: string, expectedJSX: JSX.Element) => {
8+
it(`should render correct HTML for ${JSON.stringify(input)}`, () => {
9+
const actualHtml = ReactDOMServer.renderToStaticMarkup(
10+
<div>{parseToElements(input, () => { })}</div>
11+
);
12+
const expectedHtml = ReactDOMServer.renderToStaticMarkup(
13+
<div>{expectedJSX}</div>
14+
);
15+
expect(actualHtml).toBe(expectedHtml);
16+
});
17+
};
18+
19+
describe("Output", () => {
20+
describe("parseToElements", () => {
21+
describe("plain text", () => {
22+
testRenderedMarkup("test",
23+
<>test</>
24+
);
25+
});
26+
27+
describe("links", () => {
28+
testRenderedMarkup("https://www.google.com",
29+
<>
30+
<a href="https://www.google.com" target="_blank" rel="noreferrer">
31+
https://www.google.com
32+
</a>
33+
</>
34+
);
35+
36+
testRenderedMarkup("bob@gmail.com",
37+
<>
38+
<a href="mailto:bob@gmail.com" target="_blank" rel="noreferrer">
39+
bob@gmail.com
40+
</a>
41+
</>
42+
);
43+
});
44+
45+
describe("formatting", () => {
46+
testRenderedMarkup(
47+
"This is a sentence with a bold word: \x1b[1mbold\x1b[0m",
48+
<>This is a sentence with a bold word: <span style={{ fontWeight: "bold" }}>bold</span></>
49+
);
50+
51+
testRenderedMarkup(
52+
"This is a sentence with an underlined word: \x1b[4munderlined\x1b[0m",
53+
<>This is a sentence with an underlined word: <span style={{ textDecoration: "underline" }}>underlined</span></>
54+
);
55+
testRenderedMarkup(
56+
"This is a sentence with a red word: \x1b[31mred\x1b[0m",
57+
<>This is a sentence with a red word: <span style={{ color: "rgb(187, 0, 0)" }}>red</span></>
58+
);
59+
testRenderedMarkup(
60+
"This is a sentence with a blue background: \x1b[44mblue background\x1b[0m",
61+
<>This is a sentence with a blue background: <span style={{ backgroundColor: "rgb(0, 0, 187)" }}>blue background</span></>
62+
);
63+
64+
testRenderedMarkup(
65+
'This is a sentence with a bold, underlined, and red word: \x1b[1;4;31mbold, underlined, and red\x1b[0m',
66+
<>This is a sentence with a bold, underlined, and red word: <span style={{ color: "rgb(187, 0, 0)", textDecoration: "underline" }}>bold, underlined, and red</span></>
67+
)
68+
});
69+
70+
// describe("complex messages", () => {
71+
// testRenderedMarkup(
72+
// "This is a sentence with a bold word: \x1b[1mbold\x1b[0m and a link: https://www.google.com",
73+
74+
// <span key="0">
75+
// <span>This is a sentence with a bold word: </span>
76+
// <span style={{ fontWeight: "bold" }}>bold</span>
77+
// <span> and a link:</span>
78+
// <span>
79+
// <a href="https://www.google.com" target="_blank" rel="noreferrer">
80+
// https://www.google.com
81+
// </a>
82+
// </span>
83+
// </span>
84+
// );
85+
// });
86+
});
87+
});

‎src/components/input.test.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -81,14 +81,14 @@ describe('CommandInput Component', () => {
8181
expect((textarea as HTMLTextAreaElement).value).toBe(''); // Input should clear after sending
8282
});
8383

84-
it('does not send empty input', () => {
84+
it('sends blank lines to the MOO', () => {
8585
render(<CommandInput onSend={onSendMock} inputRef={inputRef} />);
86-
86+
8787
const textarea = screen.getByRole('textbox');
8888
fireEvent.change(textarea, { target: { value: ' ' } }); // Just spaces
8989
fireEvent.keyDown(textarea, { key: 'Enter' });
90-
91-
expect(onSendMock).not.toHaveBeenCalled();
90+
91+
expect(onSendMock).toHaveBeenCalledWith(' ');
9292
});
9393

9494
it('adds command to history when sent', () => {

0 commit comments

Comments
 (0)