MUI2

• 

  MUI-Stack, Box, sx(스타일링) 적용에 대한 고찰 display : flex 먹힌 Box 라고 보면 된다. Stack 이나 Box나 다 div 로 치환된다. sx 로 style을 먹이면, css는 css module 형태로 적용되어 css 중첩을 방지시킨다. MUI 꽤 좋아진 거 같다. React & TypeScript/React 2024. 2. 22.

• 

  [React / Test] Material UI (mui) + React + Testing Library 적용 간 어려운 점 회고 Render 관련 코드 구조 describe("Application 테스트", () => { it("Application - UI Test ", () => { render( , { wrapper: MemoryRouter } ); // ... material UI 특성상 theme 가 구동되기 때문에 ThemeProvider 를 감싸줘야 한다. (참고 : Custom Render - 아예 test-util을 만들어서 wrapping 하는 방법도 있다.) FetchProvider 도 감싸줘야 하며, Application 내부에서 match.params.id 를 사용하는데, 페이지를 전환하면서 전달한 게 아니라서, 임의로 props로 match 객체처럼 보여지게끔 전달해서 해결했다. Provider들을 감싸는.. React & TypeScript/React 2022. 6. 22.