CK에디터2 CKeditor 리액트에서 테스트 코드짜기[20221110-TIL] 외부 라이브러리는 어떻게 테스트 코드를 짤까? CKeditor라는 외부 라이브러리를 사용했는데 이걸 대체 어떻게 테스트 코드를 짜나... 고민했다. 트레이너 님에게 물어보니 외부 라이브러리는 그냥 그 자체에게 맡기고 테스트 코드를 따로 작성하지 않는다고 한다. 그럼 어떻게 mocking을 해 올 수 있을까?? 컴포넌트는 결국 함수다 컴포넌트는 결국 함수기 때문에 라이브러리를 불러온 위치를 써주고 jest.fn()으로 정의 내려 주었다. import { CKEditor } from '@ckeditor/ckeditor5-react'; import ClassicEditor from '@ckeditor/ckeditor5-build-classic'; jest.mock('@ckeditor/ckeditor5-reac.. 2022. 11. 10. 리액트에서 CK에디터 구현하기 1.[20221105 TIL] 게시판기능을 만들다 그냥 너무 심심한 게시판 등록글은 별로라서 에디터를 검색하다 CK 에디터가 무난하게 맘에 들었다. 근데 공식문서를 읽어보니 꽤...복잡하다... CK에디터 구현 고민 포인트 1. 어떻게 적용하나?? 아래와 같이 구현했는데 CK 에디터 공식홈페이지를 가면 Class 로 구현을 해놓아서 어떻게 적용해야하나 고민을 했었다. 또 방법도 여러가지인데다 리액트에 적용하는 방법은 달라서 잠시 혼선이 왔지만 일단 손을 움직이자 하면서 적용한 결과 아래와 같이 나왔다. id 와 type name 그리고 label 을 따로 추가해주었다. 그리고 처음에는 리액트 훅 폼으로 폼을 처리해주다가 다시 변수를 하나씩 전달해되 리덕스 구조를 지키면서 해주려니 기억이 잘 안났다.(이전 코드를 참고하면 구현은 했지만.. 2022. 11. 5. 이전 1 다음
