Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(fe): implement test in code editor #2093

Merged
merged 22 commits into from
Oct 6, 2024

Conversation

B0XERCAT
Copy link
Member

@B0XERCAT B0XERCAT commented Sep 17, 2024

Description

  • TestResultsStore를 생성했고, EditorHeader에 있는 Test 버튼을 누르면, 작성한 코드에 대한 결과 (테스트케이스별 결과) 가 로컬스토리지에 저장됩니다.
    • 코드를 POST하고 모든 테스트케이스에 대해 Judging이 아닌 결과가 나올 때까지 2초마다 GET 요청을 보냅니다.
    • 현재 10번까지 요청을 보내도 Judging이 안 끝나면 토스트를 띄우게 했으나 횟수를 더 늘려도 괜찮을 것 같습니다.
  • TestcasePanel을 구현했고, 테이블에서 각 row를 클릭하면 Panel 안에서 새 탭이 열리면서 테스트 결과에 대한 detail을 확인할 수 있습니다.

image
테이블의 row를 클릭해서 생성된 tab입니다
image
tab이 여러개 생성되었을 때의 UI입니다
image

추가 수정 사항!

  • 테이블 내에서 input / output 이 길어지면 ...이 붙도록 수정했습니다
  • 패널 아래쪽에 패딩을 추가해서 스크롤 했을 때 마지막 row까지 보이도록 수정했습니다
    image
  • Result Detail에서도 가로로 길어지면 텍스트가 삐져 나갔는데 수정 완료했습니다
    image

Closes TAS-536

Additional context


Before submitting the PR, please make sure you do the following

Copy link

Copy link

vercel bot commented Sep 17, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated (UTC)
codedang ✅ Ready (Inspect) Visit Preview Oct 5, 2024 3:58pm

@B0XERCAT B0XERCAT changed the title T536 implement test in code editor feat(fe): implement test in code editor Sep 17, 2024
@B0XERCAT B0XERCAT marked this pull request as ready for review September 19, 2024 06:33
@Jaehyeon1020
Copy link
Member

스테이지 배포 환경에서도 수정한 TEST API 잘 작동하는지 보려고 update branch 했어요!

@jimin9038
Copy link
Member

coolify 배포를 위해서 닫았다가 열게요.

@jimin9038 jimin9038 closed this Sep 26, 2024
@jimin9038 jimin9038 reopened this Sep 26, 2024
@coolify-skkuding
Copy link

coolify-skkuding bot commented Sep 26, 2024

The preview deployment is ready. 🟢

Open Preview | Open Build Logs

Last updated at: 2024-10-01 15:28:41 CET

Copy link
Contributor

@eunnbi eunnbi left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  1. 테스트 케이스 결과 패널에서 스크롤 다 내려도 끝까지 다 안보여요
image
  1. 테이블 내에 긴 인풋이 있는 경우 다른 컬럼이 안 보여요
image

Copy link

@B0XERCAT B0XERCAT merged commit 6ec6c5b into main Oct 6, 2024
15 checks passed
@B0XERCAT B0XERCAT deleted the t536-implement-test-in-code-editor branch October 6, 2024 00:27
mnseok pushed a commit that referenced this pull request Nov 12, 2024
* feat(fe): add test button, implement poll request

* feat(fe): implement testcase panel with dummy data

* chore(fe): edit table row style

* feat(fe): store test result

* chore(fe): delete console.log

* feat(fe): show wrong testcase numbers, adjust table style

* feat(fe): implement testcase tabs

* feat(fe): edit tab style

* feat(fe): implement test result detail

* feat(fe): implement delete tab button

* fix(fe): fix testcase tab style

* refactor(fe): componentize TestcaseTab TestSummary TestResultDetail

* feat(fe): add output in testcase result

* chore(fe): specify type statement

Co-authored-by: Eunbi Kang <[email protected]>

* chore(fe): execute prettier

* chore(fe): add padding bottom to panel, add ellipsis to long input output

* chore(fe): add pre wrap for labeled field

* chore(fe): simplify long styles using truncate

---------

Co-authored-by: Jaehyeon Kim <[email protected]>
Co-authored-by: Eunbi Kang <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
Status: Done ✔️
Development

Successfully merging this pull request may close these issues.

4 participants