refactor: moved code into correct methods, added more tests

phpmyfaq/admin/assets/src/api/forms.test.ts

@@ -0,0 +1,260 @@
+import { describe, it, expect, vi } from 'vitest';
+import {
+  fetchActivateInput,
+  fetchSetInputAsRequired,
+  fetchEditTranslation,
+  fetchDeleteTranslation,
+  fetchAddTranslation,
+} from './forms';
+
+describe('fetchActivateInput', () => {
+  it('should activate input and return JSON response if successful', async () => {
+    const mockResponse = { success: true };
+    global.fetch = vi.fn(() =>
+      Promise.resolve({
+        status: 200,
+        json: () => Promise.resolve(mockResponse),
+      } as Response)
+    );
+
+    const csrf = 'csrfToken';
+    const formId = 'formId';
+    const inputId = 'inputId';
+    const checked = true;
+    const result = await fetchActivateInput(csrf, formId, inputId, checked);
+
+    expect(result).toEqual(mockResponse);
+    expect(global.fetch).toHaveBeenCalledWith('api/forms/activate', {
+      method: 'POST',
+      headers: {
+        Accept: 'application/json, text/plain, */*',
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({
+        csrf: csrf,
+        formid: formId,
+        inputid: inputId,
+        checked: checked,
+      }),
+    });
+  });
+
+  it('should throw an error if the network response is not ok', async () => {
+    global.fetch = vi.fn(() =>
+      Promise.resolve({
+        status: 500,
+      } as Response)
+    );
+
+    const csrf = 'csrfToken';
+    const formId = 'formId';
+    const inputId = 'inputId';
+    const checked = true;
+
+    await expect(fetchActivateInput(csrf, formId, inputId, checked)).rejects.toThrow('Network response was not ok.');
+  });
+});
+
+describe('fetchSetInputAsRequired', () => {
+  it('should set input as required and return JSON response if successful', async () => {
+    const mockResponse = { success: true };
+    global.fetch = vi.fn(() =>
+      Promise.resolve({
+        status: 200,
+        json: () => Promise.resolve(mockResponse),
+      } as Response)
+    );
+
+    const csrf = 'csrfToken';
+    const formId = 'formId';
+    const inputId = 'inputId';
+    const checked = true;
+    const result = await fetchSetInputAsRequired(csrf, formId, inputId, checked);
+
+    expect(result).toEqual(mockResponse);
+    expect(global.fetch).toHaveBeenCalledWith('api/forms/required', {
+      method: 'POST',
+      headers: {
+        Accept: 'application/json, text/plain, */*',
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({
+        csrf: csrf,
+        formid: formId,
+        inputid: inputId,
+        checked: checked,
+      }),
+    });
+  });
+
+  it('should throw an error if the network response is not ok', async () => {
+    global.fetch = vi.fn(() =>
+      Promise.resolve({
+        status: 500,
+      } as Response)
+    );
+
+    const csrf = 'csrfToken';
+    const formId = 'formId';
+    const inputId = 'inputId';
+    const checked = true;
+
+    await expect(fetchSetInputAsRequired(csrf, formId, inputId, checked)).rejects.toThrow(
+      'Network response was not ok.'
+    );
+  });
+});
+
+describe('fetchEditTranslation', () => {
+  it('should edit translation and return JSON response if successful', async () => {
+    const mockResponse = { success: true };
+    global.fetch = vi.fn(() =>
+      Promise.resolve({
+        status: 200,
+        json: () => Promise.resolve(mockResponse),
+      } as Response)
+    );
+
+    const csrf = 'csrfToken';
+    const formId = 'formId';
+    const inputId = 'inputId';
+    const label = 'label';
+    const lang = 'en';
+    const result = await fetchEditTranslation(csrf, formId, inputId, label, lang);
+
+    expect(result).toEqual(mockResponse);
+    expect(global.fetch).toHaveBeenCalledWith('api/forms/translation-edit', {
+      method: 'POST',
+      headers: {
+        Accept: 'application/json, text/plain, */*',
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({
+        csrf: csrf,
+        formId: formId,
+        inputId: inputId,
+        lang: lang,
+        label: label,
+      }),
+    });
+  });
+
+  it('should throw an error if the network response is not ok', async () => {
+    global.fetch = vi.fn(() =>
+      Promise.resolve({
+        status: 500,
+      } as Response)
+    );
+
+    const csrf = 'csrfToken';
+    const formId = 'formId';
+    const inputId = 'inputId';
+    const label = 'label';
+    const lang = 'en';
+
+    await expect(fetchEditTranslation(csrf, formId, inputId, label, lang)).rejects.toThrow(
+      'Network response was not ok.'
+    );
+  });
+});
+
+describe('fetchDeleteTranslation', () => {
+  it('should delete translation and return JSON response if successful', async () => {
+    const mockResponse = { success: true };
+    global.fetch = vi.fn(() =>
+      Promise.resolve({
+        status: 200,
+        json: () => Promise.resolve(mockResponse),
+      } as Response)
+    );
+
+    const csrf = 'csrfToken';
+    const formId = 'formId';
+    const inputId = 'inputId';
+    const lang = 'en';
+    const result = await fetchDeleteTranslation(csrf, formId, inputId, lang);
+
+    expect(result).toEqual(mockResponse);
+    expect(global.fetch).toHaveBeenCalledWith('api/forms/translation-delete', {
+      method: 'POST',
+      headers: {
+        Accept: 'application/json, text/plain, */*',
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({
+        csrf: csrf,
+        formId: formId,
+        inputId: inputId,
+        lang: lang,
+      }),
+    });
+  });
+
+  it('should throw an error if the network response is not ok', async () => {
+    global.fetch = vi.fn(() =>
+      Promise.resolve({
+        status: 500,
+      } as Response)
+    );
+
+    const csrf = 'csrfToken';
+    const formId = 'formId';
+    const inputId = 'inputId';
+    const lang = 'en';
+
+    await expect(fetchDeleteTranslation(csrf, formId, inputId, lang)).rejects.toThrow('Network response was not ok.');
+  });
+});
+
+describe('fetchAddTranslation', () => {
+  it('should add translation and return JSON response if successful', async () => {
+    const mockResponse = { success: true };
+    global.fetch = vi.fn(() =>
+      Promise.resolve({
+        status: 200,
+        json: () => Promise.resolve(mockResponse),
+      } as Response)
+    );
+
+    const csrf = 'csrfToken';
+    const formId = 'formId';
+    const inputId = 'inputId';
+    const lang = 'en';
+    const translation = 'translation';
+    const result = await fetchAddTranslation(csrf, formId, inputId, lang, translation);
+
+    expect(result).toEqual(mockResponse);
+    expect(global.fetch).toHaveBeenCalledWith('api/forms/translation-add', {
+      method: 'POST',
+      headers: {
+        Accept: 'application/json, text/plain, */*',
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({
+        csrf: csrf,
+        formId: formId,
+        inputId: inputId,
+        lang: lang,
+        translation: translation,
+      }),
+    });
+  });
+
+  it('should throw an error if the network response is not ok', async () => {
+    global.fetch = vi.fn(() =>
+      Promise.resolve({
+        status: 500,
+      } as Response)
+    );
+
+    const csrf = 'csrfToken';
+    const formId = 'formId';
+    const inputId = 'inputId';
+    const lang = 'en';
+    const translation = 'translation';
+
+    await expect(fetchAddTranslation(csrf, formId, inputId, lang, translation)).rejects.toThrow(
+      'Network response was not ok.'
+    );
+  });
+});

phpmyfaq/admin/assets/src/api/forms.ts

@@ -14,9 +14,6 @@
  * @since     2014-03-21
  */
 
-import { pushNotification } from '../../../../assets/src/utils';
-import { Response } from '../interfaces';
-
 export const fetchActivateInput = async (
   csrf: string,
   formId: string,
@@ -38,18 +35,12 @@ export const fetchActivateInput = async (
       }),
     });
 
-    if (response.ok) {
-      const result: Response = await response.json();
-      if (result.success) {
-        pushNotification(result.success); // @todo move that to the forms.ts file in the content folder
-      } else {
-        console.error(result.error);
-      }
+    if (response.status === 200) {
+      return await response.json();
     } else {
-      throw new Error('Network response was not ok: ' + (await response.text()));
+      throw new Error('Network response was not ok.');
     }
   } catch (error) {
-    console.error('Error activating/deactivating input:', error);
     throw error;
   }
 };
@@ -75,18 +66,12 @@ export const fetchSetInputAsRequired = async (
       }),
     });
 
