레이블이 wevre인 게시물을 표시합니다. 모든 게시물 표시
레이블이 wevre인 게시물을 표시합니다. 모든 게시물 표시

2/16/2024

MongoDB와 E2E 테스트

E2E 테스트를 작성하고 실행했는데 이상하게 연결 오류가 발생했다. 연결 후 데이터베이스 정리 코드를 찾은 다음 다시 테스트를 했는데 다른 오류가 등장했다. Mongoose는 TypeORM과 다른 점이 많아서 이에 대해 적어본다!


데이터베이스 연결

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
describe('Authentication E2E Test', () => {
  let app: INestApplication;
  let createUserDto: CreateUserDto;
  let credentials: {
    email: string;
    password: string;
  };
 
  beforeEach(async () => {
    createUserDto = {
      name'가나다',
      password: '1234Aa!@',
      email: 'ganada@naver.com',
      role: Role.USER,
    };
 
    credentials = {
      email: 'ganada@naver.com',
      password: '1234Aa!@',
    };
 
    const moduleFixture: TestingModule = await Test.createTestingModule({
      imports: [AppModule],
    }).compile();
 
    app = moduleFixture.createNestApplication();
    await app.init();
  });
 
  describe('signUp', () => {
    it('should throw BadRequestException for an invalid name.', async () => {
      createUserDto.name = '가나';
 
      await request(app.getHttpServer())
        .post('/auth/signup')
        .send(createUserDto)
        .expect(HttpStatus.BAD_REQUEST);
    });
 
    it('should throw BadRequestException for an invalid password.', async () => {
      createUserDto.password = '1234';
 
      await request(app.getHttpServer())
        .post('/auth/signup')
        .send(createUserDto)
        .expect(HttpStatus.BAD_REQUEST);
    });
 
    it('should throw BadRequestException for an invalid email.', async () => {
      createUserDto.email = 'ganada';
 
      await request(app.getHttpServer())
        .post('/auth/signup')
        .send(createUserDto)
        .expect(HttpStatus.BAD_REQUEST);
    });
 
    it('should create a user.', async () => {
      const response = await request(app.getHttpServer())
        .post('/auth/signup')
        .send(createUserDto)
        .expect(HttpStatus.CREATED);
 
      const body = response.body;
 
      expect(body.password).not.toBe(createUserDto.password);
      expect(body.email).toBe(createUserDto.email);
    });
 
    it('should throw ConflictException for a duplicate email.', async () => {
      await request(app.getHttpServer())
        .post('/auth/signup')
        .send(createUserDto)
        .expect(HttpStatus.CREATED);
 
      await request(app.getHttpServer())
        .post('/auth/signup')
        .send(createUserDto)
        .expect(HttpStatus.CONFLICT);
    });
  });
 
  describe('signIn', () => {
    it('should throw BadRequestException for an invalid email.', async () => {
      credentials.email = 'sfaslkf@naver.com';
 
      await request(app.getHttpServer())
        .post('/auth/signin')
        .send(credentials)
        .expect(HttpStatus.BAD_REQUEST);
    });
 
    it('should throw BadRequestException for an invalid password.', async () => {
      credentials.password = '24391!@svz';
 
      await request(app.getHttpServer())
        .post('/auth/signin')
        .send(credentials)
        .expect(HttpStatus.BAD_REQUEST);
    });
 
    it('should sign in a user.', async () => {
      await request(app.getHttpServer())
        .post('/auth/signup')
        .send(createUserDto)
        .expect(HttpStatus.CREATED);
 
      const response = await request(app.getHttpServer())
        .post('/auth/signin')
        .send(credentials)
        .expect(HttpStatus.OK);
 
      const headers = response.headers;
      expect(headers).toBeDefined();
 
      const cookies = headers['set-cookie'].map(
        (cookie: string) => cookie.split(';')[0],
      );
 
      const accessToken = cookies
        .find((cookie: string) => cookie.includes('access_token'))
        .split('=')[1];
      const refreshToken = cookies
        .find((cookie: string) => cookie.includes('refresh_token'))
        .split('=')[1];
 
      const body = response.body;
 
      expect(accessToken).toBeDefined();
      expect(refreshToken).toBeDefined();
      expect(body.email).toBe(credentials.email);
    });
  });
 
  describe('signOut', () => {
    it('should sign out a user.', async () => {
      await request(app.getHttpServer())
        .post('/auth/signup')
        .send(createUserDto)
        .expect(HttpStatus.CREATED);
 
      let response = await request(app.getHttpServer())
        .post('/auth/signin')
        .send(credentials)
        .expect(HttpStatus.OK);
 
      const headers = response.headers;
      expect(headers).toBeDefined();
 
      let cookies = headers['set-cookie'];
 
      response = await request(app.getHttpServer())
        .post('/auth/signout')
        .set('Cookie', cookies)
        .expect(HttpStatus.NO_CONTENT);
 
      cookies = response.headers['set-cookie'].map(
        (cookie: string) => cookie.split(';')[0],
      );
 
      const accessToken = cookies
        .find((cookie: string) => cookie.includes('access_token'))
        .split('=')[1];
      const refreshToken = cookies
        .find((cookie: string) => cookie.includes('refresh_token'))
        .split('=')[1];
 
      expect(accessToken).toBe('');
      expect(refreshToken).toBe('');
    });
  });
 
  afterEach(async () => {
    await mongoose.connection.dropCollection('users');
 
    await app.close();
  });
});
cs
코드를 보면 Mongoose 패키지 자체를 가져온 다음 각 테스트 종료 후 사용자 컬렉션을 비우는 dropCollection() 메서드를 호출한다. 하지만 [ExceptionHandler] Unable to connect to the database. Retrying (1)... 오류가 발생했다! 

