DongHyeonka
21f8425f1e
The earlier fix covered the Markdown body and stopped there, so the preview still ran lines together — which is exactly what it looked like from the outside: nothing had changed. Summary, problem, conclusion, environment and the rest are plain text. They never pass through the Markdown parser, so their newlines sit in a text node and HTML collapses them, and the renderer that now emits <br> for the body was never asked about them. They render through the same rule now. One helper, one behaviour: a line the author broke stays broken, wherever they typed it.
56 lines
2.2 KiB
TypeScript
56 lines
2.2 KiB
TypeScript
// @vitest-environment jsdom
|
|
|
|
import { render } from "@testing-library/react";
|
|
import { describe, expect, it } from "vitest";
|
|
|
|
import {
|
|
InlineRenderer,
|
|
PlainText,
|
|
} from "../../src/features/tech-log/presentation/shared/public-render/inline-renderer.tsx";
|
|
|
|
/**
|
|
* 작성자가 엔터로 나눠 쓴 글이 한 줄로 이어져 보였다. Markdown 이 한 번의 줄바꿈을 문단 내 공백으로
|
|
* 읽고, 파서가 그 줄바꿈을 텍스트에 남긴 뒤, HTML 이 다시 공백으로 접기 때문이다. 미리보기와 공개
|
|
* 화면이 같은 렌더러를 쓰므로 두 곳 모두에서 그랬다.
|
|
*/
|
|
describe("문단 안의 줄바꿈", () => {
|
|
it("줄바꿈을 <br> 로 그린다", () => {
|
|
const { container } = render(
|
|
<InlineRenderer content={[{ type: "TEXT", text: "첫째 줄\n둘째 줄" }]} />,
|
|
);
|
|
expect(container.querySelectorAll("br")).toHaveLength(1);
|
|
expect(container.textContent).toBe("첫째 줄둘째 줄");
|
|
});
|
|
|
|
it("줄바꿈이 없으면 <br> 를 넣지 않는다", () => {
|
|
const { container } = render(
|
|
<InlineRenderer content={[{ type: "TEXT", text: "한 줄" }]} />,
|
|
);
|
|
expect(container.querySelectorAll("br")).toHaveLength(0);
|
|
expect(container.textContent).toBe("한 줄");
|
|
});
|
|
|
|
it("여러 번 엔터를 친 만큼 내려간다", () => {
|
|
const { container } = render(
|
|
<InlineRenderer content={[{ type: "TEXT", text: "가\n나\n다" }]} />,
|
|
);
|
|
expect(container.querySelectorAll("br")).toHaveLength(2);
|
|
});
|
|
});
|
|
|
|
/**
|
|
* 요약·문제·결론·환경은 Markdown 을 거치지 않고 그대로 그려진다. 본문만 고쳤을 때 이 칸들이
|
|
* 여전히 이어져 보인 이유이고, 작성자가 "아직 안 고쳐졌다" 고 본 것도 이쪽이다.
|
|
*/
|
|
describe("Markdown 을 거치지 않는 평문 칸", () => {
|
|
it("작성자가 나눠 쓴 줄을 지킨다", () => {
|
|
const { container } = render(<PlainText text={"문제 첫 줄\n문제 둘째 줄"} />);
|
|
expect(container.querySelectorAll("br")).toHaveLength(1);
|
|
});
|
|
|
|
it("한 줄이면 <br> 를 넣지 않는다", () => {
|
|
const { container } = render(<PlainText text="한 줄" />);
|
|
expect(container.querySelectorAll("br")).toHaveLength(0);
|
|
});
|
|
});
|