-    if (response.ok) {
-      const result: Response = await response.json();
-      if (result.success) {
-        pushNotification(result.success); // @todo move that to the forms.ts file in the content folder
-      } else {
-        console.error(result.error);
-      }
+    if (response.status === 200) {
+      return await response.json();
     } else {
-      throw new Error('Network response was not ok: ' + (await response.text()));
+      throw new Error('Network response was not ok.');
     }
   } catch (error) {
-    console.error('Error setting input as required:', error);
     throw error;
   }
 };
@@ -114,18 +99,12 @@ export const fetchEditTranslation = async (
       }),
     });
 
-    if (response.ok) {
-      const result: Response = await response.json();
-      if (result.success) {
-        pushNotification(result.success); // @todo move that to the forms.ts file in the content folder
-      } else {
-        console.error(result.error);
-      }
+    if (response.status === 200) {
+      return await response.json();
     } else {
-      throw new Error('Network response was not ok: ' + (await response.text()));
+      throw new Error('Network response was not ok.');
     }
   } catch (error) {
-    console.error('Error editing translation:', error);
     throw error;
   }
 };
@@ -134,8 +113,7 @@ export const fetchDeleteTranslation = async (
   csrf: string,
   formId: string,
   inputId: string,
-  lang: string,
-  element: HTMLElement
+  lang: string
 ): Promise<void> => {
   try {
     const response = await fetch('api/forms/translation-delete', {
@@ -152,23 +130,12 @@ export const fetchDeleteTranslation = async (
       }),
     });
 
-    if (response.ok) {
-      const result: Response = await response.json();
-      if (result.success) {
-        // @todo move that to the forms.ts file in the content folder
-        pushNotification(result.success);
-        document.getElementById('item_' + element.getAttribute('data-pmf-lang'))?.remove();
-        const option = document.createElement('option');
-        option.innerText = element.getAttribute('data-pmf-langname')!;
-        document.getElementById('languageSelect')?.appendChild(option);
-      } else {
-        console.error(result.error);
-      }
+    if (response.status === 200) {
+      return await response.json();
     } else {
-      throw new Error('Network response was not ok: ' + (await response.text()));
+      throw new Error('Network response was not ok.');
     }
   } catch (error) {
-    console.error('Error deleting translation:', error);
     throw error;
   }
 };
@@ -196,22 +163,12 @@ export const fetchAddTranslation = async (
       }),
     });
 
-    if (response.ok) {
-      const result: Response = await response.json();
-      if (result.success) {
-        // @todo move that to the forms.ts file in the content folder
-        pushNotification(result.success);
-        setTimeout(function () {
-          window.location.reload();
-        }, 3000);
-      } else {
-        console.error(result.error);
-      }
+    if (response.status === 200) {
+      return await response.json();
     } else {
-      throw new Error('Network response was not ok: ' + (await response.text()));
+      throw new Error('Network response was not ok.');
     }
   } catch (error) {
-    console.error('Error adding translation:', error);
     throw error;
   }
 };