TypeORM에서 데이터베이스와 상호작용하기 위해 app.get() 메서드로 TypeORM 패키지의 DataSource를 가져온 것처럼 Mongoose 패키지에서 비슷한 메서드를 찾아야 했다. 검색을 통해 알아보니 mongoose.connect() 메서드가 MongoDB와 기본 연결을 연다고 하며 URI를 인자로 가진다.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
// common.factory.ts
export const buildDatabaseUri = () => {
  return `mongodb://${process.env.DB_USERNAME}:${process.env.DB_PASSWORD}@${process.env.DB_HOST}:${process.env.DB_PORT}/${process.env.DB_DATABASE}`;
};
 
// auth.e2e-spec.ts
describe('Authentication E2E Test', () => {
  let app: INestApplication;
  ...
 
  beforeEach(async () => {
    ...
 
    const moduleFixture: TestingModule = await Test.createTestingModule({
      imports: [AppModule],
    }).compile();
 
    app = moduleFixture.createNestApplication();
    await app.init();
  });
 
  ...
 
  afterEach(async () => {
    // 테스트 환경 데이터베이스 URI를 가져온다.
    mongoose.connect(buildDatabaseUri());
 
    await mongoose.connection.dropCollection('users');
 
    await app.close();
  });
});
cs

테스트를 다시 실행했는데 연결 오류는 사라졌는데 MongoError: ns not found 오류가 나왔다... 이건 뭐지?


데이터베이스 정리

데이터베이스는 정리가 되는데 왜 이런 오류가 발생했는지 알아보니 컬렉션이 없어서 발생하는 오류라고~ 따라서 해결책은 자연스럽게 컬렉션을 생성하면 된다!
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
describe('Authentication E2E Test', () => {
  ... 
 
  afterEach(async () => {
    mongoose.connect(buildDatabaseUri());
    
    // 컬렉션의 모든 도큐먼트를 제거한다.
    await mongoose.connection.dropCollection('users');
    // 컬렉션을 생성한다.
    await mongoose.connection.createCollection('users');
 
    await mongoose.disconnect();
    await app.close();
  });
});
cs

테스트가 성공적으로 통과된다!

update: 2024.02.16

2/09/2024

404 페이지

