inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

172만명의 커뮤니티!! 함께 토론해봐요.

Interaction 테스트 강의 설치 문제

해결됨

실무에 바로 적용하는 스토리북과 UI 테스트

안녕하세요. 이전글에 이어서 Interaction 테스트를 하는 과정에서 발생한 이슈 공유드립니다. [명령어가 다른 문제] 확인해보시면 아시겠지만, Interaction 테스트를 위해 강의에서 설치한 명령어와 현재 공식문서에 작성되어있는 명령어가 다릅니다. 강의: @storybook/jest, @storybook/testing-library 문서: @storybook/test 설치항목이 줄어들었지만, 최신화된 공식문서의 내용을 따라가도 정상적으로 동작함을 확인했습니다. [스토리북 실행시 에러 발생] No matching export in "global-externals:@storybook/components 스토리북을 실행하면 상단에 작성한 문제가 발생할 수 있는데, 저의 경우에는 .nodemodules 디렉토리를 삭제하고 @storybook/components @storybook/addons 먼저 설치한 후 다시 공식문서에서 제공하는 명령어를 통해 설치하여 해결했습니다. 하단의 링크를 참고하시면 됩니다. https://github.com/storybookjs/storybook/issues/24906 (+추가적으로 @storybook/vue3 를 설치해야 Meta, StoryObj를 불러올 수 있습니다.) [스토리북 테스트 실패] LoginForm 컴포넌트와 스토리를 만드는 과정에서 코드를 복사하여 가져올 때, EmptyForm과 FilledForm의 render 부분을 주석처리해야 테스트가 통과됨을 확인했습니다.

  • react
  • typescript
  • tailwind-css
  • storybook
  • ui-testing
seungseopahn 댓글 1 좋아요 0 조회수 318

스토리북 테스트 실패 및 워크플로우 무기한 중단 문제 (Accessibility 테스트 강의)

해결됨

실무에 바로 적용하는 스토리북과 UI 테스트

안녕하세요. 제가 강의에서 놓친 부분일 수도 있겠지만, 스토리북 테스트 실패 및 워크플로우 무기한 중단 문제에 대해서 제가 해결한 방법을 공유드립니다. [노드 버전] 상단의 이미지처럼 워크플로우가 돌아가면서 노드 버전으로 인해 발생한 문제는 .nvmrc 파일에 작성된 노드버전을 조정하여 해결했습니다. (저의 경우에는 18.18.0) [워크플로우] 상단의 이미지는 워크플로우가 다음 단계로 넘어가지 않아 직접 워크플로우를 취소한 화면인데, 이 문제는 워크플로우의 스크립트를 수정하여 해결했습니다. npx wait-on tcp:127.0.0.1:6006 && yarn test-storybook 해당 문제는 노드 버전으로 인해 발생된 것으로 보이며, 자세한 내용은 하단의 링크를 통해 확인하실 수 있습니다. https://github.com/storybookjs/test-runner/issues/301 [스토리북 테스트 실패] 스토리북 테스트 명령어를 로컬에서 돌릴 경우, 강의를 따라가면서 생성한 스토리들과 컴포넌트에서는 문제가 없었으나, Header, Page, LoggedIn(Smoke-test), LoggedOut(Smoke-test)... 위와 같은 파일들에서 문제가 발생하는데, 해당 파일들을 모두 삭제하여 해결했습니다.

  • react
  • typescript
  • tailwind-css
  • storybook
  • ui-testing
seungseopahn 댓글 1 좋아요 1 조회수 395

스토리 제작할 때 궁금한 점

해결됨

실무에 바로 적용하는 스토리북과 UI 테스트

metadata의 argTypes를 작성한 것들을 스토리의 전달 인자에 다 작성하는 걸로 알고 있었는데, 이벤트 핸들러를 작성하지 않아도 되는 이유를 알고 싶습니다. 그리고 왜 저는 이벤트 핸들러를 작성하지 않으면 오류가 나는지 궁금합니다.

  • react
  • typescript
  • tailwind-css
  • storybook
  • ui-testing
조진형 댓글 1 좋아요 1 조회수 420

스토리북 실행이 잘 안됩니다. ㅠㅠ

미해결

실무에 바로 적용하는 스토리북과 UI 테스트

강의 초반, 스토리북 설치를 하는데 npx storybook@latest init 명령어를 치면 스토리북이 열리긴 하는데 로딩이 멈추질 않습니다. ㅠㅠ 오류 메시지는 아래와 같이 나옵니다. 열심히 구글링도 해봤지만 해결책을 찾지 못했습니다.

  • react
  • typescript
  • tailwind-css
  • storybook
  • ui-testing
조진형 댓글 3 좋아요 2 조회수 788

첨부파일 누락확인

미해결

Tailwind CSS로 만드는 멋진 웹 UI 스타일링

[다운로드]+Tailwind+CSS(v3.4.1)+이론+및+실전+예제+ 완성본.zip 파일을 다운로드 받았는데, 강의내용과 폴더안의 파일이 다른것같습니다. 확인부탁드립니다.

  • HTML/CSS
  • 반응형-웹
  • tailwind-css
댓글 2 좋아요 1 조회수 490

인기 태그

인프런 TOP Writers

주간 인기글