refactor : 라우터 테스트 코드 수정

src/router/__test__/index.test.js

@@ -17,29 +17,31 @@ const routes = [
 
 describe('router test', () => {
   test('should verify that the pathToRegex function works properly', () => {
-    expect(pathToRegex('/')).toEqual(/^\/$/);
-    expect(pathToRegex('/posts/:id')).toEqual(/^\/posts\/(.+)$/);
-    expect(pathToRegex('/posts')).toEqual(/^\/posts$/);
+    const regex = pathToRegex('/');
+    const regex2 = pathToRegex('/posts/:id');
 
-    expect(pathToRegex('/posts/:id')).not.toEqual(/^\/posts$/);
-    expect(pathToRegex('/posts')).not.toEqual(/^\/posts\/(.+)$/);
+    expect(regex.test('/')).toBeTruthy();
+    expect(regex.test('/posts')).toBeFalsy();
+
+    expect(regex2.test('/posts/3')).toBeTruthy();
+    expect(regex2.test('/posts')).toBeFalsy();
   });
 
   test('should return correct params when the getParams function works properly', () => {
     const pathname = '/posts/1';
-
     const targetRoute = findRoute(routes, pathname);
-
     expect(getParams(targetRoute)).toEqual({ id: '1' });
     expect(getParams(targetRoute).id).not.toBe(2);
     expect(getParams(targetRoute)).not.toEqual({ no: '1' });
   });
 
-  test('should return correct queryParams when the findRoute function works properly', () => {
-    const search = '?a=1&b=2';
+  test('should return correct queryParams when the getQueryParams function works properly', () => {
+    const url = 'https://www.google.com?a=1&b=2';
+    const url2 = 'https://www.google.com?a=1b=2';
 
-    expect(getQueryParams(search)).toEqual({ a: '1', b: '2' });
-    expect(getQueryParams(search)).not.toEqual({ a: '1', b: '3' });
+    expect(getQueryParams(url)).toEqual({ a: '1', b: '2' });
+    expect(getQueryParams(url)).not.toEqual({ a: '1', b: '3' });
+    expect(getQueryParams(url2)).not.toEqual({ a: '1', b: '2' });
   });
 
   test('should verify that the findRoute function works properly', () => {

src/router/index.js

@@ -19,7 +19,7 @@ const renderRoute = () => {
   if (!targetRoute) return;
 
   const params = getParams(targetRoute);
-  const queryParams = getQueryParams(location.search);
+  const queryParams = getQueryParams(location);
 
   document.querySelector('#app').innerHTML = targetRoute.route.page({
     params,

src/router/utils.js

@@ -11,8 +11,10 @@ export const getParams = (target) => {
   return Object.fromEntries(keys.map((key, index) => [key, values[index]]));
 };
 
-export const getQueryParams = (search) => {
-  const urlSearchParams = new URLSearchParams(search);
+export const getQueryParams = (location) => {
+  const url = new URL(location);
+
+  const urlSearchParams = new URLSearchParams(url.search);
 
   return Object.fromEntries(urlSearchParams.entries());
 };