OAuth 2.0 로그인을 적용을 위해서 정적 파일과 동적 파일을 분리하고 나니 문제가 발생했다. 이전에는 HTML 파일 혹은 존재하지 않는 API 경로를 입력하면 자동으로 '/' 페이지로 리다이렉션 되는데 HTTP 상태코드, 경로, 메시지를 담은 오류 메시지가 그냥 출력되었다. 사용자의 관점에서 이러한 정보는 당연히 필요도 없을 뿐더러 페이지가 아니기에 더욱더 불편하다. 이를 해결하기 위해 404 페이지를 생성하는 과정에서 마주친 여러 문제에 대해서 적어본다.


필터

404 페이지의 이름에서 알 수 있듯이 HTTP 상태코드 404에 해당하는 예외를 다룬다. 따라서, 바로 필터가 떠오른다. 검색을 통해서 필터와 HTML 페이지를 만들었는데 여기서 경로 때문에 고생을 좀 했다. HTML 파일을 담고 있는 public 디렉터리의 위치가 컴파일 전후에 따라 다르기 때문이다. 약간 더 자세하게 말하면 필터가 존재하는 디렉터리의 경로는 컴파일 여부와 관계없이 src/filters 이지만 public 디렉터리는 컴파일 전은 src/public 이지만 컴파일 후는 dist/public이다! 이러한 차이 때문에 시간을 좀 날렸다 그.리고 루트 모듈인 AppModule에서 전역으로 필터를 설정한다.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
// not-found-exception.filter.ts
// HTTP 404 페이지 필터.
@Catch(NotFoundException)
export class NotFoundExceptionFilter implements ExceptionFilter {
  catch(exception: NotFoundException, host: ArgumentsHost) {
    const context = host.switchToHttp();
    const response = context.getResponse<Response>();
  const statusCode = exception.getStatus();
    // root 옵션은 상대적 파일 이름을 위한 루트 디렉터리.
    // 컴파일된 dist 디렉터리를 기준으로 한다.
    const options = {
       root: path.join(__dirname, '..''..''public'),
     };
 
    // 주어진 경로의 파일을 전송한다.
    // root 옵션이 옵션 객체에서 설정되지 않은 경우 경로는 파일에 대한 절대 경로여야 한다.
    response.status(statusCode).sendFile('dne.html', options);
  }
}
 
// app.module.ts
@Module({
  ...
 
  providers: [
    {
      provide: APP_FILTER,
      useClass: AllExceptionFilter,
    },
    {
      provide: APP_FILTER,
      useClass: NotFoundExceptionFilter,
    },
 
  ...
  ],
})
export class AppModule implements NestModule {
  ...
}
cs


HTTP 메서드

필터를 적용하고 try-catch 문을 수정하는데 문제가 발생했다. 사용자 정보수정, 장바구니 수정, 장바구니 삭제와 같은 API는 기본적으로 읽기 연산을 수행하고 원하는 데이터가 없으면 404 상태코드 오류를 던진다. 컨트롤러의 HTTP 메서드는 GET이 아니지만 서비스나 레포지토리에서 404 상태코드 오류가 발생하면 404 HTML 페이지로 리다이렉션이 발생했다.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
// carts.service.ts
// 장바구니를 수정하는 컨트롤러에서 사용하는 서비스 메서드.
// 장바구니가 없으면 HTTP 상태코드 404를 예외로 던진다.  
async update(id: number, updateCartDto: UpdateCartDto, user: User) {
  const { quantity } = updateCartDto;
 
  const cart = await this.cartsRepository.findOne({
    where: { id, user: { id: user.id } },
  });
 
  if (!cart) {
    throw new NotFoundException('아이디에 해당하는 장바구니 없음.');
  }
 
  const price = cart.totalPrice / cart.totalQuantity;
  cart.totalQuantity = quantity;
  cart.totalPrice = price * cart.totalQuantity;
 
  return await this.cartsRepository.save(cart);
}
cs

