refactor: 편집기 테스트 케이스 순서 변경

[#184]

Co-Authored-By: 박유현 <[email protected]>

packages/frontend/src/components/editor/__tests__/editor.spec.tsx

@@ -122,82 +122,82 @@ describe("Editor", () => {
     });
   });
 
-  describe("입력 모드에서 esc를 누르면", () => {
-    it("편집기는 명령모드로 input은 빈 값이다.", async () => {
+  describe("명령 모드에서 :(콜론)을 누르면 편집기는 라인 모드로 전환되며", () => {
+    it("편집기의 textarea는 입력이 불가능하다.", async () => {
       renderComponent({
         initialFile: mockInitialFileData,
         onSubmit: mockSubmitHandler,
       });
       const $textarea = screen.getByTestId("textarea");
-      const $input = screen.getByTestId("input");
-      await user.type($textarea, "i");
-
-      await user.keyboard("{Escape}");
+      await user.type($textarea, ":");
 
-      expect($input).toHaveValue("");
+      expect($textarea).toHaveValue(mockInitialFileData);
     });
 
-    it("편집기는 명령모드로 textarea에 커서가 포커싱 되어야 한다.", async () => {
+    it("편집기의 input에는 초기값이 :(콜론)으로 들어간다.", async () => {
       renderComponent({
         initialFile: mockInitialFileData,
         onSubmit: mockSubmitHandler,
       });
       const $textarea = screen.getByTestId("textarea");
-      await user.type($textarea, "i");
+      const $input = screen.getByTestId("input");
+      await user.type($textarea, ":");
 
-      await user.keyboard("{Escape}");
-      expect(document.activeElement).toEqual($textarea);
+      expect($input).toHaveValue(":");
     });
 
-    it("편집기는 명령모드로 textarea에 입력이 되지 않는다.", async () => {
+    it("편집기의 input에 포커싱이 맞춰진다.", async () => {
       renderComponent({
         initialFile: mockInitialFileData,
         onSubmit: mockSubmitHandler,
       });
       const $textarea = screen.getByTestId("textarea");
-      await user.type($textarea, "i");
-
-      await user.keyboard("{Escape}");
+      const $input = screen.getByTestId("input");
+      await user.type($textarea, ":");
 
-      await user.type($textarea, "테스트");
-      expect($textarea).toHaveValue(mockInitialFileData);
+      expect(document.activeElement).toEqual($input);
     });
   });
 
-  describe("명령 모드에서 :(콜론)을 누르면 편집기는 라인 모드로 전환되며", () => {
-    it("편집기의 textarea는 입력이 불가능하다.", async () => {
+  describe("입력 모드에서 esc를 누르면", () => {
+    it("편집기는 명령모드로 input은 빈 값이다.", async () => {
       renderComponent({
         initialFile: mockInitialFileData,
         onSubmit: mockSubmitHandler,
       });
       const $textarea = screen.getByTestId("textarea");
-      await user.type($textarea, ":");
+      const $input = screen.getByTestId("input");
+      await user.type($textarea, "i");
 
-      expect($textarea).toHaveValue(mockInitialFileData);
+      await user.keyboard("{Escape}");
+
+      expect($input).toHaveValue("");
     });
 
-    it("편집기의 input에는 초기값이 :(콜론)으로 들어간다.", async () => {
+    it("편집기는 명령모드로 textarea에 커서가 포커싱 되어야 한다.", async () => {
       renderComponent({
         initialFile: mockInitialFileData,
         onSubmit: mockSubmitHandler,
       });
       const $textarea = screen.getByTestId("textarea");
-      const $input = screen.getByTestId("input");
-      await user.type($textarea, ":");
+      await user.type($textarea, "i");
 
-      expect($input).toHaveValue(":");
+      await user.keyboard("{Escape}");
+      expect(document.activeElement).toEqual($textarea);
     });
 
-    it("편집기의 input에 포커싱이 맞춰진다.", async () => {
+    it("편집기는 명령모드로 textarea에 입력이 되지 않는다.", async () => {
       renderComponent({
         initialFile: mockInitialFileData,
         onSubmit: mockSubmitHandler,
       });
       const $textarea = screen.getByTestId("textarea");
-      const $input = screen.getByTestId("input");
-      await user.type($textarea, ":");
+      await user.type($textarea, "i");
 
-      expect(document.activeElement).toEqual($input);
+      await user.keyboard("{Escape}");
+
+      await user.type($textarea, "테스트");
+      expect($textarea).toHaveValue(mockInitialFileData);
     });
   });