필터에서 이러한 HTTP 메서드에 대해 예외를 적용하기 위해서 요청 객체에서 HTTP 메서드, URL, 오류 메시지를 뽑아내서 예외를 클라이언트에 반환한다.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
// HTTP 404 페이지 필터.
@Catch(NotFoundException)
export class NotFoundExceptionFilter implements ExceptionFilter {
  catch(exception: NotFoundException, host: ArgumentsHost) {
    const context = host.switchToHttp();
    const request = context.getRequest<Request>();
    const response = context.getResponse<Response>();
    const statusCode = exception.getStatus();

    // 전역으로 적용되는 필터라서 다음 HTTP 메서드는 예외를 적용한다.
    const methods = ['POST''PUT''PATCH''DELETE'];
    const method = request.method;

    if (methods.includes(method)) {
      const timestamp = new Date().toISOString();
      const path = request.originalUrl;
      const message = exception.message;
 
      // 반환문이 없으면 응답이 AllExceptionFilter로 전달되어 두 번의 응답이 전송되어 오류가 발생한다.
      // 반환문을 추가해 클라이언트에 응답을 전송한다.
      return response.status(statusCode).json({
        statusCode,
        message,
        timestamp,
        path,
      });
    }

    // root 옵션은 상대적 파일 이름을 위한 루트 디렉터리.
    // 컴파일된 dist 디렉터리를 기준으로 한다.
    const options = {
       root: path.join(__dirname, '..''..''public'),
    };

    // 주어진 경로의 파일을 전송한다.
    // root 옵션이 옵션 객체에서 설정되지 않은 경우 경로는 파일에 대한 절대 경로여야 한다.
    // HTTP 상태코드가 없으면 장바구니 목록 페이지와 주문 목록 페이지에서 오류가 발생한다.
    response.status(statusCode).sendFile('dne.html', options);
  }
}
cs

여기서 반환문이 정말 중요한데 모든 예외를 잡는 AllExceptionFilter가 전역 필터로 설정되어 있기 때문에 반환문이 없으면 두 번의 응답이 전달되는 오류가 발생한다.


테스트

try-catch 문을 수정해서 테스트를 진행했는데 E2E 테스트에서 문제가 발생했다. 상품 상세 API에서 존재하지 않는 아이디에는 HTTP 404 오류를 던지는데 이상하게 HTTP 500 오류가 나왔다. 테스트의 로그를 보니 HTML 페이지의 위치를 못찾고 있었다. 그러다가 생각해보니 ts-jest 패키지가 떠올랐다. 테스트 실행 시 ts-jest 패키지를 사용하는데 이 패키지는 TypeScript 파일을 로드하고 즉시 JavaScript로 변환하고 실행한다. 즉, Jest가 실행 중일 때 TypeScript 파일을 직접 로드할 수 있다. 바로 여기서 문제가 발생했다. TypeScript 파일을 로드하기 때문에 src 디렉터리에 존재하는 HTML 파일의 경로를 표시해야 한다.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
// HTTP 404 페이지 필터.
@Catch(NotFoundException)
export class NotFoundExceptionFilter implements ExceptionFilter {
  catch(exception: NotFoundException, host: ArgumentsHost) {
    const context = host.switchToHttp();
    const request = context.getRequest<Request>();
    const response = context.getResponse<Response>();
    const statusCode = exception.getStatus();
 
    // 전역으로 적용되는 필터라서 다음 HTTP 요청 메서드는 예외를 적용한다.
    const methods = ['POST''PUT''PATCH''DELETE'];
    const method = request.method;
 
    if (methods.includes(method)) {
      const timestamp = new Date().toISOString();
      const path = request.originalUrl;
      const message = exception.message;
 
      // 반환문이 없으면 응답이 AllExceptionFilter로 전달되어 두 번의 응답이 전송되어 오류가 발생한다.
      // 반환문을 추가해 클라이언트에 응답을 전송한다.
      return response.status(statusCode).json({
        statusCode,
        message,
        timestamp,
        path,
      });
    }
 
    // 개발/운영 vs. 테스트
    const options = {
      root:
        process.env.NODE_ENV === 'test'
          ? path.join(__dirname, '..''public')
          : path.join(__dirname, '..''..''public'),
    };
 
    // 주어진 경로의 파일을 전송한다.
    // root 옵션이 옵션 객체에서 설정되지 않은 경우 경로는 파일에 대한 절대 경로여야 한다.
    // HTTP 상태코드가 없으면 장바구니 목록 페이지와 주문 목록 페이지에서 오류가 발생한다.
    response.status(statusCode).sendFile('dne.html', options);
  }
}
cs

update: 2024.02.09